Kích hoạt tải hình động bằng cách Html.BeginForm gửi

Question

Tôi muốn hiển thị hoạt ảnh tải khi người dùng nhấp vào nút gửi. Gif đơn giản sẽ thực hiện công việc. Đây là mã của tôi:

@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> 
} 

Answer 1

Sửa

tôi đã nhầm tưởng rằng câu hỏi liên quan các helper AJAX. Đây là cách bạn có thể làm điều đó bằng cách sử dụng HtmlHelper.

Đầu tiên, thêm một ID mẫu để bạn có thể lấy nó sử dụng JQuery:

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

Tiếp theo, thêm một xử lý sự kiện Javascript để ngăn chặn việc nộp hình thức và hiển thị GIF tải.

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

---

(câu trả lời gốc sau ...)

Sử dụng các lớp AjaxOptions để thiết lập một LoadingElementId, và helper Ajax sẽ hiển thị yếu tố đó trong khi chờ đợi phản hồi từ máy chủ:

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

Sau đó, chỉ cần đặt gif của bạn bất cứ nơi nào bạn muốn nó hiển thị (ẩn nó ban đầu):

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