Как предотвратить отправку в зависимости от результата AJAX

Чтобы уточнить мой комментарий выше. изменять

  <input class = "btn btn-primary" id = "myid" type = "submit" value = "Add" />

к

  <input class = "btn btn-primary" id = "myid" type = "button" value = "Add" />

И в вашей функции успеха измените

if (!result) {
   event.preventDefault();
}

к

if (result) {
   $('#myid').closest("form").submit();
}

Таким образом, вы будете отправлять форму только в том случае, если результат верен, если вызов ajax завершится ошибкой или результат будет ложным, тогда форма не будет отправлена.

ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ: приведенный выше код может не работать, но я надеюсь, что вы поняли общую идею.

Я бы заменил элемент ввода кнопки отправки элементом кнопки, чтобы нажатие кнопки вызывало событие onclick без отправки формы. Затем, когда вы получите ответ ajax, вы можете условно использовать jQuery для отправки формы. Это может потребовать некоторых усилий, чтобы получить форму из onclick, но это не позволит вам отправить форму слишком рано, как я подозреваю, ваша проблема.

@using (Html.BeginForm("Add", "Category", FormMethod.Post))
{
    <input name = "CategoryID" id = "myCategoryId" type = "text" value = "0" />
    <input name = "CategoryName" id = "myCategoryNameId" type = "text" value = "" />
    <button class = "btn btn-primary" id = "myid">Add</button>
}

и

$('#myid').on('click', function(event) {
    var data = {
        CategoryName: $("#myCategoryNameId").val(),
        CategoryID: $("#myCategoryId").val()
    };
    $.ajax({
        type: 'POST',
        data: JSON.stringify(data),
        url: '/Category/ValidateCategoryName',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (result) {
            if (result) {
                $('#myid').closest('form').submit();
            }
        }
    });
});

Что я знаю очень давно, так это то, что действие перенаправления по умолчанию Form не будет ждать, пока ajax вернет свой результат.. Таким образом, вы можете использовать логическую переменную для управления этим.. см. следующий код

$(document).ready(function(){
  var DefaultFormAction = false;   //set the default form action to false
  $('form').on('submit' , function(e){
    var $this = $(this);
    if (DefaultFormAction == false){  // when the default action is false 
      e.preventDefault();   // prevent the default redirect
      setTimeout(function(){   // I use setTimeout here for testing .. Use the next code in your ajax success
        DefaultFormAction = true;   // return default action to true
        $this.submit();       // then submit the form again
      } ,10000);
      console.info('This result when default is false you will go to the default form action after 10second');
    }
  });
});

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input name = "CategoryID" id = "myCategoryId" type = "text" value = "0" />
  <input name = "CategoryName" id = "myCategoryNameId" type = "text" value = "" />
  <input class = "btn btn-primary" id = "myid" type = "submit" value = "Add" />
</form>

Для проверки действие перенаправления Form по умолчанию не будет ждать, пока ajax вернет свой результат вы можете использовать e.preventDefault() внутри setTimeout и даже если вы сделаете время 1ms без $this.submit() он все равно будет использовать значение по умолчанию перенаправить

$(document).ready(function(){
  var DefaultFormAction = false;   //set the default form action to false
  $('form').on('submit' , function(e){
    var $this = $(this);
    if (DefaultFormAction == false){  // when the default action is false 
      setTimeout(function(){   // I use setTimeout here for testing .. Use the next code in your ajax success
        e.preventDefault();   // prevent the default redirect
      } , 1);
      console.info('This result when default is false you will go to the default form action after 10second');
    }
  });
});

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input name = "CategoryID" id = "myCategoryId" type = "text" value = "0" />
  <input name = "CategoryName" id = "myCategoryNameId" type = "text" value = "" />
  <input class = "btn btn-primary" id = "myid" type = "submit" value = "Add" />
</form>

Самый чистый способ сделать это:

$(document).on('submit','form' function(event) {
    event.preventDefault();
    event.stopImmediatePropagation();

    $this = $(this);

    var data = {};
    data.CategoryName = $("#myCategoryNameId").val();
    data.CategoryID = $("#myCategoryId").val();

    $.ajax({
        type: 'POST',
        data: JSON.stringify(data),
        url: '/Category/ValidateCategoryName',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (result) {
            if (result) {
                $this.submit();
            }
        }
    });
});