There is such a correspondence ajax form:

@using (Ajax.BeginForm("SendMessage", "Order", new AjaxOptions { UpdateTargetId = "herepls", OnSuccess = "document.getElementById('Message_Text').value='';" })) @Html.HiddenFor(model => model.Order.Id) <div class="messSender"> <div class="col-sm-9 col-md-9"> @Html.TextAreaFor(model => model.Message.Text, 3, 70, new { htmlAttributes = new { @class = "form-control", id = "textarea" } }) @Html.ValidationMessageFor(model => model.Message.Text, "", new { @class = "text-danger" })<br /> </div> <div class="col-sm-3 col-md-3"> <input type="submit" value="Send" class="btn btn-default" style="margin-top:18px; margin-left: 13px;" /> </div> </div> <div id="herepls"> <div class="messagePage"> //тут логика вывода сообщени </div> </div>

We enter the text in the input field and we can press the "Send" button 2-3 times and while the ajax request is in progress, it can send 2-3 messages, depending on the method load. How to avoid it? I thought you could do something like in VK, if suddenly there are any delays, then the Send button becomes unpressed and instead of the word "Send" you are loading.

  • Duck zadizeyblit button what is the problem? - teran
  • How to zadizeyblit it at the time of sending? by pressing it will not work, because validation may not pass. - a.tarasevich
  • when sending a form disable, the dispatch takes place after successful validation. this is in AjaxOptions.OnBegin and back to OnComplete - teran

1 answer 1

As suggested by "teran" from the comments:

when sending a form disable, the dispatch takes place after successful validation. this is in AjaxOptions.OnBegin and back to OnComplete

Here is what ajaxOptiós look like:

 @using (Ajax.BeginForm("SendMessage", "Order", new AjaxOptions { UpdateTargetId = "herepls", OnSuccess = "OnSuccess",OnBegin="disableBut" }))

button itself:

 <input type="submit" id="ourButton" value="Send" class="btn btn-default" style="margin-top:18px; margin-left: 13px;" />

and the script itself:

  <script> function disableBut() { ourButton.disabled = true } function OnSuccess() { ourButton.disabled = false } </script>
  • one
    do OnComplete , otherwise if the server returns an error, then OnSuccess will not work. - teran