【发布时间】：2013-05-08 19:09:24
【问题描述】：
我在jQuery 对话框中有一个asp:Button，OnClick 事件没有触发。我正在使用PostBackUrl 属性导航到另一个页面，但我想在OnClick 事件中设置这个属性，以便我可以根据a 的名称附加一个查询字符串变量他们在对话框中上传的文件。我之前发布了一个关于此对话框的问题，因为我根本无法将其发回，但这已得到修复。单击按钮回发很好，我可以在 asp 标记中设置PostBackUrl 属性，或者在后面代码的Page_Load() 中设置。但由于某种原因，我无法触发OnClick 函数，这就是我想要设置PostBackUrl 的地方。这是 .aspx...
<form id="frmDialog" runat="server">
<asp:Button ID="btnDisplayDialog" runat="server" Text="Click to Display Login Dialog" OnClientClick="showDialog(); return false;" />
<div class="divInnerForm"></div>
<div class="divDialog" style="display: none">
<table style="width: 100%;">
<tr>
<td>First Name: <asp:TextBox ID="txtFirstName" runat="server" Text=""></asp:TextBox></td>
<td>Last Name: <asp:TextBox ID="txtLastName" runat="server" Text=""></asp:TextBox></td>
</tr>
<tr>
<td>
How Old are You?
<asp:DropDownList ID="ddlAge" runat="server">
<asp:ListItem Value="1">1</asp:ListItem>
<asp:ListItem Value="2">2</asp:ListItem>
<asp:ListItem Value="3">3</asp:ListItem>
</asp:DropDownList>
</td>
<td>
How Many Siblings do You Have?
<asp:DropDownList ID="ddlNumberSiblings" runat="server">
<asp:ListItem Value="1">1</asp:ListItem>
<asp:ListItem Value="2">2</asp:ListItem>
<asp:ListItem Value="3">3</asp:ListItem>
<asp:ListItem Value="4">4</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
What is your birthday?
<input type="text" id="datepicker" name="datepicker" />
</td>
</tr>
<tr>
<td>
Please Choose a Picture to Upload:
<asp:FileUpload ID="fupUserPicture" runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnUserPicture_Click" />
</td>
</tr>
</table>
</div>
</form>
...显示对话框并将其放置在表单中的 jQuery 脚本...
function showDialog() {
$('.divDialog').dialog({
modal: true, show: 'slide', width: 500,
open: function (event, ui) {
$('.divInnerForm').append($(this).parent());
}
});
}
...以及我的 OnClick 函数背后的代码....
protected void btnUserPicture_Click(object sender, EventArgs e)
{
string fileName = "";
if (fupUserPicture.HasFile)
{
try
{
fileName = Path.GetFileName(fupUserPicture.FileName);
fupUserPicture.SaveAs(Server.MapPath("~/Images/" + fileName));
}
catch (Exception ex)
{
}
btnSubmit.PostBackUrl = "~/Profile.aspx?pic=" + fileName;
}
}
编辑：好的，这是对话框中的提交按钮实际呈现为 HTML 的方式。我认为这可能是问题所在。如您所见，javascript onclick 只是提供“Profile.aspx”作为回发网址，尽管在我看来任何服务器端代码都应该首先执行。这是在表格内...
<input id="btnSubmit" type="submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("btnSubmit", "", false, "", "Profile.aspx", false, false))" value="Submit" name="btnSubmit">
..如果我从Page_Load() 函数中删除btnSubmit.PostBackUrl = "~/Profile.aspx"，它的呈现方式如下......
<input id="btnSubmit" type="submit" value="Submit" name="btnSubmit">
编辑2：好的，所以我在对话框外添加了另一个隐藏的asp按钮，对话框内的按钮现在调用一个javascript函数，触发隐藏按钮的OnClick事件。同样的事情，javascript函数运行良好，但btnHidden_Click()函数does not run!我完全不知所措，此时我真的不知道为什么这不起作用。这是新的隐藏按钮，在对话框 div 之外，但在表单内部，如您所见....
</div>
<asp:Button ID="btnHidden" runat="server" Text="" Visible="false" ClientIDMode="Predictable" OnClick="btnHidden_Click"/>
</form>
...这是对话框中带有 OnClientClick 事件的按钮，正如我所说的，它运行良好...
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick="forcebtnHiddenClick(); return false;" />
这是 btnHidden 后面代码中的 OnClick 函数，虽然它和之前完全一样...
protected void btnHidden_Click(object sender, EventArgs e)
{
string fileName = "";
if (fupUserPicture.HasFile)
{
try
{
fileName = Path.GetFileName(fupUserPicture.FileName);
fupUserPicture.SaveAs(Server.MapPath("~/Images/" + fileName));
}
catch (Exception ex)
{
}
Response.Redirect("~/Profile.aspx?pic=" + fileName);
}
}
...以及 运行的 javascript 函数，但由于某种原因不会导致 btnHidden_Click 运行...
function forcebtnHiddenClick(e) {
//__doPostBack('btnHidden', 'OnClick');
$('#btnHidden').trigger('click');
}
..如您所见，我尝试了 .trigger('click') 和 __doPostBack()，均无济于事。
编辑：好的，所以问题肯定是
function forcebtnHiddenClick() {
__doPostBack('btnHidden', '');
}
函数，它实际上并没有触发btnHidden_Click 事件。当我使btnHidden可见并直接单击它时，btnHidden_Click函数运行正常。
编辑：经过大量搜索，找到了这个并让它工作......
function forcebtnHiddenClick() {
<%= ClientScript.GetPostBackEventReference(btnHidden, string.Empty) %>;
}
不知道为什么
__doPostBack(<%= btnHidden.ClientID %>, '')
没用。
【问题讨论】：
-
语句是什么 $('.divInnerForm').append($(this).parent());试图chaeiev？尝试评论它..
-
我不明白当您说按钮回发正常但 onclick 不触发时。单击事件将生成回发。您是说当页面通过回发时，按钮事件处理程序是当你在它上面设置一个断点时没有被击中？
-
@pranag 没有该脚本 jQuery 在页面呈现时将对话框移到表单之外
-
@Abide 如果我设置属性 PostBackUrl，单击该按钮将返回到我设置的 url。但是，设置 OnClick 事件不会导致事件触发。因此，如果我将 PostBackUrl inside 设置为事件函数，比如 btn_Click，它只会回发到同一页面。但是，如果我在 Page_Load 函数或 asp 标记中设置 PostBackUrl，单击该按钮将返回到预期的页面。所以 OnClick 事件根本不会触发。
-
@Abide 是的，我就是这么说的，对不起。
标签： javascript jquery asp.net post onclick