Вопрос по asp.net, webforms, form-submit, jquery – Как перехватить событие отправки с помощью jQuery в приложении ASP.NET?

28

Я пытаюсь справиться сsubmit событиеform Элемент, используя jQuery.

    $("form").bind("submit", function() {
        alert("You are submitting!");
    });

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

Есть ли способ сделать эту работу? Я мог бы прикрепить к событиям отдельных элементов, которые инициируют отправку, но это не совсем идеально - слишком много возможностей (например, выпадающие списки с autopostback = true, сочетания клавиш и т. Д.)

Update: Вот минимальный тестовый пример - это все содержимое моей страницы aspx:

<%@ page language="vb" autoeventwireup="false" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:scriptmanager id="ScriptManager" runat="server" enablepartialrendering="true">
                <scripts>
                    <asp:scriptreference path="/Standard/Core/Javascript/Jquery.min.js" />
                </scripts>
            </asp:scriptmanager>
            <p>
                <asp:linkbutton id="TestButton" text="Click me!" runat="server" /></p>
        </div>
    </form>

    <script type="text/javascript">
        $(document).ready(function() {
            alert("Document ready.");
            $("form").submit(function() {
                alert("Submit detected.");
            });
        });
    </script>

</body>
</html>

Я получил & quot; Документ готов & quot; оповещение, но не «Отправить обнаружение» при нажатии на кнопку ссылки.

Ваш Ответ

8   ответов
0
 $(document).ready(function () {

          $(this).live("submit", function () {

                console.log("submitted");
             }
}
0

$("form input[type=submit]").live("click", function(ev) {
    ev.preventDefault();
    console.log("Form submittion triggered");
  });
1

вы можете использоватьScriptManager.RegisterOnSubmitStatement() в вашем коде на стороне сервера. Зарегистрированный скрипт будет вызываться как при обычной отправке, так и при DoPostback.

ScriptManager.RegisterOnSubmitStatement(this, this.GetType(), "myKey", "SomeClientSideFunction();");
1

как это сделать с помощью jQuery, но вы можете добавить свойство OnClientClick к элементу управления ASP.NET:

<asp:linkbutton id="TestButton" text="Click me!" runat="server" OnClientClick="alert('Submit detected.');" />
Это не поможет в моей ситуации. Во-первых, если бы я собирался обрабатывать каждый элемент управления, который мог бы инициировать обратную передачу, было бы лучшим решением использовать jQuery для захвата событий по ним по всем направлениям. Но мне нужно глобальное решение для множества различных форм, и я не хочу возвращаться назад и касаться каждого отдельного элемента управления, который мог бы вызвать обратную передачу. Herb Caudill
12

решение с переопределением__doPostBack() чтобы вызвать переопределение наform.submit() (Т.е.$('form:first').submit(myHandler)), но я думаю, что это чрезмерно спроектировано. Начиная с ASP.NET 2.0, самый простой обходной путь:

Define a javascript function that you want to run when the form is submitted i.e.

<script type="text/javascript">

function myhandler()
{
    alert('you submitted!');
}

</script>

Register your handler function within your codebehind i.e.

protected override void OnLoad(EventArgs e)
{
    base.OnLoad(e);
    ScriptManager.RegisterOnSubmitStatement(Page, Page.GetType(), 
                                            "myHandlerKey", "myhandler()");
}

Вот и все!myhandler() будет вызываться из простой отправки с помощью кнопки и автоматически__doPostBack() звонит одинаково.

Я исправлен, спасибо за обновление, Джеймс -
Мне это нравится. Это "правильный" способ .NET ". обработки вещей.
Чтобы уточнить: веб-формы позволяют только одну форму на странице, объявленной сrunat="server", У вас могут быть другие несерверные формы на странице.
Извините, нет - проверьте документацию:msdn.microsoft.com/en-us/library/bb301794.aspx,key уникально идентифицирует скрипт, чтобы предотвратить повторную регистрацию. Кстати, не должно быть необходимости однозначно идентифицировать элемент формы, поскольку веб-формы допускают только одну форму на страницу.
Просто для пояснения, в вашем примере "myHandlerKey" это идентификатор тега формы. Например: & lt; form id = & quot; myHandlerKey & quot; Runat = & Quot; Сервер & Quot; & GT;
34

@Ken Browning и @russau за то, что они указали мне на угон __doPostBack. Я видел несколько разных подходов к этому:

Hard-code my own version of __doPostBack, and put it later on the page so that it overwrites the standard one. Overload Render on the page and inject my own custom code into the existing __doPostBack. Take advantage of Javascript's functional nature and create a hook for adding functionality to __doPostBack.

Первые два кажутся нежелательными по нескольким причинам (например, предположим, что в будущем кому-то еще понадобится добавить свою собственную функциональность в __doPostBack), поэтому я перешел к # 3.

этоaddToPostBack функция - это разновидность обычной техники pre-jQuery, которую я использовал для добавления функций вwindow.onload, и это хорошо работает

addToPostBack = function(func) {
    var old__doPostBack = __doPostBack;
    if (typeof __doPostBack != 'function') {
        __doPostBack = func;
    } else {
        __doPostBack = function(t, a) {
            if (func(t, a)) old__doPostBack(t, a);
        }
    }
};

$(document).ready(function() {
    alert("Document ready.");
    addToPostBack(function(t,a) {
        return confirm("Really?")
    });
});

Edit: Изменил addToPostBack так, чтобы

it can take the same arguments as __doPostBack the function being added takes place before __doPostBack the function being added can return false to abort postback
Очень элегантное решение.
отличное решение для отображения уведомлений о загрузке с помощью jQuery при использовании AutoPostBack для элементов управления на панелях обновления.
Большое спасибо за этот ответ! Мне было очень тяжело с этим в Sharepoint, но я не мог понять, почему. Я думал, что оставлю комментарий на тот случай, если кто-то еще будет зацикливаться на этом. Для Sharepoint, в дополнение к вашему коду, вам нужно добавить следующее прямо перед возвратом анонимной функции: _spFormOnSubmitCalled = false;
Я взял это решение и поместил его в плагин jQuery:plugins.jquery.com/beforePostBack
Большое спасибо за то, что поделились этим. У меня была просто противоположная проблема - запускался обработчик jQuery для события отправки формы (и показывал загрузочный gif), но _doPostBack не вызывался из-за сбоя проверки. Очень странно, но больше не проблема!
4

__doPostBack со своим, чтобы я мог отправить события на огонь.

Iirc, это проблема при отправке формы через JavaScript (который вызывает__doPostBack делать) в IE (возможно, и в других браузерах).

мой__doPostBack вызовы замены$(theForm).submit() после репликации поведения по умолчанию (вставка значений в скрытые входы)

@ Трава Ну, причина их кражи отличается от вашей. Похоже, их причина была устранена. Твой определенно не имеет. Если вы хотите, чтобы события отправки jQuery запускались всякий раз, когда при вызове __doPostBack инициируется обратная передача, вам нужно перехватить __doPostBack.
@ russau - Из статьи у меня сложилось впечатление, что угона с обратной передачей не нужно в Whidbey (VS2005)? Herb Caudill
Угон __doPostBack:weblogs.asp.net/vga/archive/2004/03/01/…
-2

OnClientClick = & quot; if (! $ ("# Form1"). Valid ()) return false; & quot;

Похожие вопросы