我是bootstrap的新手，我遇到的问题是我无法更新在用户调用对话框之前在模态中找到的文本框。我尝试了所有方法，从javascript更新文本框甚至服务器端语言c＃，但似乎没有更新内部的文本框。
这是我的代码：
<head id="Head1" runat="server">
<script type="text/javascript">
function func(name)
{
//triggered when modal is about to be shown
$('#edit').on('show.bs.modal', function (e) {
//get data-id attribute of the clicked element
var bookId = $(e.relatedTarget).data('id');
//populate the textbox
$(e.currentTarget).find('input[name="mohsintext"]').val(bookId);
});
}
</script>
</head>
<body>
<!--/#middle-->
<section id="middle">
<div class="container">
<div class="row">
<div class="col-md-12">
<h4>Your Cases</h4>
<div class="table-responsive">
<table id="mytable" class="table table-bordred table-striped">
<thead>
<th><input type="checkbox" id="checkall" /></th>
<th>Case Title</th>
<th>Case Description</th>
<th>Origin</th>
<%--<th>Email</th>
<th>Contact</th>--%>
<th>Edit</th>
<th>Delete</th>
</thead>
<tbody>
<asp:Repeater ID="repPeople" runat="server" >
<ItemTemplate>
<tr>
<td><input type="checkbox" class="checkthis" /></td>
<td><%# Eval("Title") %></td>
<td><%# Eval("Description") %></td>
<td><%# Eval("Origin") %></td>
<%--<td><%# Eval("First Name") %></td>
<td><%# Eval("First Name") %></td>--%>
<td><p data-placement="top" data-toggle="tooltip" title="Edit"><asp:LinkButton id="LinkButton1" runat="server" data-id="ISBN-001122" class="open-AddBookDialog btn btn-primary btn-xs" data-title="Edit" data-toggle="modal" data-target="#edit" > <span class="glyphicon glyphicon-pencil"></span></asp:LinkButton></p></td>
<td><p data-placement="top" data-toggle="tooltip" title="Delete"><asp:LinkButton ID="LinkButton2" runat="server" class="btn btn-danger btn-xs" data-title="Delete" data-toggle="modal" data-target="#delete" ><span class="glyphicon glyphicon-trash"></span></asp:LinkButton></p></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="modal fade" id="edit" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
<div class="modal-dialog" id="my_modal">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<h4 class="modal-title custom_align" id="Heading">Edit Your Detail</h4>
</div>
<div class="modal-body">
<div class="form-group">
<asp:TextBox runat="server" class="form-control " type="text" id="mohsintext" name="mohsintext"/>
</div>
<div class="form-group">
<input class="form-control " type="text" placeholder="Irshad"/>
</div>
<div class="form-group">
<textarea rows="2" class="form-control" placeholder="CB 106/107 Street # 11 Wah Cantt Islamabad Pakistan"></textarea>
<div id="myDialogText"></div>
</div>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-warning btn-lg" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span> Update</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<h4 class="modal-title custom_align" id="H1">Delete this entry</h4>
</div>
<div class="modal-body">
<div class="alert alert-danger"><span class="glyphicon glyphicon-warning-sign"></span> Are you sure you want to delete this Record?</div>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-success" ><span class="glyphicon glyphicon-ok-sign"></span> Yes</button>
<button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> No</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
</section>
<!-- Back To Top -->
<script type="text/javascript">
jQuery(document).ready(function () {
var offset = 300;
var duration = 500;
jQuery(window).scroll(function () {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function (event) {
event.preventDefault();
jQuery('html, body').animate({ scrollTop: 0 }, duration);
return false;
})
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$("#mytable #checkall").click(function () {
if ($("#mytable #checkall").is(':checked')) {
$("#mytable input[type=checkbox]").each(function () {
$(this).prop("checked", true);
});
} else {
$("#mytable input[type=checkbox]").each(function () {
$(this).prop("checked", false);
});
}
});
$("[data-toggle=tooltip]").tooltip();
});
</script>
</form>
</body>
</html>
我使用了几种javascript方法来尝试更新文本框元素，但没有任何效果。请注意，我已删除了一些不必要的代码，使其更具可读性，例如指向引导css文件的链接等。
答案 0 :(得分：0)
将脚本放在文档的底部...我认为jQuery试图在呈现之前绑定#edit。由于jQuery查询DOM以绑定事件，因此在尝试绑定之前需要存在。