Am having a page with a button and a table
<input type="submit" value="Email" name="button" class="openDialog" data-dialog-id="Mail Dialog" data-dialog-title="Send Mail" data-url="<%: Url.Action("SendMail") %>" />
<form>
<table>
<tr>
<th>
<input type="checkbox"/>
<input type="hidden" class="textfield" id="video0_tags" name="video0_tags" />
</th>
<th>
FirstName
</th>
<th>
LastName
</th>
</tr>
<% foreach (var item in Model)
{ %>
<tr>
<td>
<div class="taglist">
<input type="checkbox" name="check" value="<%: item.ProfileId %>" />
</div>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.FirstName)%>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.LastName)%>
</td>
<% } %>
</table>
</form>
And in my controller
[HttpGet]
public ActionResult SendMail(string video0_tags)
{
return View();
}
[HttpPost]
public ActionResult SendMail(int[] check,Profile profile, mail email)
{
foreach (var item in check)
{
var dbprofile = db.Profile.Single(p => p.ProfileId == item);
string Emailid = dbprofile.EmailId;
MailMessage msg = new MailMessage();
MailAddress fromAddress = new MailAddress("xxxx#gmail.com");
msg.From = fromAddress;
msg.To.Add(Emailid);
msg.Subject = email.Subject;
msg.Body = email.Body;
msg.Priority = MailPriority.High;
SmtpClient client = new SmtpClient("smtp.gmail.com", 587);
client.DeliveryMethod = SmtpDeliveryMethod.Network;
client.Credentials = new NetworkCredential("xxxxx#gmail.com", "password");
client.EnableSsl = true;
client.Send(msg);
}
return RedirectToAction("Profiles", "profile");
}
Problem
My problem is that am unable to pass the checkbox checked values to the get actionresult of popup. This is send email to multiple members based on checkbox checked items.
Can any one help me..... Please
The thing is that the checkbox is a boolean input.
Is would be better if you would store the profile id in a hidden input field
And by the way don't forget to wrap your table in a form.
<form>
<input type="submit" .../>
<table> ... </table>
</form>
Related
On the same view I am returning a list. Also, I have [HttpPost] to create new entry.
When the model is not valid, The ValidationSummary shows that expenseName is Required.
I would like to show Model required error Messages near each field in my View. asp-Validation-for was working when I didn't have IEnumerable model. What I have to do so I can see the validation error messages using IEnumerable model? (etc. for expenseName)
Model
[Key]
public int expenseId { get; set; }
[Column(TypeName = "nvarchar(50)")]
[Required(ErrorMessage = "The field 'Expense Name' is required")]
public string expenseName { get; set;}
public double price { get; set; }
public bool isStandard { get; set; }
public DateTime? date { get; set; }
View
#model IEnumerable<ExpenseTracker.Models.Expenses>
#Html.ValidationSummary(false, "", new { #class = "text-danger" })
#{
ViewData["Title"] = "Index";
}
<form method="post" enctype="multipart/form-data" asp-controller="Expenses" asp-action="Index">
<div>
<label for="files" class="lbl-select-file">Select Expense File</label>
<input id="files" name="postedFiles" class="btn-uploader" type="file">
</div>
<label class="expense-name-lbl" for="expenseName">Expense Name</label>
<input type="text" name="expenseName" class="expense-name-input" id="expenseName" />
**<span asp-validation-for=" " class="text-danger"></span>**
<div class="form-group form-check">
<label class="form-check-label checkbox-isStandard-form">
<input class="form-check-input" type="checkbox" name="chkeco" title="Check this if the bill is monthly/yearly" /> Is Standard?
</label>
</div>
<input type="submit" class="btn btn-success btnColor-expenses" value="Upload" />
<label id="fileName"></label>
<span class="uploaded-file">#Html.Raw(ViewBag.Message)</span>
</form>
<table class="table table-text">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model.expenseName)
</th>
<th>
#Html.DisplayNameFor(model => model.price)
</th>
<th>
#Html.DisplayNameFor(model => model.isStandard)
</th>
<th>
#Html.DisplayNameFor(model => model.date)
</th>
<th></th>
</tr>
</thead>
<tbody>
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.expenseName)
</td>
<td>
#Html.DisplayFor(modelItem => item.price)
</td>
<td>
<input type="checkbox" class="checkbox-isStandard" checked="#item.isStandard" />
</td>
<td>
#if (item.date.HasValue)
{
DateTime? datetimeToDate = #item.date;
string FormattedDate = datetimeToDate.Value.ToString("dd-MM-yyyy");
<label>#FormattedDate</label>
}
</td>
<td>
<a asp-action="Edit" asp-route-id="#item.expenseId">Edit</a> |
<a asp-action="Details" asp-route-id="#item.expenseId">Details</a> |
<a asp-action="Delete" asp-route-id="#item.expenseId">Delete</a>
</td>
</tr>
}
</tbody>
</table>
Controller
[HttpPost]
[ValidateAntiForgeryToken]
[PreventDuplicateRequest]
public async Task<IActionResult> Index(IFormCollection formCollection, string expenseName,
List<IFormFile> postedFiles, [Bind("expenseName,price,isStandard,date")] Expenses expenses)
{
if (ModelState.IsValid)
{
......
return View(await _context.Expenses.ToListAsync());
}
else
{
return View(await _context.Expenses.ToListAsync());
}
You can create a ViewModel which contains a List<Expenses>(you wanna display in the view) and a Expenses(you wanna upload to the controller).
ViewModel
public class ExpensesViewModel
{
//Pass the value to this parameter in the get method to display on the page
public List<Expenses> ListModel { get; set; }
public Expenses model { get; set; }
}
Then change your view code like:
#model ExpensesViewModel
#Html.ValidationSummary(false, "", new { #class = "text-danger" })
#{
ViewData["Title"] = "Index";
}
<form method="post" enctype="multipart/form-data" asp-controller="Home" asp-action="Show">
<div>
<label for="files" class="lbl-select-file">Select Expense File</label>
<input id="files" name="postedFiles" class="btn-uploader" type="file">
</div>
<div class="form-group">
<label class="expense-name-lbl" for="expenseName">Expense Name</label>
<input type="text" \ class="expense-name-input" asp-for=#Model.model.expenseName />
<span asp-validation-for="#Model.model.expenseName" class="text-danger"></span>
</div>
<div class="form-group form-check">
<label class="form-check-label checkbox-isStandard-form">
<input class="form-check-input" type="checkbox" name="chkeco" title="Check this if the bill is monthly/yearly" /> Is Standard?
</label>
</div>
<input type="submit" class="btn btn-success btnColor-expenses" value="Upload" />
<label id="fileName"></label>
<span class="uploaded-file">#Html.Raw(ViewBag.Message)</span>
</form>
<table class="table table-text">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model.model.expenseName)
</th>
<th>
#Html.DisplayNameFor(model => model.model.price)
</th>
<th>
#Html.DisplayNameFor(model => model.model.isStandard)
</th>
<th>
#Html.DisplayNameFor(model => model.model.date)
</th>
<th></th>
</tr>
</thead>
<tbody>
#foreach (var item in Model.ListModel)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.expenseName)
</td>
<td>
#Html.DisplayFor(modelItem => item.price)
</td>
<td>
<input type="checkbox" class="checkbox-isStandard" checked="#item.isStandard" />
</td>
<td>
#if (item.date.HasValue)
{
DateTime? datetimeToDate = #item.date;
string FormattedDate = datetimeToDate.Value.ToString("dd-MM-yyyy");
<label>#FormattedDate</label>
}
</td>
<td>
<a asp-action="Edit" asp-route-id="#item.expenseId">Edit</a> |
<a asp-action="Details" asp-route-id="#item.expenseId">Details</a> |
<a asp-action="Delete" asp-route-id="#item.expenseId">Delete</a>
</td>
</tr>
}
</tbody>
</table>
Finally, You can validate your expenseName property.
You can try to add this validation js.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js"></script>
I have following list view with checkboxes:
#model IEnumerable<PaketServisAracTakip.Models.Item>
#{
ViewData["Title"] = "Yükleme Yap";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2 class="text-center text-success">#ViewBag.name İsimli Araca Yükleme Yap</h2>
<form asp-controller="Vehicle"
asp-action="LoadItem" method="post">
<br />
<input type="submit" name="submit" value="Oluştur" class="btn btn-primary" />
</form>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th class="text-center">
Yüklensin mi?
</th>
<th class="text-center">
#Html.DisplayNameFor(model => model.Name)
</th>
<th class="text-center">
#Html.DisplayNameFor(model => model.Price)
</th>
<th class="text-center">
#Html.DisplayNameFor(model => model.Description)
</th>
</tr>
</thead>
<tbody>
#foreach (var item in Model)
{
<tr>
<td>
<div class="form-check">
<label class="form-check-label" for="#item.Id" asp-validation-for="#item.Id"></label>
<input class="form-check-input" name="ids" type="checkbox" value="#item.Id" id="#item.Id">
</div>
</td>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
₺#Html.DisplayFor(modelItem => item.Price)
</td>
<td>
#Html.DisplayFor(modelItem => item.Description)
</td>
</tr>
}
</tbody>
</table>
And my item model with database integrated:
[Table("Items")]
public class Item
{
[Key]
public int Id { get; set; }
[Display(Name = "İsim")]
[Required(ErrorMessage ="{0} alanı boş bırakılamaz.")]
[MaxLength(50, ErrorMessage ="İsim 50 karakteri geçemez.")]
public String Name { get; set; }
[Display(Name = "Fiyat")]
[Required(ErrorMessage = "{0} alanı boş bırakılamaz.")]
[Range(0, Double.MaxValue, ErrorMessage = "Minimum 0 girmelisin.")]
public int Price { get; set; }
[Display(Name = "Açıklama")]
public String Description { get; set; }
}
view
So when button is clicked i want to get checked items in my controller. I tried this but its empty:
[HttpPost]
public ActionResult LoadItem(IEnumerable<Item> model)
{
return RedirectToAction("Index");
}
I also tried int array and FormCollection but didn't work. I think I need some tag helpers but don't know which.
when button is clicked i want to get checked items in my controller. I
tried this but its empty
Please check the code in the View Page, since the table doesn't in the <form> element, when you click the Submit button, the submitted form doesn't contain the related data.
Besides, to submit the model data to the controller using model binding, we should use the #for statement to loop through the entities and use hidden fields to store the related data. Please refer the following sample and change your code:
Model:
[Table("Items")]
public class Item
{
[Key]
public int Id { get; set; }
[Display(Name = "İsim")]
[Required(ErrorMessage = "{0} alanı boş bırakılamaz.")]
[MaxLength(50, ErrorMessage = "İsim 50 karakteri geçemez.")]
public String Name { get; set; }
[Display(Name = "Fiyat")]
[Required(ErrorMessage = "{0} alanı boş bırakılamaz.")]
[Range(0, Double.MaxValue, ErrorMessage = "Minimum 0 girmelisin.")]
public int Price { get; set; }
[Display(Name = "Açıklama")]
public String Description { get; set; }
public Boolean IsChecked { get; set; } //add a property to store whether the item is check or not.
}
View page:
#model List<netcore3_1sample.Models.Item>
#{
ViewData["Title"] = "ItemIndex";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2 class="text-center text-success">#ViewBag.name İsimli Araca Yükleme Yap</h2>
<form asp-controller="Home"
asp-action="LoadItem" method="post">
<br />
<input type="submit" name="submit" value="Oluştur" class="btn btn-primary" />
<br />
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th class="text-center">
Yüklensin mi?
</th>
<th class="text-center">
Name
</th>
<th class="text-center">
Price
</th>
<th class="text-center">
Description
</th>
</tr>
</thead>
<tbody>
#for( var i = 0; i < Model.Count;i++)
{
<tr>
<td>
<div class="form-check">
<label class="form-check-label" for="#Model[i].Id" asp-validation-for="#Model[i].Id"></label>
<input class="form-check-input" name="ids" type="checkbox" value="#Model[i].Id" id="#Model[i].Id">
#*<input type="checkbox" asp-for="#Model[i].IsChecked" />*#
<input type="hidden" asp-for="#Model[i].Id" />
</div>
</td>
<td>
#Html.DisplayFor(modelItem => Model[i].Name)
<input type="hidden" asp-for="#Model[i].Name" />
</td>
<td>
₺#Html.DisplayFor(modelItem => Model[i].Price)
<input type="hidden" asp-for="#Model[i].Price" />
</td>
<td>
#Html.DisplayFor(modelItem => Model[i].Description)
<input type="hidden" asp-for="#Model[i].Description" />
</td>
</tr>
}
</tbody>
</table>
</form>
Code in the controller:
[HttpPost]
public ActionResult LoadItem(List<Item> model, int[] ids)
{
return RedirectToAction("ItemIndex");
}
According to your code, you are using a html checkbox element to store the selected Item ID, so here we need to add an array to get the selected ids.
Besides, you could add a IsChecked property in the Item model, then change the following code:
<input class="form-check-input" name="ids" type="checkbox" value="#Model[i].Id" id="#Model[i].Id">
to
<input type="checkbox" asp-for="#Model[i].IsChecked" />
By using this method, in the controller, you could filter the selected item based on the IsChecked property.
The result like this:
I have been researching and trying multiple failed attempts FOR DAYS to get my partial view to display within my main view using Ajax.actionlink. When using the developer tools and viewing the Network tab, I do see the request. When clicking on Preview, I can see the correct data within the partial view. No jQuery errors.
View
#model IEnumerable<NS.Models.FeeAuth>
#using (Html.BeginForm())
{
<p>
<span class="glyphicon glyphicon-search"></span> Find by Last Name: #Html.TextBox("SearchString")
<input type="submit" value="Search" />
</p>
}
<div class="table-responsive">
<table class="table table-condensed" style="border-collapse:collapse;">
<tr>
<th>
#Html.LabelFor(m => m.First().ID)
</th>
<th>
#Html.ActionLink("Request ID", "ApprovalIndex", new { sortOrder = ViewBag.RequestIDSortParam })
</th>
<th>
#Html.Label("emplid", "Student Emplid")
</th>
</tr>
#{int i = 0;}
#foreach (var item in Model)
{
<tr data-toggle="collapse" data-parent="#collapse1_#i" data-target="#collapse1_#i" class="accordion-toggle">
<td>
#Ajax.ActionLink(Html.Encode(item.ID),
"SelectedSTRMS",
"FeeAuth",
new { id = item.ID, requestId = item.requestID },
new AjaxOptions
{
HttpMethod = "GET",
UpdateTargetId = "SelectedSTRMList" + i,
InsertionMode = InsertionMode.Replace
})
</td>
<td>
#Html.DisplayFor(modelItem => item.requestID)
</td>
<td>
#Html.DisplayFor(modelItem => item.emplid)
</td>
</tr>
<tr>
<td colspan="6" class="hiddenRow">
<div class="accordion-body collapse" id="collapse1_#i">
<div id="SelectedSTRMList_#i">
</div>
</div>
</td>
</tr>
i++;
}
</table>
</div>
Partial View
<table>
<tr>
<td>
<ul>
#foreach (var s in (List<string>)ViewBag.SemesterInfo)
{
<li style="padding-bottom:20px;">#s</li>
}
</ul>
</td>
</tr>
</table>
Jquery in _Layout.cshtml
<script src="~/Scripts/jquery-2.1.3.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
Controller
[HttpGet]
public PartialViewResult SelectedSTRMS(int id, int requestId)
{
FeeAuthWithCommentsViewModel feeauth = new FeeAuthWithCommentsViewModel();
feeauth.FeeAuth = db.FeeAuths.Find(id);
int feeauthID = id;
List<string> GetSTRM = new List<string>();
GetSTRM = db.vw_GetSTRMs.Where(v => v.FeeAuthID == feeauthID).Select(v => v.DESCR).ToList();
if (GetSTRM.Count > 0)
{
ViewBag.SemesterInfo = GetSTRM.ToList();
}
else
{
ViewBag.SemesterInfo = new List<string> { "No STRM Selected" };
}
return PartialView("_SelectedSTRMS");
}
Your update target is:
UpdateTargetId = "SelectedSTRMList" + i,
But your div id is:
<div id="SelectedSTRMList_#i">
In other words, you're either missing an _ in the update target string or you need to remove the _ in your div id.
I want to reuse the popup.cshtml when ever i click the actionlink on index.cshtml page. When i click the category id action link, i can see the popup with 2 textboxes and submit button, which inserts data into category dropdown.
I want the same popup coming up when jobid action link is clicked, but insert into jobid dropdown.
Please help me
Index.cshtml
<td>
#Html.DropDownList("CategoryID")
#Html.ActionLink("New test", "Popup", "Home", null, new { #class = "openPopup", data_dialog_id = "popuplDialog", data_dialog_title = "Add New" })
</td>
<td>
#Html.DropDownList("JobID")
#Html.ActionLink("New", "Popup", "Home", null, new { #class = "openPopup", data_dialog_id = "popuplDialog", data_dialog_title = "Popup" })
</td>
Popup.cshtml
#model MVC3.Models.ValidationModel
#{
ViewBag.Title = "Popup";
Layout = null;
}
<script type="text/javascript">
$(document).ready(function () {
$('#subbutton').live("click", function () {
var code = $("#txtCode").val();
var value = $
var characterReg = /^[A-Za-z0-9 _]*[A-Za-z0-9][A-Za-z0-9 _]*$/;
if (!characterReg.test(inputVal)) {
$('#codelbl').text("*");
return false;
}
if (!characterReg.test(inputVal)) {
$('#codelbl').text("*");
return false;
}
// $(this).closest(".dialog").dialog("close");
// alert("test1");
});
});
</script>
#{
ViewBag.Title = "";
}
#using (Html.BeginForm())
{
<table>
<tr>
<td>
<label> Code</label>
</td>
<td>
#Html.TextBox("txtCode")
<label id="codelbl" style="color:Red"></label>
</td>
</tr>
<tr>
<td>
<label>Name</label>
</td>
<td>
#Html.TextBox("txtName")
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
<input id="subbutton" type="submit" value="Insert" />
</td>
</tr>
</table>
}
You could store the ID of the dropdown you want to insert into on the parent page when you click the link using JavaScript, before you open the popup.
Then on the subbutton click event, read the value of what to insert into from that hidden input and act accordingly.
MVC 3 , ajax, c#
My partial view is rendering as a new page instead of replacing the search results table.
Controller:
public class SearchController : Controller
{
//
// GET: /Search/
private myEntities db = new myEntities();
private Repository repo = new Repository();
[HttpGet]
public ActionResult Index()
{
var model = new List<PersonViewModel>();
model = repo.GetPeople();
return View(model);
}
public PartialViewResult _SearchResult(string fname, string lname)
{
var personResult = repo.GetSearchResult(fname, lname);
return PartialView("_SearchResult", personResult);
}
}
The view:
<div class="page">
<div class="middle-col-comment-mod">
<h2>Search Existing Trespassers</h2>
<div id="search">
#using (Ajax.BeginForm("_SearchResult", "Search", null, new AjaxOptions { HttpMethod = "Post", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, UpdateTargetId = "indexSearchResults" }))
{
<div class="editor-field">
<label>First Name:</label>
#Html.TextBox("FirstName")
<label style = "margin-left: 15px;">Last Name:</label>
#Html.TextBox("LastName", "", new { style = "margin-right: 15px;" })
<input type="submit" name="submit" class="skbutton" value="Search" />
</div>
}
</div>
<table id="indexSearchResults" class="data-table">
<tr>
<th>
FirstName
</th>
<th>
LastName
</th>
<th>
Gender
</th>
<th>
City
</th>
<th>
DOB
</th>
<th>
IsStudent
</th>
<th>
Actions
</th>
</tr>
#if (Model.Count() == 0)
{
<tr>
<td colspan=7>
There are currently no trespassers in the trespass database.
</td>
</tr>
}
else
{
foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.FirstName)
</td>
<td>
#Html.DisplayFor(modelItem => item.LastName)
</td>
<td>
#Html.DisplayFor(modelItem => item.Gender)
</td>
<td>
#Html.DisplayFor(modelItem => item.DOB)
</td>
<td>
#Html.DisplayFor(modelItem => item.School)
</td>
<td>
#Html.DisplayFor(modelItem => item.IsStudent)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { id = item.PersonId }) |
#Html.ActionLink("Details", "Details", new { id = item.PersonId }) |
#Html.ActionLink("Delete", "Delete", new { id = item.PersonId })
</td>
</tr>
}
}
</table>
</div>
</div>
And the partial view:
#model IEnumerable<TrespassTracker.Models.PersonViewModel>
<table>
<tr>
<th>
First Name
</th>
<th>
Last Name
</th>
<th>
Gender
</th>
<th>
Date of Birth
</th>
<th>
Is a Student?
</th>
<th>
Actions
</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.FirstName)
</td>
<td>
#Html.DisplayFor(modelItem => item.LastName)
</td>
<td>
#Html.DisplayFor(modelItem => item.Gender)
</td>
<td>
#Html.DisplayFor(modelItem => item.DOB)
</td>
<td>
#Html.DisplayFor(modelItem => item.IsStudent)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
#Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
#Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
</td>
</tr>
}
</table>
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
From my research I found the usual suspect to be the missing link to the jquery script in the partial, but I had that. I checked the network tab on my wed dev tools and found it is being called. What else could the problem be?
the script won't cause any problem and the only thing I see wrong here is the table. you are trying yo fill the table with other table which returns a table, use a div instead to update the ajax form (search result):
<div id="indexSearchResults">
<table>
..........
</table>
</div>
Try this
<div class="page">
<div class="middle-col-comment-mod">
<h2>Search Existing Trespassers</h2>
<div id="search">
#using (Ajax.BeginForm("_SearchResult", "Search", null, new AjaxOptions { HttpMethod = "Post", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, UpdateTargetId = "indexSearchResults" }))
{
<div class="editor-field">
<label>First Name:</label>
#Html.TextBox("FirstName")
<label style = "margin-left: 15px;">Last Name:</label>
#Html.TextBox("LastName", "", new { style = "margin-right: 15px;" })
<input type="submit" name="submit" class="skbutton" value="Search" />
</div>
}
</div>
#if (Model.Count() == 0)
{
<label>There are currently no trespassers in the trespass database. </label>
}
else
{
foreach (var item in Model)
{
#Html.Partial("__SearchResult",item)
}
</div>
</div>
How 'bout to use jQuery do reload your result content, instead Post from your form? You can named some div with an ID and uses it as reference do jQuery.load() (considering you're using that ViewModel you passed into Index action):
1.View
#model YourModel
<!-- ... -->
<div id="search">
#using (Ajax.BeginForm("MainPostAction", "ControllerName", FormMethod.Post, new { id = "yourFormID" })
{
<div class="editor-field">
<label>First Name:</label>
#Html.TextBoxFor(model => model.FirstName)
<label style = "margin-left: 15px;">Last Name:</label>
#Html.TextBoxFor(model => model.LastName, new { style = "margin-right: 15px;" })
<input type="button" name="submit" id="searchButton" class="skbutton" value="Search" />
</div>
<div id="results"></div>
}
</div>
Javascript:
$(document).ready(function() {
$('#searchButton').click(function(event) {
$('#results').load('#Url.Action('_SearchResult', 'Search')', $('#yourFormID').serialize());
});
}
Your action remains the same.
How 'bout it?