What I need
I need to stop the page refreshing while user click submit button and it doesn't redirect to another page in MVC.
Still what I done
log in page with refreshing using jquery.if click a submit button on the page is refreshing and it display the welcome message with username and login button changed to logout link. but I want the same functionality without refreshing the page
What I have tried:
Controller:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Index(LoginMVC u) {
if (ModelState.IsValid) // this is check validity
{
using(LoginAndSignUpEntities dc = new LoginAndSignUpEntities()) {
var v = dc.tbl_Detailstbl.Where(a => a.Email_Id.Equals(u.EmailId) && a.Password.Equals(u.Password)).FirstOrDefault();
if (v != null) {
Session["LogedUserID"] = v.Email_Id.ToString();
Session["LogedUserFullname"] = v.Name.ToString();
}
}
}
return Json(u, JsonRequestBehavior.AllowGet);
}
View:
<button id="model" style="border:none;">login</button>
@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { @id = "ID" })) { @Html.AntiForgeryToken() // this is for prevent CSRF attack @Html.ValidationSummary(true)
Login
@Html.LabelFor(m => m.EmailId)
@Html.TextBoxFor(m => m.EmailId, new { @id = "txtuserid" }) @Html.ValidationMessageFor(m => m.EmailId)
@Html.LabelFor(m => m.Password)
@Html.PasswordFor(m => m.Password, new { @id = "txtpassword" }) @Html.ValidationMessageFor(m => m.Password)
<input type="submit" value="Submit" id="btnlogin" />
}
Script:
@section scripts{
<script type="text/javascript">
$(document).ready(function() {
debugger;
$("#btnlogin").submit(function(e) {
e.preventDefault();
var email = $('#txtuserid').val();
var password = $('#txtpassword').val();
$.ajax({
url: '@Url.Action("Index", "Home")',
type: 'POST',
data: $(this).serialize(),
datatype: "json",
success: function() {
alert("success");
},
error: function() {
alert("error123");
}
});
});
});
</script>
Popup Script:
$(function() {
$("#login_page").dialog({
autoOpen: false,
width: 300,
height: 100,
show: {
effect: "blind",
duration: 1000
},
hide: {
effect: "explode",
duration: 1000
},
});
$("#model").click(function() {
$("#login_page").dialog("open");
});
});
please give me a solution for this issue....