Jansy Bootstrap图像上传用户头像 - 编辑用户时

Question

我使用Jansy的Bootstrap通过我的管理控制台上传用户头像，如下例所示：http://www.jasny.net/bootstrap/javascript/#fileinput-examples。

添加新用户时一切都很好，但是在编辑用户时我需要默认情况下在插件中显示用户的头像，所以基本上我需要图像的状态上传插件就像我选择一张图片后一样。

有可能吗？

Answer 1

是的，你可以通过JavaScript（jQuery）实现这一点！

所以，当你在edit user page时，你需要拥有用户数据（id，name，...，avatar）。您需要avatar.extension才能填充输入文件。 （例如picture1.jpg）这不是问题，因为这些数据存储在您的数据库中。

考虑到您将图片名称保存在javascript avatar变量中，输入类型文件名为avatar，您只需在文件中添加以下代码即可：< / p>

var avatar="user_avatar.jpg";

if (avatar != '') {
    $('.fileinput').addClass('fileinput-exists').removeClass('fileinput-new');
    $('.fileinput-filename').html(avatar);
}

使用此代码，您可以将add state更改为此edit state此自定义文件输入。

我甚至为你做了一个证明这个有效的例子，你可以检查它here。

您甚至可以尝试在该示例上上传图片，以便在页面刷新后看到该上传的edit state。您也可以使用firebug检查代码，以防您不理解或甚至问我。