MVC3 Ajax and Validation problem

See more:

C#

ASP.NET

MVC

jQuery

Hi All,

I got some error in Ajax validation.first, i press the submit button, when the text
box is empty. Then error message had been shown in the text box that is empty but it will trigger Save methods at the same time. Although error message is appeared,
the value is save inside the database. pls help me.

here is my code

<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $("#save").click(function () {
            var par = $("#SchemeName").val();
                $.ajax({
                    type: "POST",
                    url: "./../Scheme/Save",
                    data: "{ctschemehead: '" + par.toString() + "'}",
                    datatype: "Json",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        $("#retresult").val(data);
                    },
                    error: function (data) {
                        alert(data);
                    }
                });
        });
        $("#frmreg").validate({
            rules: {
                SchemeName: { required: true }
            },
            messages: {
                SchemeName: "SchemeName is missing!"
            }
        });
    });

</script>

Here is the ajax action for save function

public JsonResult Save(string ctschemehead)
        {
            if (ModelState.IsValid)
            {
                string msg = ctschemehead;
                ctSchemeRepoistory.Create_SchemeHead(msg, User.Identity.Name);
                string data = "successful";
                return Json(data, "application/json; charset=utf-8",JsonRequestBehavior.AllowGet);
            }
            else
            {               
                string data = "fail";
                return Json(data,"application/json; charset=utf-8",JsonRequestBehavior.AllowGet);
            }

        }