JQuery JQModeal asp.net кнопку нужно нажать дважды

Question

Хорошо, новичок в jQuery и нужно знать, что я сделал неправильно.

Я использую 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

Как вы можете видеть, все, что он делает - это обновляет тег p в Div JustTesting с помощью Hello, а затем устанавливает CssClass в jqModal.

Когда вы нажимаете кнопку, ничего не происходит, но нажимаете ее снова и запускаете модальные окна.

Очевидно, это как-то связано с настройкой класса, которая вызывает запуск jqModal.

Кроме того, я попытался установить CssClass в page_load, и это в основном то же самое, что и установка в html. Код не вызывается, но модальное окно работает нормально.

Я надеюсь, что это лучшее объяснение, чем первая попытка.

Answer 1

Чтобы вылечить проблему, я просто перестал использовать jqModal