-1

HTML カミソリ フォーム (表示中) から既定のアクションではなく、別のアクションを呼び出そうとしていますが、常に既定のメソッドが呼び出されます。jquery ajax を使用しましたが、この問題を解決できませんでした。次のコードで試しました。

Html かみそりコード:-

@using (Html.BeginForm("InitialView", "AgreementRegistration", FormMethod.Post, new { id = "firstform", role = "form" }))
{

//Other Razor code

<input type="submit" value="Add Another" id="btnAddAnother" name="btnAddAnother" />

}

Jquery Ajax コード :-

 $(document).ready(function () {

$("#btnAddAnother").click(function(){
                e.preventDefault();
                var element = this;
                $.ajax({

                    url: "/AgreementRegistration/AddNew",
                    type: "POST",
                    data: JSON.stringify({ 'Options': someData }),
                    dataType: "json",
                    traditional: true,
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        if (data.status == "Success") {
                            alert("Executed!!!");
                            $(element).closest("form").submit(); //Submit form
                        } else {
                            alert("Not Executed");
                        }
                    },
                    error: function () {
                        alert("error occured!!!");
                    }

                });
            });

 });

ここで、「AddAnother」ボタンをクリックすると、デフォルトの「InitialView」アクションが呼び出されますが、代わりに「AddNew」アクションを呼び出したいと思います。上記のjqueryコードを使用すると、実行されません。この問題を解決するにはどうすればよいですか?

4

4 に答える 4

2

イベントを渡していません（したがって、キャンセルしていません）。コードを次のように変更します

$("#btnAddAnother").click(function(e) { // add the parameter
    e.preventDefault();
    ....

またはボタンにする

<button type="button" id="btnAddAnother" name="btnAddAnother" />Add Another</button>

そして削除e.preventDefault;

于 2016-02-04T10:09:27.370 に答える
2

イベントを送信ボタンのイベントにフックしていclickます。これは、フォームがまだ標準の POST メソッドを使用して送信されていることを意味します。代わりに、要素のsubmitイベントにフックする必要があります。formこれを試して：

$("#firstform").submit(function(e){
    e.preventDefault();
    var $form = $(this);

    $.ajax({
        url: $form.prop('action'),
        type: $form.prop('method'),
        data: { 'Options': someData },
        dataType: "json",
        traditional: true,
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            if (data.status == "Success") {
                alert("Executed!!!");
            } else {
                alert("Not Executed");
            }
        },
        error: function () {
            alert("error occured!!!");
        }
    });
});
于 2016-02-04T10:09:34.650 に答える
1

このコードを使用する場合は、送信ボタンを使用できるためページは送信されますが、通常のボタンを使用できるため、onclick イベント関数呼び出しのみが使用されるため、次のコードを使用します...

CSHTML ページ コード-

@using (Html.BeginForm("InitialView", "AgreementRegistration", FormMethod.Post, new { id = "firstform", role = "form" }))
{

//Other Razor code

<input type="button" value="Add Another" id="btnAddAnother" name="btnAddAnother" />

}

スクリプトコード

$("#btnAddAnother").click(function(){
                e.preventDefault();
                var element = this;
                $.ajax({

                    url: "/AgreementRegistration/AddNew",
                    type: "POST",
                    data: JSON.stringify({ 'Options': someData }),
                    dataType: "json",
                    traditional: true,
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        if (data.status == "Success") {
                            alert("Executed!!!");
                            $(element).closest("form").submit(); //Submit form
                        } else {
                            alert("Not Executed");
                        }
                    },
                    error: function () {
                        alert("error occured!!!");
                    }

                });
            });
于 2016-02-04T11:04:18.160 に答える
0

button入力のタイプをに変更します

<input type="button" value="Add Another" id="btnAddAnother" name="btnAddAnother" />

コードを少し変更することでこれを行うことができます

$(document).ready(function () {
    $("#btnAddAnother").click(function(){
        var element = $(this);
        $.ajax({
            .
            .
        });
        return false;
    });
 });

お役に立てれば

于 2016-02-04T10:18:03.073 に答える