Как предотвратить AutoPostBack, когда DropDownlist выбран с помощью jQuery

Question

Я хочу показать диалоговое окно подтверждения, когда пользователь выбирает элемент в DropDownList. Если пользователь нажимает «Отмена», я хочу остановить обратную передачу. Вот функция, которую я добавляю в событие onchange:

function imitateConfirmUnload(event) {
    if (window.onbeforeunload = null)
        return true;

    return confirm("Are you sure you want to navigate away from this page?\n\nYou have unsaved changes\n\nPress OK to continue or Cancel to stay on the current page.");
}

И это соответствующий бит кода в моем скрипте запуска, чтобы добавить обработчик к событию:

function addConfirmToWarnClasses() {

    $('.warn').change(function() {
        imitateConfirmUnload()
    });
}

Проблема в том, что обратная передача происходит, даже если пользователь выбирает «Отмена» Если я перемещу обработчик к событию click, он работает. Но мне это кажется неуклюжим.

Редактировать

Исправление: он не работает по клику, потому что диалоговое окно запрещает выбор, поэтому, когда пользователь выбирает ОК, никаких изменений не происходит, и нет обратной передачи, когда вы этого хотите!

Редактировать 2

DropDownList находится внутри UpdatePanel, что может повлиять на поведение.

Answer 1

После прочтения этого решения я просто удалил AutoPostBack на своем DropDownLists и использовал его, потому что это было так просто:

$("#DropDownList1").change(function (e) {
    if ($(this).val() == "0") {
        //do nothing
    }
    else {
        //do postback
        setTimeout("__doPostBack('DropDownList1','')", 0);
    }
});

или если у вас несколько1008 * вы хотите сделать AutoPostBack:

$("select").change(function (e) {
    if ($(this).val() == "0") {
        //do nothing
    }
    else {
        //do postback
        setTimeout("__doPostBack('" + this.id + "','')", 0);
    }
});

Answer 2

Я знаю, что этот вопрос довольно старый, но так как он появился в поиске Google, когда мне был нужен ответ, я опубликую решение здесь. Я думаю, что это проще, чем те, которые были опубликованы ранее.

Я взял это из http://forums.asp.net/p/1475520/3432980.aspx:

<script type="text/javascript">
    function stopPostback()
    {
        if (blahblah)
            return true; // stop postback


        return false;
    }
</script>

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" onchange="if (stopPostback()) return false;">

Ключевой частью здесь является код в onchage: чтобы отменить AutoPostBack, он должен что-то вернуть (не имеет значения, является ли true или false), а чтобы продолжить AutoPostBack, он не должен ничего возвращать.

Answer 3

Вам также необходимо return из этой функции, например:

$('.warn').change(imitateConfirmUnload);

В настоящее время значение return не используется.Это также будет работать:

$('.warn').change(function() {
  return imitateConfirmUnload();
});

Кроме того, я хорош* обработчик, если он присутствовал.

Answer 4

Конечно, для отмены асинхронных обратных передач из панели обновления требуется другая техника:

http://msdn.microsoft.com/en-us/magazine/cc163413.aspx

Запрет ASP.net __doPostback () из jQuery submit () в UpdatePanel

//Adds an event handler to confirm unsaved changes when an asynchronous postback is initialised by an UpdatePanel
function setConfirmAsyncPostBack() {

    if (typeof (Sys.WebForms) === "undefined" || typeof (Sys.WebForms.PageRequestManager) === "undefined")
        return;

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(confirmAsyncPostBack);
}

//An event handler for asynchronous postbacks that confirms unsaved changes, cancelling the postback if they are not confirmed
//Adds the confirmation to elements that have a css class of "warn"
function confirmAsyncPostBack(sender, args) {
    if (window.onbeforeunload != null && args.get_postBackElement().className == "warn" && !unloadConfirmed())
        args.set_cancel(true);
}

//Displays a confirmation dialog that imitates the dialog displayed by onbeforeunload
function unloadConfirmed() {

    var confirmed = confirm("Are you sure you want to navigate away from this page?\n\n" + unloadMessage() + "\n\nPress OK to continue or Cancel to stay on the current page.");
    if (confirmed)
        window.onbeforeunload = null;
    return confirmed;
}

function unloadMessage() {

    return 'You have unsaved changes.';
}

Этот код соответствует проблеме, описанной в моем другом вопросе: DropDownList не запускается перед загрузкой, когда AutoPostBack = "True"