Подтвердить что ты не робот

SimpleModal прерывает обратные копии ASP.Net

Я использую jQuery и SimpleModal в проекте ASP.Net, чтобы сделать несколько приятных диалогов для веб-приложения. К сожалению, любые кнопки в модальном диалоге больше не могут выполнять свои обратные вызовы, что на самом деле не приемлемо.

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

У меня также есть обходное решение, которое заключается в замене postbacks, но оно уродливое и, вероятно, не самое надежное. Я бы очень хотел, чтобы ретрансляторы снова работали. Любые идеи?

UPDATE: я должен уточнить, что postbacks не работают, потому что Javascript, используемый для выполнения почтовых сообщений, сломался каким-то образом, поэтому при нажатии кнопки ничего не происходит.

4b9b3361

Ответ 1

Оба вы были на правильном пути. Я понял, что SimpleModal добавляет диалог в тело, находящееся за пределами ASP.Net <form>, что нарушает функциональность, так как не может найти элементы.

Чтобы исправить это, я просто изменил источник SimpleModal, чтобы добавить eveything в 'form' вместо 'body'. Когда я создаю диалог, я также использую параметр persist: true, чтобы убедиться, что кнопки остаются открытыми и закрывающимися.

Спасибо всем за предложения!

UPDATE: версия 1.3 добавляет параметр appendTo в настройке для указания того, к какому элементу должен присоединяться модальный диалог. Вот документы.

Ответ 2

Все стандартные обратные копии ASP.NET работают, вызывая метод javascript __doPostBack на странице. Эта функция представляет форму (ASP.NET действительно любит только одну форму на странице), которая включает в себя некоторое скрытое поле ввода, в котором живет все состояние просмотра и другая доброта.

На первый взгляд, я не вижу ничего в SimpalModal, который бы испортил вашу страницу или любой из стандартных скрытых входов, если только содержимое этого модала не произошло из HTTP GET на страницу ASP.NET, Это приведет к тому, что две формы ASP.NET будут переданы в одну DOM и почти наверняка испортили бы функцию __doPostBack.

Рассматривали ли вы использование ASP.NET AJAX ModalPopup control?

Ответ 3

Веб-браузеры не будут отправлять любые отключенные или скрытые элементы формы.

Итак, что происходит:

  • Пользователь нажимает кнопку в диалоговом окне.
  • Кнопка вызывает метод SimpleModal close(), скрывая диалоговое окно и кнопку
  • Клиент отправляет форму (без идентификатора кнопки)
  • Структура ASP.NET не может определить, какая кнопка была нажата
  • Код вашей серверной части не выполняется.

Решение состоит в том, чтобы делать все, что вам нужно делать на клиенте (в этом случае закрытие диалогового окна), а затем самостоятельно вызвать __doPostback().

Например (где "dlg" - это ссылка на диалог SimpleModal на стороне клиента):

btn.OnClientClick = string.Format("{0}; dlg.close();",
                        ClientScript.GetPostBackEventReference(btn, null));

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

@Dan

Все стандартные обратные копии ASP.NET работают, вызывая метод javascript __doPostBack на странице.

asp: Кнопки не вызывают __doPostback(), поскольку элементы управления вводами HTML уже отправляют форму.

Ответ 4

был пойман этим - большое спасибо tghw и всем другим вкладчикам в форме appendto вместо исправления тела. (разрешено атрибутами версии 1.3)

btw: Если кому-то нужно программно закрыть диалоговое окно из .net - вы можете использовать этот тип синтаксиса

private void CloseDialog()
{
    string script = string.Format(@"closeDialog()");
    ScriptManager.RegisterClientScriptBlock(this, typeof(Page), UniqueID, script, true);
}

где javascript closedialog похож на это....

    function closeDialog() {
        $.modal.close();
    }

Ответ 5

Я нашел следующие работы без изменения simplemodal.js:

function modalShow(dialog) {

    // if the user clicks "Save" in dialog
    dialog.data.find('#ButtonSave').click(function(ev) {
        ev.preventDefault();

        //Perfom validation                

        // close the dialog
        $.modal.close();

        //Fire the click event of the hidden button to cause a postback
        dialog.data.find('#ButtonSaveTask').click();
    });

    dialog.data.find("#ButtonCancel").click(function(ev) {
        ev.preventDefault();
        $.modal.close();
    });
}          

Поэтому вместо того, чтобы использовать кнопки в диалоговом окне, чтобы вызвать обратную передачу, вы предотвращаете их отправку, а затем находите скрытую кнопку в форме и вызываете ее событие click.

Ответ 6

FWIW, я обновил сообщение в блоге, на которое вы указали, пришло разъяснение, перепродано здесь - аргументы и другие подробности находятся в сообщении в блоге:

Решение (с моей последней проверки перед обедом):

  • Отмените диалог onClose event и выполните следующие действия:   
    •     
    • Вызов функции по умолчанию по умолчанию     
    • Установите диалоговое окно div innerHTML на один & nbsp;     
    • Hijack __doPostBack, указывая на новую функцию, newDoPostBack  

Из некоторых комментариев, которые я видел в Интернете, в пункте 1 требуется некоторое разъяснение. К сожалению, я уже не с тем же работодателем и не имею доступа к используемому мной коду, но я делаю все, что могу. Во-первых, вам нужно переопределить диалоги onClose, указав новую функцию и указав на нее свой диалог:

$('#myJQselector').modal({onClose: mynewClose});
  • Вызвать функцию закрытия по умолчанию в диалоговом окне. В функции, которую вы определяете, вы должны сначала вызвать функциональность по умолчанию (наилучшая практика практически для всего, что вы обычно переопределяете):
  • Установите диалоговое окно div innerHTML на один & nbsp; - Это не необходимый шаг, поэтому пропустите его, если вы этого не понимаете.
  • Hijack __doPostBack, указывая на новую функцию, newDoPostBack
function myNewClose (dialog)
{
    dialog.close();
    __doPostBack = newDoPostBack;
}
  • Записать функцию newDoPostBack:
function newDoPostBack(eventTarget, eventArgument)
{
    var theForm = document.forms[0];
    if (!theForm)
    {
        theForm = document.aspnetForm;
    }
 
    if (!theForm.onsubmit || (theForm.onsubmit() != false))
    {
        document.getElementById("__EVENTTARGET").value = eventTarget;
        document.getElementById("__EVENTARGUMENT").value = eventArgument;
        theForm.submit();
    }
}
    

Ответ 7

Новый JQuery.simplemodal-1.3.js имеет опцию appendTo. Поэтому добавьте параметр appendTo: 'form', потому что по умолчанию используется appendTo: 'body', который не работает в asp.net.

Ответ 8

Имел ту же проблему, но {appendTo:'form'} заставил модальное всплывающее окно отображаться полностью неправильно (как будто у меня была проблема с CSS).

Оказывается, что в шаблоне, который я строю сверху, есть и другие страницы. Как только я установил {appendTo:'#aspnetForm'} (ID формы по умолчанию Asp.net), все отлично работало (включая обратную передачу).

Ответ 9

В дополнение к ответу tghw это отличное сообщение в блоге помогло мне: jQuery: исправить ваши обратные копии в модальных формах - в частности, комментарий BtnMike: Вы также не должны иметь Cssclass= "simplemodal-close", установленный на вашей asp: button. " Взятие этого класса было неочевидным для меня решением.

-Джон

Ответ 10

если вы не хотите изменять источник SimpleModal. попробуйте это.

После вызова метода modal() добавьте следующее:

$("#simplemodal-overlay").appendTo('form');
$("#simplemodal-container").appendTo('form');

Плагин SimpleModal добавляет два к вашей разметке.

  • 'simplemodal-overlay' для фона
  • 'simplemodal-container' содержит div, который вы считаете всплывающим модальным.