我有一个asp.net
网络表单应用程序,我想传递在asp:TextBox
中为用户名输入的值,然后显示在我的确认模式中。
HTML
<div class="form-group">
<asp:Label runat="server" AssociatedControlID="txtRemoveUser" CssClass="col-sm-offset-2 col-sm-3 control-label">Enter Name To Be Removed</asp:Label>
<div class="col-sm-3">
<asp:TextBox runat="server" ID="txtRemoveUser" CssClass="form-control" />
</div>
</div>
<!-- Confirm Delete Modal-->
<div class="modal fade" id="removeUserModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header ConfirmHeader">
<h4 class="modal-title" id="myModalLabel">Confirm Removal</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to remove <b><%= txtRemoveUser.Text %></b> from the payday lunch list?</p>
<p>If you don't, click 'No' and the removal request will not be sent.</p>
</div>
<div class="modal-footer ConfirmFooter">
<asp:Button id="btnRemoveConfirmYes" runat="server" CssClass="btn btn-success" Text="Yes" OnClick="btnRemoveConfirmYes_Click" ToolTip="Click to request user to be removed from the payday lunch list." />
<button id="btnRemoveConfirmNo" type="button" class="btn btn-warning" data-dismiss="modal" title="Click to close this screen. The request will not be sent.">No</button>
</div>
</div>
</div>
</div>
我尝试了以下<%= txtRemoveUser.Text %>
,但它无法正常工作。
答案 0 :(得分:2)
<%= txtRemoveUser.Text %>
无法正常工作,因为它只会在初始页面加载或回发期间输出文本框的值。您将需要使用JavaScript来检索客户端的值,但您需要知道控件的ID。这可以使用<%= txtRemoveUser.ClientID %>
看起来你正在使用Bootstrap&#39; s Modal(后者又包含jQuery)。他们的文档有一节varying content。
这将使您的代码看起来大致如下:
$('#removeUserModal').on('show.bs.modal', function (event) {
var user = $('#<%= txtRemoveUser.ClientID %>').val();
$('.modal-body b', this).text(user);
});
工作代码段(不包括.NET控件):
$('#removeUserModal').on('show.bs.modal', function (event) {
var user = $('#txtRemoveUser').val();
$('.modal-body b', this).text(user);
});
&#13;
<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.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="form-group">
<label for="txtRemoveUser" class="col-sm-offset-2 col-sm-3 control-label">Enter Name To Be Removed</label>
<div class="col-sm-3">
<input type="textbox" ID="txtRemoveUser" CssClass="form-control" />
<input type="button" value="Remove" data-toggle="modal" data-target="#removeUserModal" />
</div>
</div>
<div class="modal fade" id="removeUserModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header ConfirmHeader">
<h4 class="modal-title" id="myModalLabel">Confirm Removal</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to remove <b>[name]</b> from the payday lunch list?</p>
<p>If you don't, click 'No' and the removal request will not be sent.</p>
</div>
<div class="modal-footer ConfirmFooter">
<button type="button" class="btn btn-success">Yes</button>
<button id="btnRemoveConfirmNo" type="button" class="btn btn-warning" data-dismiss="modal" title="Click to close this screen. The request will not be sent.">No</button>
</div>
</div>
</div>
</div>
&#13;
答案 1 :(得分:1)
当您显示在服务器上定义的原始值时,该方法有效;如果要显示用户更改的值,请将<%= txtRemoveUser.Text %>
代码替换为:
<span id="removeUserLabel"></span>
在显示模态之前,请使用此脚本将其复制到范围:
$("#removeUserLabel").html(
$("#<%= txtRemoveUser.ClientID %>").val()
);
使用jquery或纯JavaScript:
var span= document.getElementById("removeUserLabel");
var input = document.getElementById("<%= txtRemoveUserID.ClientID %>").value;
span.innerHTML = input;
然后该值将正确显示。