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

Question

I have a form in the modal popup?

<form asp-controller="Account" asp-action="Register">
<div class="form-area" id="Register-Form" hidden>
    <div class="form-group">
    <input type="password" name="user_Password" class="input-field" maxlength="6" id="Register-NewPassword">
    </div>
    <div class="form-group">
    <input type="number" class="input-field" maxlength="6" autocomplete="off" id="Register-ActiveCode"> 
    </div>
    <div class="form-group text-center">
    <button  type="submit" onclick="return Validate_Register()" class="mybtn">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?

Yiyi You · Accepted Answer · 2021-10-15 05:55:30Z

1

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 class="form-area" id="Register-Form" hidden>
     <div class="form-group">
            <input name="mobile_User" class="input-field" maxlength="6" id="mobile_User">
        </div>
        <div class="form-group">
            <input type="password" name="user_Password" class="input-field" maxlength="6" id="Register-NewPassword">
        </div>
        <div class="form-group">
            <input type="number" class="input-field" maxlength="6" autocomplete="off" id="Register-ActiveCode">
        </div>
        <div class="form-group text-center">
            <input type="button" onclick="Validate_Register()" class="mybtn" 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();
                        }
                    })

            }

edited Oct 15, 2021 at 5:55

answered Oct 15, 2021 at 5:41

Yiyi You

18.4k1 gold badge19 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

sunboy_sunboy Over a year ago

My code also submits the form ,I want the form not to be submitted when (data == 1) and to display the error,Unfortunately, after becoming 1, the form is submitted

Yiyi You Over a year ago

Yes,use <input type="button"/>, it will not be submitted when data==1.

Yiyi You Over a year ago

Do you use my html code,such as <form id="myForm" asp-controller="Account" asp-action="Register"> in my code. $("#myForm").submit(); will submit form which id is myForm,so you must add id="myForm" to your form as I shown in my answer.

Collectives™ on Stack Overflow

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

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related