Asp.Net Core-Validation and submit form with Ajax?-CodePudding

I have a form in the modal popup?

<form asp-controller="Account" asp-action="Register">
<div  id="Register-Form" hidden>
    <div >
    <input type="password" name="user_Password"  maxlength="6" id="Register-NewPassword">
    </div>
    <div >
    <input type="number"  maxlength="6" autocomplete="off" id="Register-ActiveCode"> 
    </div>
    <div >
    <button  type="submit" onclick="return Validate_Register()" >Save </button>
    </div>
</div>

Jquery Validation :

 function Validate_Register() { 
    $.post("/Account/CheckActiveCode", {
        Mobile: Login_Mobile, ActiveCode: Register_Active_Value
    }, function (data) {
        if (data == 1) {
            $.alert({
                title: 'Error',
                content: 'Active Code is Not True',
                rtl: true,
                closeIcon: true,
                type: 'red',
                typeAnimated: true,
                buttons: {
                    confirm: {
                        text: 'Ok',
                        btnClass: 'btn-red',
                    }
                },
            });
            return false;
        }       
            
    });

    return true;
}

Controller :

public JsonResult CheckActiveCode(string Mobile , string ActiveCode)
    {            
        if (!_user.UserIsActivate(Mobile, ActiveCode))
        {
            return Json(1);
        }
        return Json(0);
    }

Controller Form for Submit:

[HttpPost]
    public IActionResult Register(string mobile_User, string user_Password)
    {
        _user.RegisterUpdateUser(mobile_User, user_Password);
        
        return RedirectToAction("Index", "Home");
    }

I want the form to be submitted if the validation (data==0) If (data==1), the form will not be submitted and an error will be displayed?

CodePudding user response：

Try to use <input type="button"/> to replace <button></button>,and if data !=1,submit form.

html code:

<form id="myForm" asp-controller="Account" asp-action="Register">
<div  id="Register-Form" hidden>
     <div >
            <input name="mobile_User"  maxlength="6" id="mobile_User">
        </div>
        <div >
            <input type="password" name="user_Password"  maxlength="6" id="Register-NewPassword">
        </div>
        <div >
            <input type="number"  maxlength="6" autocomplete="off" id="Register-ActiveCode">
        </div>
        <div >
            <input type="button" onclick="Validate_Register()"  value="Save" />
        </div>
</div>
</form>

js:

function Validate_Register() {
                $.post("CheckActiveCode", {
                    Mobile: Login_Mobile, ActiveCode: Register_Active_Value
                }, function (data) {
                        if (data == 1) {
                            $.alert({
                                title: 'Error',
                                content: 'Active Code is Not True',
                                rtl: true,
                                closeIcon: true,
                                type: 'red',
                                typeAnimated: true,
                                buttons: {
                                    confirm: {
                                        text: 'Ok',
                                        btnClass: 'btn-red',
                                    }
                                },
                            });
                        } else {
                            $("#myForm").submit();
                        }
                    })

            }