web-dev-qa-db-ja.com

Html.BeginForm送信による読み込みアニメーションのアクティブ化

ユーザーが送信ボタンをクリックしたときに読み込みアニメーションを表示したい。単純なgifがその役目を果たします。これは私のコードです：

@using (Html.BeginForm("SData","Crawl"))
{
    <p>
        Enter Starting URL:<input class="txt" type="text" id="sUrl" name="sUrl" title="Enter Starting URL"/>
    </p>

    <p>
        Enter Number of Threads:<input class="txt" type="text" id="Nbt" name="Nbt" title="Enter number of threads"/>
    </p>

    <p>
        <input class="button" id="submit" type="submit" value="Submit" />
   </p>   
}
javascriptajaxasp.net-mvcasp.net-mvc-4razor
13
Dr_Freeman

編集

質問がAJAXヘルパーに関するものだと誤解しました。HtmlHelperを使用してそれを行う方法は次のとおりです。

まず、フォームにIDを追加して、JQueryを使用して取得できるようにします。

@using (Html.BeginForm("SData", "Crawl", FormMethod.Post, new { id = "myform" }))
{
    // the form
}

次に、Javascriptイベントハンドラーを追加して、フォームの送信をインターセプトし、読み込み中のGIFを表示します。

$("#myform").submit(function(e) {
    $("#myLoadingElement").show();
});

（元の答えは次のとおりです...）

AjaxOptions クラスを使用してLoadingElementIdを設定すると、Ajaxヘルパーはサーバーからの応答を待っている間にその要素を表示します。

@using (Html.BeginForm("SData","Crawl", new AjaxOptions() {
    LoadingElementId="myLoadingElement"
}))
{
    // form
}

次に、gifを表示したい場所に配置します（最初は非表示にします）。

<div id="myLoadingElement" style="display: none;">
    <img src="loading.gif" alt="Loading..." />
</div>
25
McGarnagle

こんにちは私はちょうどここであなたの投稿を読みました、そしてそれはMicrosoft.AspNetCore.Mvcを使用して.netコア2.1で私のためにうまく働きました：

@using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new {id="UpdateForm"})) {@Html.AntiForgeryToken() <div>your inputs here...</div> }

次に、HTMLスクリプト：

$("#UpdateForm").submit(function(e){$("#your loader gif here..")}

問題がある場合は、アクションメソッドをデバッグして、ステートメント内で壊れていないかどうかを確認することをお勧めします。@ Dr Freeman：次のように任意のビューにリダイレクトできます。

return RedirectToAction("ActionName", new {@id=id});

この助けを願っています

0
jeirix