I am new to MVC, I am trying to edit a row and sending edited data to a controller method via jQuery and AJAX, when I click on edit the specific row becomes textboxes and
You have asked a similar question before and the main problem is the same problem as before. You cannot use a foreach loop with @Html.TextBoxFor etc. You need to use a for loop and have indexing on the expressions:
Problem 1:
e.g.
@for (int i = 0; i < Model.Count(); i++)
{
[snip]
@Html.TextBoxFor(m => Model[i].Holiday_Name, new { style = "display: none; width:170px; height:15px" })
@Html.DisplayFor(m => Model[i].Holiday_Name)
[snip]
}
The problem is that the expression tree passed to TextBoxFor needs to have knowledge of the index value in order to generate the indexed names correctly. The local variable provided by a foreach has no idea what position it was within its parent collection.
Problem 2
The other problem is that you only want to send a single row back to the Edit method. This is at odds with the above recommendation.
Try just serialising the single row, then the incorrect naming of elements should actually work in your favor:
var data = $(this).closest('tr').serialize();
Other issues
Your page currently takes an IEnumerable collection of items.
You would normally render these with a for loop (not for each - see problem 1). You would then post back the entire page so that your edit method should also use an IEnumerable
e.g.
public ActionResult Edit(IEnumerable tbl_holidaylist)
{
foreach( var holiday in tbl_holidaylist)
{
//save changes
}
}
Basically you have two conflicting things going on in your page. You need to decide whether to go with the standard MVC practices or against them :)