Использование JQuery Alert на ASP.Net Runat = кнопка "сервер" - PullRequest
2 голосов
/ 02 марта 2012

Я нашел здесь плагин JQuery Alert, http://www.abeautifulsite.net/blog/2008/12/jquery-alert-dialogs/ Итак, я создал образец страницы для его тестирования, но он не работает на кнопке Runat = "server".Вторая кнопка - это всего лишь то, что я пытался остановить, чтобы кнопка не публиковала сообщения, и, похоже, это происходит, но после подтверждения она никуда не денется.

Буду признателен за любую помощь в этом.

<script src="js/jquery.alerts.js" type="text/javascript"></script>
<link href="css/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript">
    function confirmThis() {
        jConfirm('Can you confirm this?', 'Confirmation Dialog', function (r) {
            jAlert('Confirmed: ' + r, 'Confirmation Results');
            return r;
        });

        return false;
    }
    $(document).ready(function () {
        $("#btnNext").click(function () {
            jConfirm('Can you confirm this?', 'Confirmation Dialog', function (r) {
                jAlert('Confirmed: ' + r, 'Confirmation Results');
                return r;
            });
        });
    });

</script>
</head>
<body>
<form id="form1" runat="server">
<div>
     <asp:Button ID="btnNext" runat="server" Text="Confirm 1"/>
     <asp:Button ID="Button1" runat="server" Text="Confirm 2" OnClientClick="return    confirmThis();"/>
</div>
</form>
</body>
</html>

Ответы [ 3 ]

2 голосов
/ 02 марта 2012

Хотя вы должны использовать btnNext.ClientID, это не является причиной вашей проблемы здесь. Проблема заключается в том, что используемая вами библиотека использует обратные вызовы для реализации всплывающего окна подтверждения, что означает, что функция, которую вы присоединяете к событию click, не ожидает нажатия диалогового окна подтверждения перед выходом. Поскольку false не возвращается из этой функции, нажатие кнопки не отменяется, и происходит обратная передача.

См. Принятый ответ здесь для получения дополнительной информации: Можете ли вы дождаться обратного вызова javascript?

Одним из способов решения этой проблемы является всегда возвращать значение false, а затем при обратном вызове после подтверждения нажать кнопку. Имейте в виду, что вам придется unbind обработчик событий перед вызовом click вручную. Следующий код работал для меня:

$(document).ready(function () {
    $("#<%= btnNext.ClientID %>").bind('click', function () {
        jConfirm('Can you confirm this?', 'Confirmation Dialog', function (r) {
            if (r == true) {

                //Unbind client side click event and submit btnNext
                $("#<%= btnNext.ClientID %>").unbind('click');
                $("#<%= btnNext.ClientID %>").click();
            }
        });

        //Always prevent a postback by returning false
        return false;
    });
});
1 голос
/ 02 марта 2012

Вы также можете присвоить кнопке класс CSS, как

<asp:Button ID="btnNext" class="showConfirm" runat="server" Text="Confirm 1"/>

, а затем сослаться на него в своем javascript, как

     $(document).ready(function () {
    $('.showConfirm').click(function(){
     // Your code goes here
});
});

Таким образом, вы также можете переместить свой скрипт во внешний файл и не нужно вставлять его на свою страницу.

1 голос
/ 02 марта 2012

Используйте идентификатор клиента кнопки.вот так:

 $(document).ready(function () {
    $("#<%=btnNext.ClientID%>").click(function (e) {
        e.preventDefault(); // Stops the postback
        jConfirm('Can you confirm this?', 'Confirmation Dialog', function (r) {
            jAlert('Confirmed: ' + r, 'Confirmation Results');
            return r;
        });
    });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...