Хорошо, новичок в jQuery и нужно знать, что я сделал неправильно.jquery jqmodal asp.net кнопка должна щелкнуть дважды
Я использую jqModal для отображения диалогового окна отчета данных, восстановленного из базы данных SQL Server.
Я начал с примеров с сайта, и все работает отлично, но.
Если я установил поле CssClass кнопки jqModal (я предполагаю, что это используется jQModel, чтобы вызвать выполнение jQModal-кода), тогда код за кликом не вызывается, но если не установить поле CssClass до конца метода нажатия кнопки, тогда загорается код, но мне нужно снова нажать кнопку для отображения модального диалогового окна.
Кнопки динамически добавляются в таблицу для отображения ошибок в системе. При нажатии кнопки модальный диалог будет показывать более подробную информацию об ошибке.
Больше всего ядовито, если я нажму на другую запись на первую, тогда отобразятся данные для записи.
В основном, мой вопрос в том, как вы вызываете код qgModal для запуска кода после нажатия кнопки?
ОК, так что вот какой-то код, чтобы объяснить это.
<h2>Header Section</h2>
<title></title>
<script src="../Scripts/jquery-1.8.2.min.js"></script>
<script src="../Scripts/jqModal.js"></script>
<script>
$().ready(function() {
$('#dialog').jqm({ modal: true });
});
</script>
<link href="../Content/themes/jqModal.css" rel="stylesheet" />
<style>
.jqmWindow {
display: none;
position: fixed;
top: 17%;
left: 50%;
margin-left: -300px;
width: 600px;
background-color: #EEE;
color: #333;
border: 1px solid black;
padding: 12px;
}
.jqmOverlay { background-color: #000; }
/* Fixed posistioning emulation for IE6
Star selector used to hide definition from browsers other than IE6
For valid CSS, use a conditional include instead */
* html .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight)/100) + 'px');
}
#img_Close
{
text-decoration: none;
border: 0;
outline: none;
float:right;
}
</style>
<h2>Body Section</h2>
<form id="form1" runat="server">
<a href="#" class="jqModal">view</a>
<asp:HyperLink ID="HyperLink1" runat="server" CssClass="jqModal">HyperLink</asp:HyperLink>
<asp:Label ID="Label1" runat="server" CssClass="jqModal" Text="Label"></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" />
<div class="jqmWindow" id="dialog">
<a href="#" class="jqmClose">
<asp:Image ID="img_Close" runat="server" ImageUrl="~/Images/close_window-small.png" />
</a>
<div id="JustTesting">
<p id="test" runat="server"></p>
</div>
<hr/>
<em>READ ME</em> -->
This is a "vanilla plain" jqModal window. Behavior and appeareance extend far beyond this.
The demonstrations on this page will show off a few possibilites. I recommend walking
through each one to get an understanding of jqModal <em>before</em> using it.
<br />
<hr />
</div>
</form>
Фактически это прямая копия примеров на сайте jqModal.
Если вы нажмете на что-либо с классом, установленным как jqModal, тогда будет работать модальное окно. Если вы заметили, что кнопка asp: не имеет опции CssClass, но если вы ее установите, это тоже работает.
Так что у меня это в моем коде позади:
Protected Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
test.InnerText = "Hello.."
Button1.CssClass = "jqModal"
End Sub
Как вы можете видеть все это делает обновление р тег в JustTesting Div с Hello, затем устанавливает CssClass к jqModal.
Когда вы нажимаете кнопку, ничего не происходит, но щелкните ее еще раз, и модальные окна будут запущены.
Это, очевидно, имеет отношение к настройке класса, вызывающего запуск jqModal.
Кроме того, я попытался установить CssClass в page_load, и это в основном то же самое, что и установка его в html. Код позади не вызывается, но модальное окно работает нормально.
Надеюсь, это лучшее объяснение, чем первая попытка.