I'm making a webapp which receives text when a barcode is scanned and submit it, which would be the same as submitting it when writing any letter in the textbox with a keyboard. I've tried with this code, but it submit it when the focus is changed from the textbox, not when the value is entered:
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Escaneado</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Texto, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Texto, new { htmlAttributes = new { #class = "form-control", #autofocus = "autofocus" } })
#Html.ValidationMessageFor(model => model.Texto, "", new { #class = "text-danger" })
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Cargar escaneados", "LoadScans")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$(document).ready(function () {
$('#Texto').change(function () {
$('form').submit();
});
});
</script>
}
I've tried using a .trigger in the script, looking like this:
<script type="text/javascript">
$(document).ready(function () {
$('#Texto').change(function () {
$('form').submit();
});
$('#Texto').trigger("change");
});
</script>
which submits, but when the page reloads after submitting, it enters in an infinite loop of submitting
With this script, the info is submitted and it doesn't loop:
<script type="text/javascript">
$(document).ready(function () {
$('#Texto').on('input', function () {
$('form').submit();
});
});
</script>
Change() event fires when the user types into the input and then loses focus. you will need to trigger the event when you pass that data, something like .trigger("change")
Related
My Validation is not firing on my popup its showing the popup just fine just not doing the validation
<div>
<form id="myForm">
#Html.HiddenFor(m => m.Id)
#Html.TextBoxFor(model => model.Name, new { #class = "form-control", #placeholder = "Name" })
<span asp-validation-for="#Model.Name" class="text-danger"></span>
#Html.TextBoxFor(model => model.Resitance, new { #class = "form-control", #placeholder = "Address" })
<span asp-validation-for="#Model.Resitance" class="text-danger"></span>
#Html.TextBoxFor(model => model.Passed, new { #class = "form-control", #placeholder = "Passed" })
<span asp-validation-for="#Model.Passed" class="text-danger"></span>
<select asp-for="CirtcutType"
asp-items="#Html.GetEnumSelectList(typeof(ElectricalSurvey.DAL.Models.CircuitModel.CirtcutTypes))"
class="form-control"></select>
<div class="modal-footer">
#if (Model.Id > 0) {<span>Update</span> } else {<span>Save</span>}
</div>
</form>
<div style="text-align:center;display:none" id="loaderDiv">
<img src="~/Content/InternetSlowdown_Day.gif" width="150" />
</div>
</div>
<script>
$(document).ready(function () {
$("#btnSubmit").click(function () {
$("#loaderDiv").show();
var myformdata = $("#myForm").serialize();
$.ajax({
type: "POST",
url: "/Electrician/SaveCircuit",
data: myformdata,
success: function () {
$("#loaderDiv").hide();
$("#MyEditUpateModal").modal("hide");
window.location.href = "/Electrician/Index";
}
})
})
})
_ValidationScriptsPartial.cshtml
<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
To Note I am handing the dialog in html via following method.
<script>
var AddOrUpdateCircuit = function (id) {
var url = "/Electrician/AddOrUpdateCircut?id=" + id;
$("#myModalBodyDiv1").load(url, function () {
$("#MyEditUpateModal").modal("show");
})
}
This one will help you get started
<form id="myForm" class="needs-validation" novalidate>
and
$("#btnSubmit").click(function (e) {
e.preventDefault(); // do not execute actual submit.
var form = $("#myForm")[0];
form.classList.remove('was-validated');
if (form.checkValidity() === false) {
form.classList.add('was-validated');
return;
}
$.ajax({
//perform ajax
});
})
I want to insert data using partial view for this action method which I have mentioned below.
The problem is that when I submit the Form it doesn't gave me any response.
What can I do with that post the comments and redirect to this page when comment is post?
And my partial view is located in a shared folder.
[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult Comments([Bind(Include = "CommentId,UserComments,UserId")] Comment comment)
{
if (ModelState.IsValid)
{
db.Comments.Add(comment);
db.SaveChanges();
return Json(comment, JsonRequestBehavior.AllowGet);
}
ViewBag.UserId = new SelectList(db.UserAccounts, "UserId", "FirstName", comment.UserId);
return Json(JsonRequestBehavior.AllowGet);
}
Rendering partial view in layout.
#Html.Partial("_Comments", new OnlineTaxiReservationSystem.Models.Comment())
and the partial view is here:
#model OnlineTaxiReservationSystem.Models.Comment
<script type="text/javascript">
$(document).on('click', '.btnSubmit', function () {
$.ajax({
url: '#Url.Action("Comments", "Home")',
cache: false,
async: true,
data: {
//put the data that you want to save from the partial here
UserId: $('#userId').val(),
UserComments: $('#content').val()
},
success: function (_result) {
window.location.href = "Home/Index";
}
});
});
#if (Session["user"] != null)
{
using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Your Feedback</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group" style="margin-left: 9%">
#Html.LabelFor(model => model.UserId, "User Name", htmlAttributes: new { #class = "control-label col-md-2" })
#*#Html.Label(Session["UserName"].ToString(), htmlAttributes: new { #class = "control-label label-primary col-md-1" })*#
<div class="col-md-4">
#Html.Editor("UserId", null, new { htmlAttributes = new { #class = "form-control", #id = "userId" } })
#Html.ValidationMessageFor(model => model.UserId, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.UserComments, htmlAttributes: new { #class = "control-label col-md-1" })
<div class="col-lg-12">
#Html.TextAreaFor(model => model.UserComments, new { htmlAttributes = new { #class = "form-control", #id = "content"} })
#Html.ValidationMessageFor(model => model.UserComments, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-1 col-md-10">
<input type="submit" value="Submit" id="btnSubmit" class="btn btn-primary" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
}
I think you are making a call to the wrong URL:
You need to add e.preventDefault(); if you are not going to submit by button but from javascript instead:
$(document).on('click', '.btnSubmit', function () {
e.preventDefault(); //cancel the default behavior
//do this instead (the ajax call):
$.ajax({
url: '#Url.Action("Comments", "Home")',
cache: false,
async: true,
data: {
//put the data that you want to save from the partial here
UserId: $('#userId').val(),
UserComments: $('#content').val()
},
success: function (_result) {
window.location.href = "Home/Index";
}
});
});
If you can provide the full details of your 404 call, I can be more spesific.
I'm making a asp.net mvc website and I'm trying to add a Date time picker for one of my model attributes in a form in my view. At the moment a datepicker displays but when I pick a date and submit the form the data is not saved. Before I tried adding a date picker the information saved so I believe the date picker is causing my problem. How exactly should a date picker be added to an HTML Form and should I use the jQuery UI datepicker or one of the many other ones available online? I've no experience with jQuery so it may be that I don't understand how datepicker works or haven't got the right js scripts. Thanks!!
<head>
<title>Create</title>
<link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css" />
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui- lightness/jquery-ui.min.css" />
</head>
<h2>Create</h2>
#using(Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Event</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Location, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Location, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Location, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.Date, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Date, new {id = "news_date"})
#Html.ValidationMessageFor(model => model.Date, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.StartTime, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.StartTime, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.StartTime, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
<script>
$(document).ready(function () {
$("##Html.IdFor(m => m.Date)").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
<script src="jquery.js"></script>
<script src="jquery.datetimepicker.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery- ui.min.js"></script>
My controller method, which is invoked when the form is submitted, looks like this
public ActionResult Create([Bind(Include = "EventID,Name,Location,Date,StartTime")] Meeting #meeting)
{
if (ModelState.IsValid)
{
context.Meetings.Add(#meeting);
context.SaveChanges();
return RedirectToAction("Index");
}
return View();
}
Change the dateFormat to use the default from:
$("##Html.IdFor(m => m.Date)").datepicker({ dateFormat: 'dd/mm/yy' });
to
$("##Html.IdFor(m => m.Date)").datepicker();
or
$("##Html.IdFor(m => m.Date)").datepicker({ dateFormat: 'mm/dd/yy' });
Please note that in order to fix it, you need to specify Month/Day/Year instead of Day/Month/Year. This is because the server side is expecting mm/dd/yy but the client side is providing dd/mm/yy.
EditorFor is rendered like: <input type="date" data-val="..." ... />
In Chrome the EditorFor rendered a datepicker default, but IE this is not working.
I suggest you try use #Html.TextBoxFor(model => model.Date, new {#type = "Date"}) and add in your script something like this:
$(function () {
$('#Date').datepicker();
});
This is my view it has 1 Main Form that consists of 3 child form inside.
#*MainForm*#
#using(Html.BeginForm("Create_SelectPersons","Appointment", FormMethod.Post))
{
#Html.AntiForgeryToken()
<h4>Step 2</h4>
<hr />
#Html.ValidationSummary()
#*Child Form1*#
using(Ajax.BeginForm("AddAttendeeManual", "Attendee", new AjaxOptions { HttpMethod = "POST", OnSuccess = "doneManualEmail" }))
{
#Html.HiddenFor(m=>m.SelectedManualEmail.AppointmentId)
<div class="form-group">
#Html.LabelFor(m => m.SelectedManualEmail.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedManualEmail.Email, new {#class = "form-control",PlaceHolder="Email"})
//button below tries to submit entire form(main) and not the child form
<input type='submit' class="btn btn-default" value="Add>>" />
</div>
</div>
}
if (Model.IsSuperOfficeConnected)
{
#*Child Form2*#
using(Ajax.BeginForm("AddAttendeeSuperOffice","Attendee",new AjaxOptions{HttpMethod = "POST", OnSuccess = "done"}))
{
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.FirstName, new { id = "SelectedSuperOfficeEmail_FirstName" })
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.LastName, new { id = "SelectedSuperOfficeEmail_LastName" })
#Html.HiddenFor(m=>m.SelectedSuperOfficeEmail.AppointmentId)
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.SuperOfficePersonId, new { id = "SelectedSuperOfficeEmail_SuperOfficePersonId" })
<div class="form-group">
#Html.LabelFor(m => m.SelectedSuperOfficeEmail.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedSuperOfficeEmail.Email, new { id = "SelectedSuperOfficeEmail", #class = "form-control", PlaceHolder = "Search in SuperOffice" })
<input type='submit' id="btnSuperOffice" class="btn btn-default" value="Add>>" />
</div>
</div>
}
}
if (Model.IsInternalAddressBookEmpty)
{
#*Child Form3*#
using(Ajax.BeginForm("AddAttendeeInternalAddressBook", "Attendee", new AjaxOptions { HttpMethod = "POST", OnSuccess = "done" }))
{
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.FirstName)
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.LastName)
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.AppointmentId)
<div class="form-group">
#Html.LabelFor(m => m.SelectedAddressBookPerson.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedAddressBookPerson.Email, new { id = "SelectedAddressBookPerson", #class = "form-control", PlaceHolder = "Search in AddressBook..." })
<input type='submit' id="btnAddressBook" class="btn btn-default" value="Add>>">
</div>
</div>
}
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input class="btn btn-default" value="<<Previous"/>
//this button which i am expecting to submit the main form, does nothing
<input type="submit" class="btn btn-default" value="Next>>" />
</div>
</div>
}
<style>
.ui-autocomplete-loading {
background: url('/Content/themes/base/images/ui-anim_basic_16x16.gif') no-repeat right center;
}
</style>
#section Scripts{
#Scripts.Render("~/bundles/jqueryval")
#Scripts.Render("~/Scripts/jquery-ui-1.10.4.min.js")
#Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
<script type="text/javascript">
$(function () {
$("#SelectedSuperOfficeEmail").
autocomplete({
source: '/Appointment/SuperOfficePerson',
minLength: 1,
select: function (event, ui) {
$('#SelectedSuperOfficeEmail').val(ui.item.value);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.FirstName)).val(ui.item.FirstName);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.LastName)).val(ui.item.LastName);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.SuperOfficePersonId)).val(ui.item.ExternalPersonId);
}
});
$("#SelectedAddressBookPerson").autocomplete({
source: '/Appointment/AddressBookPerson',
minLength: 1,
select: function(event,ui) {
$(#Html.IdFor((m=>m.SelectedAddressBookPerson.FirstName))).val(ui.item.FirstName);
$(#Html.IdFor(m=>m.SelectedAddressBookPerson.LastName)).val(ui.item.LastName);
},
});
});
function doneManualEmail() {
$(#Html.IdFor(m => m.SelectedManualEmail.Email)).val('');
}
function done() {
$(#Html.IdFor(m=>m.SelectedSuperOfficeEmail.Email)).val('');
$(#Html.IdFor(m=>m.SelectedAddressBookPerson.Email)).val('');
$(#Html.IdFor(m=>m.SelectedManualEmail.Email)).val('');
}
</script>
}
In the above code for the Child Form1 and Child Form3, when I submit click the button next to them it submits the child form, but for the Child Form1 when i click button next to it shouldn't it be submitting the child form?
Right now it is trying to submit the mail form. Why is that?
And the Next button of type submit, for the main form does nothing when i click it.
How should I solve this issue?
Edit 1: According to answer, I could solve this problem by removing the main form and having a jquery on click function for the Next>> button. But then why does second and third child form work and not first?
It is not valid HTML. You can use multiple forms but cannot use nested forms.
From official W3C XHTML specification prohibitions
form must not contain other form elements.
In my view currently I have a form and inside those forms I have three other forms, child form is submitted, i want it to forward some method in controller that just performs some database action but then i want to stay on the same page after the database action is performed.
#using System.Web.Mvc.Html
#using System.Web.UI.WebControls
#using DatePicker.Models.ViewModels.Appointment
#model DatePicker.Models.ViewModels.Appointment.CreateAppointmentSelectPersons
#{
ViewBag.Title = "Create";
Layout = "~/Views/Shared/_Layout.cshtml";
<link href="~/Content/themes/base/minified/jquery-ui.min.css" rel="stylesheet"/>
}
<h2>Create</h2>
#using(Html.BeginForm("Create","Appointment", FormMethod.Post,new { #class = "form-horizontal", role = "form" }))
{
#Html.AntiForgeryToken()
<h4>Step 2</h4>
<hr />
#Html.ValidationSummary()
#*ChildForm1*#
using (Html.BeginForm("AddAttendeeManual", "Attendee"))
{
#Html.HiddenFor(m=>m.SelectedManualEmail.AppointmentId)
<div class="form-group">
#Html.LabelFor(m => m.SelectedManualEmail.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedManualEmail.Email, new { id = "Email", #class = "form-control",PlaceHolder="Email"}) <input type='submit' id="btnEmail" class="btn btn-default" value="Add>>" />
</div>
</div>
}
if (Model.IsSuperOfficeConnected)
{
#*ChildFrom2*#
using (Html.BeginForm("AddAttendeeSuperOffice","Attendee",FormMethod.Post))
{
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.FirstName, new { id = "SelectedSuperOfficeEmail_FirstName" })
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.LastName, new { id = "SelectedSuperOfficeEmail_LastName" })
#Html.HiddenFor(m=>m.SelectedSuperOfficeEmail.AppointmentId)
#Html.HiddenFor(m => m.SelectedSuperOfficeEmail.SuperOfficePersonId, new { id = "SelectedSuperOfficeEmail_SuperOfficePersonId" })
<div class="form-group">
#Html.LabelFor(m => m.SelectedSuperOfficeEmail.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedSuperOfficeEmail.Email, new { id = "SelectedSuperOfficeEmail", #class = "form-control", PlaceHolder = "Search in SuperOffice" })
<input type='submit' id="btnEmail" class="btn btn-default" value="Add>>" />
</div>
</div>
}
}
if (Model.IsInternalAddressBookEmpty)
{
#*ChildForm3*#
using (Html.BeginForm("AddAttendeeInternalAddressBook", "Attendee"))
{
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.FirstName)
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.LastName)
#Html.HiddenFor(m=>m.SelectedAddressBookPerson.AppointmentId)
<div class="form-group">
#Html.LabelFor(m => m.SelectedAddressBookPerson.Email, new { #class = "col-md-2 control-label" })
<div class="col-md-8 input-group">
#Html.TextBoxFor(m => m.SelectedAddressBookPerson.Email, new { id = "SelectedAddressBookPerson", #class = "form-control", PlaceHolder = "Search in AddressBook..." }) <input type='button' id="btnAddressBook" class="btn btn-default" value="Add>>">
</div>
</div>
}
}
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input class="btn btn-default" value="<<Previous"/>
<input type="submit" class="btn btn-default" value="Next>>" />
</div>
</div>
}
<style>
.ui-autocomplete-loading {
background: url('/Content/themes/base/images/ui-anim_basic_16x16.gif') no-repeat right center;
}
</style>
#section Scripts{
#Scripts.Render("~/bundles/jqueryval")
#Scripts.Render("~/Scripts/jquery-ui-1.10.4.min.js")
<script type="text/javascript">
$(function () {
$("#SelectedSuperOfficeEmail").
autocomplete({
source: '/Appointment/SuperOfficePerson',
minLength: 1,
select: function (event, ui) {
$('#SelectedSuperOfficeEmail').val(ui.item.value);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.FirstName)).val(ui.item.FirstName);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.LastName)).val(ui.item.LastName);
$(#Html.IdFor(m => m.SelectedSuperOfficeEmail.SuperOfficePersonId)).val(ui.item.ExternalPersonId);
}
});
$("#SelectedAddressBookPerson").autocomplete({
source: '/Appointment/AddressBookPerson',
minLength: 1,
select: function(event,ui) {
$(#Html.IdFor((m=>m.SelectedAddressBookPerson.FirstName))).val(ui.item.FirstName);
$(#Html.IdFor(m=>m.SelectedAddressBookPerson.LastName)).val(ui.item.LastName);
},
});
});
</script>
}
this is what i've done in controller
[HttpPost]
public void AddAttendeeSuperOffice(CreateAppointmentSelectPersons superOfficePerson)
{
_attendeeRepository.AddSuperOfficeAttende(superOfficePerson.SelectedSuperOfficeEmail.AppointmentId,
superOfficePerson.SelectedSuperOfficeEmail.FirstName,
superOfficePerson.SelectedSuperOfficeEmail.LastName,
superOfficePerson.SelectedSuperOfficeEmail.Email,
superOfficePerson.SelectedSuperOfficeEmail.SuperOfficePersonId);
}
[HttpPost]
public void AddAttendeeInternalAddressBook(CreateAppointmentSelectPersons internalAddressbookPerson)
{
_attendeeRepository.AddInternalAddressBookAttendee(
internalAddressbookPerson.SelectedAddressBookPerson.AppointmentId,
internalAddressbookPerson.SelectedAddressBookPerson.FirstName,
internalAddressbookPerson.SelectedAddressBookPerson.LastName,
internalAddressbookPerson.SelectedAddressBookPerson.Email);
}
[HttpPost]
public void AddAttendeeManual(CreateAppointmentSelectPersons manualEmail)
{
_attendeeRepository.AddManualAttendee(manualEmail.SelectedManualEmail.AppointmentId,
manualEmail.SelectedManualEmail.Email);
}
so whenever my childfrom gets submitted, database action takes place but I get forwarded to different link.
I could use, return RedirectToAction but I don't want to load the whole page again, thats makes it kind of slow to load whole thing again.
I thought of using Partial Views but then partial view didn't really help me achieve what I get.
Is there someway to just stay on the same page and make a void call upon child form submission, so that i stay on same page. Maybe, just make the textbox of the child form empty?
It is better to submit child forms to controller using Ajax.
Assuming the below child form you want to submit,
using (Html.BeginForm("AddAttendeeInternalAddressBook", "Attendee", new{id="frm-child-address"}))
then
$('#mybutton').click(function(){
var postData= $('#frm-child-address').serialize();
$.post('/Attendee/AddAttendeeInternalAddressBook',{data:postData},function(res){
//based on server response do whatever you require
});
});
You can use #Ajax.BeginForm and add a javascript callback that would fire off after the controller's action (database call) has completed.
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
#using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST", OnSuccess = "done" }))
{
#* form *#
}
<script type="text/javascript">
function done(){
// The database call is complete.
}
</script>