Hiện nạp trên Ajax.BeginForm nộp

Question

gì là cách tốt nhất để hiển thị một bộ nạp và vô hiệu hóa các nút khi chúng tôi nộp một hình thức:

@using (Ajax.BeginForm(MVC.Account.Login(), new AjaxOptions { OnSuccess = "onLoginSuccess" }, new { @id = "loginForm" })) 
{ 
    <div id="logbtn"> 
    <input type="submit" name="invisible" class="subinvisible"/> 
    <p>@HeelpResources.AccountLoginViewLoginButtonLabel</p> 
    <img src="~/Content/Images/ui-symb-arrow-right-white-15x15.png" width="13" height="12" /> 
    </div> 
} 

Các tập tin ảnh loader là

<img src="~/Content/Images/ui-loader-white-16x16.gif" /> 

Có thể sử dụng các OnBegin từ BeginForm để hiển thị bộ tải và các OnComplete để ẩn nó? Nhưng làm thế nào tôi có thể thay đổi hình ảnh?

Bất kỳ sugestion để tìm chất lượng tốt đẹp miễn phí tải?

Cảm ơn

Answer 1

Đặt thẻ hình ảnh tải của bạn bên trong một thẻ div như thế này:

<div id="loading"> 
    <img src="~/Content/Images/ui-loader-white-16x16.gif" /> 
</div> 

Trong file CSS của bạn:

div#loading { display: none; } 

Và, trong hình của bạn:

@using (Ajax.BeginForm(MVC.Account.Login(), 
    new AjaxOptions { OnSuccess = "onLoginSuccess", LoadingElementId = "loading", 
    OnBegin = "onLoginBegin" }, 
    new { @id = "loginForm" })) 
{ 
    <div id="logbtn"> 
    <input type="submit" name="invisible" class="subinvisible"/> 
    <p>@HeelpResources.AccountLoginViewLoginButtonLabel</p> 
    <img src="~/Content/Images/ui-symb-arrow-right-white-15x15.png" width="13" height="12" /> 
    </div> 
} 

Và, thêm làm cript vào chế độ xem của bạn:

<script type="text/javascript"> 
    function onLoginBegin() 
    { 
     // Disable the button and hide the other image here 
     // or you can hide the whole div like below 
     $('#logbtn').hide(); 
    } 
</script>