У меня очень простое веб-приложение asp.net для тестирования. Существует одна <asp:Button>
которая выдает диалог jQuery. В этом диалоговом окне есть еще одна <asp:Button>
которая делает <div>
видимым, и в этом <div>
есть третья <asp:Button>
. Пока все в порядке. Теперь, согласно моему коду, третья кнопка должна появиться во втором диалоговом окне jQuery, но этого никогда не произойдет. Где я ошибаюсь?
Вот мой код aspx:
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
<asp:Button ID="btn" runat="server" Text="btn" />
<div id="div1">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<table>
<tr>
<td>
<asp:Button ID="btn1" runat="server" Text="btn1" OnClick="btn1_Click" />
</td>
<td>
<div id="div2" runat="server" visible="false">
<asp:Button ID="btn2" runat="server" Text="btn2" />
</div>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="div3" style="display:none">
<h1>test</h1>
</div>
И вот код для jQuery:
<script type="text/javascript">
var dialogOpts = {
resizable: false,
bgiframe: true,
autoOpen: false,
width: "710px"
};
$('#div3').dialog(dialogOpts).parent().appendTo($("#form1"));;
$(function () {
$("#div3").dialog({
maxWidth: 1050,
maxHeight: 534,
width: 1050,
height: 534,
resizable: false,
autoOpen: false,
buttons: {
Cancel: function () {
$(this).dialog("close");
}
}
});
$("#btn2").click(function () {
$("#div3").dialog("open");
return false
});
});
</script>
<script type="text/javascript">
var dialogOpts = {
resizable: false,
bgiframe: true,
autoOpen: false,
width: "710px"
};
$('#div1').dialog(dialogOpts).parent().appendTo($("#form1"));;
$(function () {
$("#div1").dialog({
maxWidth: 1050,
maxHeight: 534,
width: 1050,
height: 534,
resizable: false,
autoOpen: false,
buttons: {
Cancel: function () {
$(this).dialog("close");
}
}
});
$("#btn").click(function () {
$("#div1").dialog("open");
return false
});
});
</script>
Он помещается в тело, и пока появляется только первый jQuery. И это моя функция С#, которая делает второй <div>
видимым:
protected void btn1_Click(object sender, EventArgs e)
{
div2.Visible = true;
}
visible = false
по существу препятствует рендерингу элемента. Если вы зарегистрируете событие onclick для unrendered (UNRENDERED, а не display: none или visible: hidden, ваша кнопка не физически находится на странице), событие onclick вообще не регистрируется. После того, как вы покажете свою кнопку на панели обновления, ничего не нужно запускать при щелчке, потому что обработка кликов не была установлена (кнопка не существовала во время
$("#btn2").click(function () {
$("#div3").dialog("open");
return false
});
)
visible = false
похоже, решает проблему с открытием второго диалогового окна jQuery. Но как еще сделать второй div, который будет отображаться только приbtn2
?