我试图使用onclick按钮在模态文本框中显示用户名,我在onclick上有一个按钮,我正在调用onclick="getUserName(this.id)"。
this.id 告诉我我想要的名字
modal textbox userName,这是我的函数
function getUserName(username) {
$('#editUserPopUp').bind('show',function(){
alert(username);
$("#userName").val(username);
});
}我在alert(username)中获取用户名,但如何将该值设置为我的模式用户名文本字段
,这是我的Modal
<div class="modal fade" id=editUserPopUp tabindex="-1"
role="dialog" aria-labelledby="helpModalLabel" aria-hidden="true">
<div class="modal-dialog ">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Update Password</h4>
</div>
<div class="modal-body">
<form class="EditUserBody" role="form" id="usermanagement_editUser="novalidate" method="POST">
<div class="input-group col-md-8">
<span class="input-group-addon">User Name</span>
<input class="form-control" id="userName" type="text" class="input-medium" disabled />
</div>
</form>
</div>
</div>
</div>
</div> 发布于 2015-08-14 07:54:35
这应该能行。
但是,您还应该查看有关模态窗口的Bootstrap文档。有一节解释了如何改变情态内容。
Varying modal content based on trigger button
使用event.relatedTarget和HTML *属性(可能通过jQuery)根据单击哪个按钮改变模式的内容。
function getUserName(username) {
var $modal = $('#editUserPopUp'),
$userName = $modal.find('#userName');
$userName.val(username);
$modal.modal("show");
}<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<button onclick="getUserName(this.id)" id="Foo Bar">Open Modal</button>
<div class="modal fade" id=editUserPopUp tabindex="-1"
role="dialog" aria-labelledby="helpModalLabel" aria-hidden="true">
<div class="modal-dialog ">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Update Password</h4>
</div>
<div class="modal-body">
<form class="EditUserBody" role="form" id="usermanagement_editUser="novalidate" method="POST">
<div class="input-group col-md-8">
<span class="input-group-addon">User Name</span>
<input class="form-control" id="userName" type="text" class="input-medium" disabled />
</div>
</form>
</div>
</div>
</div>
</div>
发布于 2015-08-14 07:25:37
我认为问题在于您使用的是show事件,而是尝试调用shown事件,如下所示:
function getUserName(username) {
$('#editUserPopUp').modal('show');
$('#editUserPopUp').on('shown', function () {
alert(username);
$("#userName").val(username);
})
}p/s :没有测试。希望能帮上忙。如果不起作用,请发表评论。
https://stackoverflow.com/questions/32004291
复制相似问题