HTML로 애니메이션 로드를 활성화하고 있습니다.양식 제출 시작

HTML로 애니메이션 로드를 활성화하고 있습니다.양식 제출 시작

사용자가 제출 버튼을 클릭하면 로딩 애니메이션을 표시하고 싶습니다.간단한 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>   
}

편집

저는 AJAX 도우미와 관련된 질문이라고 잘못 생각했습니다.Html Helper를 사용하여 이 작업을 수행할 수 있는 방법은 다음과 같습니다.

먼저 JQuery를 사용하여 가져올 수 있도록 양식에 ID를 추가합니다.

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

그런 다음 Javascript 이벤트 핸들러를 추가하여 양식 제출을 가로채고 GIF 로드를 표시합니다.

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

---

(원답은 다음과 같습니다...)

클래스를 사용하여 설정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>

안녕하세요 저는 방금 당신의 게시물을 읽었고 마이크로소프트를 사용하는 .net core 2.1에서 잘 작동했습니다.AsNetCore.MVC:

@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..")}

문제가 있는 경우 조치 방법을 디버그하고 문 내부에서 위반되는지 확인할 수 있습니다.@Freeman 박사: 다음과 같이 모든 보기로 리디렉션할 수 있습니다.

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

이것이 도움이 되길 바랍니다.

언급URL : https://stackoverflow.com/questions/13259380/activating-loading-animation-by-html-beginform-submission