我有一个带有视图按钮的网格。单击视图按钮时,将打开模式对话框并显示表单中的所有信息。
我的模态对话框中还有一个按钮(buttonID:Button1)。问题是当我点击对话框内的按钮时没有任何反应。
这是我到目前为止所做的:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AddUser.aspx.cs" Inherits="AddUser" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js'></script>
<link href ="http://code.jquery.com/ui/1.11.4/themes/ui-Lightnes/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="js/index.js"></script>
<link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css'/>
<link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css'/>
<link rel='stylesheet prefetch' href='http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css'/>
<link rel="stylesheet" href="css/style.css"/>
<script>
function popup(idn, un, ps, em) {
$("#userid").text(idn);
$("#usern").text(un);
$("#pwd").text(ps);
$("#eml").text(em);
$("#popupdiv").dialog({
closeOnEscape: false,
position: 'fixed',
width: 1080,
height: 500,
autoOpen: true,
modal: true,
open: function (event, ui) {
$(".ui-dialog-titlebar-close", ui.dialog | ui).hide();
},
buttons: {
Close: function () {
$(this).dialog("close");
}
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server" >
<asp:Button ID="btnAddUser" runat="server" Text="Add New User" OnClick="btnAddUser_Click" />
<asp:GridView AutoGenerateColumns="false" ID="gvUsers" runat="server" PagerStyle-CssClass="pager"
HeaderStyle-CssClass="header" RowStyle-CssClass="rows"
CssClass="mydatagrid" AllowPaging="True"
ShowHeaderWhenEmpty="true"
BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3">
<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
<Columns>
<asp:BoundField DataField="UserID" HeaderText="UserID" />
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Password" HeaderText="Password" />
<asp:BoundField DataField="Email" HeaderText="Email" />
<asp:TemplateField>
<ItemTemplate>
<img src="images/edit.png" id="imgBtn" style="width:20px; height:20px" onclick='popup("<%# Eval("UserID") %>", "<%# Eval("Username") %>","<%# Eval("Password") %>","<%# Eval("Email") %>")'></>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<div class="container">
<div id="popupdiv" style=" margin: auto;
width: 100%;
padding: 10px;
background-color: #333333;
background-color: #333333; ">
<div class="well form-horizontal" id="contact_form">
<fieldset>
<div class="form-group">
<label class="col-md-4 control-label">Username</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<textarea id="userid" runat="server" style="width:250px; height:35px; resize: none" name="first_name" class="form-control"></textarea>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" >Password</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<textarea type="text" id="usern" runat="server" style="width:250px; height:35px; resize: none" class="form-control"></textarea>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label">E-Mail</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<textarea type="text" id="pwd" runat="server" style="width:250px; height:35px; resize: none" class="form-control"></textarea>
</div>
</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label">User Role</label>
<div class="col-md-4 selectContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<textarea type="text" id="eml" runat="server" style="width:250px; height:35px; resize: none" class="form-control" ></textarea>
</div>
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label"></label>
<div class="col-md-4">
<asp:Button ID="Button1" data-dismiss="modal" class="btn btn-warning" runat="server" Text="Submit" OnClick="Button1_Click1"/>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</form>
</body>
</html>
我的按钮功能代码,但它不起作用
protected void Button1_Click1(object sender, EventArgs e)
{
Response.Redirect("~/AddNewUser.aspx");
}
答案 0 :(得分:3)
尝试在按钮中使用UseSubmitBehavior="false"
:
<asp:Button ID="Button1" data-dismiss="modal" class="btn btn-warning" runat="server"
Text="Submit" UseSubmitBehavior="false" OnClick="Button1_Click1"/>
答案 1 :(得分:1)
最可能的问题是模式是在外部表单中创建的,因此如果按钮是在表单外部创建的,则无法使用。
大多数模态都可以设置模态的创建位置。例如,jquery-ui
具有appendTo属性。因此,如果您设置appendTo: 'FORM'
,它将在表单内创建模式,您的按钮将按预期工作。