Кнопка входа внутри jQuery BlockUI

Я сделал журнал в форме, которая невидима, и я использую BlockUI, чтобы показать форму.

Я могу открыть форму и выйти из формы, но когда я нажимаю кнопку «Войти», она не выполняет обратную передачу на сервер.

Любая идея о том, как сделать кнопку входа в систему обратной?

Примечание: функция входа в систему работает, так как я пытался разместить ее на самой странице без блокировки, и она отправляет обратно.

Моя форма входа

<div id="LoginDiv" class="LoginDiv">
    <input type="image" id="CloseForm" src="../Images/SiteRelated/CloseForm.jpg" style="float: right;" />
    <div style="display: inline-block; margin-top: 15px">
        Username
    </div>
    <div class="InlineBlock">
        <asp:TextBox ID="UsernameTB" Text="Or" runat="server" Style="width: 90px"></asp:TextBox>
    </div>
    <div style="clear: both;">
    </div>
    <div class="InlineBlock">
        Password
    </div>
    <div class="InlineBlock">
        <asp:TextBox ID="PasswordTB" TextMode="Password" Text="123" runat="server" Style="width: 90px;
            margin-right: 18px"></asp:TextBox>
    </div>
    <asp:Panel ID="Panel1" HorizontalAlign="Center" runat="server">
        <asp:Button ID="LoginBtn" runat="server" Text="Login" Style="width: 150px;" OnClick="LoginBtn_Click" />
    </asp:Panel>
</div>

Мой Javascript

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        $('#CloseForm').click(function () {
            $.unblockUI();
        });

        $('#Login').click(function () {
            $.blockUI.defaults.css = {
                padding: 0,
                margin: 0,
                width: '15.8%',
                top: '40%',
                left: '35%',
                textAlign: 'center',
                color: '#000',
                border: '3px solid #aaa',
                backgroundColor: '#fff',
                cursor: 'wait'
            };
            $.blockUI({ message: $('#LoginDiv') });
        });
    });
</script>

c# asp.net login postback jquery-blockui
person Or Betzalel    schedule 23.01.2011    source источник

Ответы (2)


arrow_upward
7
arrow_downward

Я думаю, вам нужно добавить div входа обратно в форму. Новый javascript будет выглядеть так.

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        $('#CloseForm').click(function () {
            $.unblockUI();
        });

        $('#Login').click(function () {
            $.blockUI.defaults.css = {
                padding: 0,
                margin: 0,
                width: '15.8%',
                top: '40%',
                left: '35%',
                textAlign: 'center',
                color: '#000',
                border: '3px solid #aaa',
                backgroundColor: '#fff',
                cursor: 'wait'
            };
            $.blockUI({ message: $('#LoginDiv') });

             //Add the LoginDiv back to the form.
            $('#LoginDiv').parent().appendTo($("form:first"));
        });
    });
</script>
person awright18    schedule 23.01.2011
comment
+1 Хотел бы я дать этому ответу 10 голосов, это просто сэкономило мне много времени ... Сегодня вечером я искал это решение несколько часов !!! Спасибо!!! - person lhan; 29.11.2011
comment
Я тоже боролся с этим в течение нескольких часов в первый раз. Это не совсем очевидно. - person awright18; 28.12.2011

arrow_upward
2
arrow_downward

Это действительно мне очень помогло. У меня была аналогичная проблема с blockUI, где у меня были кнопки asp.net, которые не выполняли обратную передачу. Предложение awright18 очень помогло.

<div id="taxStatus" style="display:none;">
<br />
     <div class="row">
        <div class="three columns"><asp:Button runat="server" ID="unitedStatesTaxStatusButton" Text="United States" CssClass="submitButton" OnClick="unitedStatesTaxStatusButton_Click" /></div>
        <div class="three columns"></div>
         <div class="six columns"></div>
    </div>
    <br /><br />

 </div>

Onclick просто вызывает это:

protected void unitedStatesTaxStatusButton_Click(object sender, EventArgs e)
    {
        //do whatever
    }

Мой jquery:

$(document).ready(function () {
        $('#<%=unitedStatesTaxStatusButton.ClientID%>').click(function () {
            $.unblockUI();

            //**  added this line to make it work ******
            $('#taxStatus').parent().appendTo($("form:first"));
            return true;
        });
person Matt Knight    schedule 28.02.2013