I have been working on an MVC App and am currently trying to determine if a user is registered. To achieve this, I have created a model:
public class Ejemplo
{
[Required(ErrorMessage="Please specify Username")]
[DataType(DataType.Text)]
public string usuario { get; set; }
[Required(ErrorMessage="Please specify password")]
[DataType(DataType.Password)]
public string password { get; set; }
}
My current issue lies in sending the user information in a JSON format through AJAX and needing to validate that the username and password are specified. In order to address this, I have written the following code:
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#myform').validate({
rules: {
usuario: {
required: true,
minlength: 12
},
password: { required: true }
},
messages: {
usuario: {
required: "You must specify a username - please validate!!!",
minlength: "Invalid length - please validate!!!"
},
password: {
required: "You must specify a password - please validate!!!"
}
},
submitHandler:
$("#myform").on('submit', function () {
alert("Have just pressed submit");
if ($("#myform").valid()) {
alert("Here is some code inside $.AJAX({})");
}
return false;
})
})
});
This is my form (the code above and the form are in the same file: Index.cshtml)
<fieldset>
<legend> MVC Validations </legend>
@using (Html.BeginForm("Prueba", "Prueba", FormMethod.Post, new { @id = "myform" }))
{
@Html.LabelFor(M => M.usuario);
<br />
@Html.EditorFor(M=>M.usuario)
@Html.ValidationMessageFor(M => M.usuario);
<br />
@Html.LabelFor(M=>M.password)
<br />
@Html.EditorFor(M=>M.password);
@Html.ValidationMessageFor(M=>M.password)
<br />
<br />
<input type="submit" id="boton_id" name="boton_name" value="Submit" />
}
</fieldset>
However, the validation does not work and no message appears if the username and password fields are left empty. Only the initial alert is shown: alert("Have just pressed submit"); but the second alert never shows up: alert("Here is some code inside $.AJAX({})"); these two alerts are within
submitHandler:
$("#myform").on('submit', function () {
alert("Have just pressed submit");
if ($("#myform").valid()) {
alert("here is some code inside $.AJAX({})");
}
return false;
})
If you could provide assistance in identifying where the problem lies or what I may be missing, it would be greatly appreciated.