Hi i came here with such unresolved issue.
I've ASP.NET MVC 4 web application with specific page which contains table of data,
(see below), this page simply contains a table with data, option set, and button to change table content according to value in option set:
<h2>
Index</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
<p>
<fieldset>
Movie Type
<select id="prePurchaseType" name="Type">
<option value="0" selected="selected">Time to start</option>
<option value="1">Highest prize value</option>
</select>
<input type="submit" id="btnSearch" value="Search" />
</fieldset>
</p>
<table>
<tr>
<th>
@Html.DisplayNameFor(model => model.RoomName)
</th>
<th>
@Html.DisplayNameFor(model => model.TimeToStart)
</th>
<th>
@Html.DisplayNameFor(model => model.PrizeValue)
</th>
<th>
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.RoomName)
</td>
<td>
@Html.DisplayFor(modelItem => item.TimeToStart)
</td>
<td>
@Html.DisplayFor(modelItem => item.PrizeValue)
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.RoomId }) |
@Html.ActionLink("Details", "Details", new { id = item.RoomId }) |
@Html.ActionLink("Delete", "Delete", new { id = item.RoomId })
</td>
</tr>
}
</table>
<script type="text/javascript" src="@Url.Content("~/Script/jquery-ui-1.8.11.min.js")" />
<script type="text/javascript">
$(document).ready(function () {
$('btnSearch').click(function () {
var type = $("#prePurchaseType").val();
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Order/OrderByType",
data: '{"type":"' + type + '"}',
dataType: "json",
success: function (msg) {
$('.item_wrap').after('<div>' + msg.d + '</div>');
},
error: function (xhr, status, error) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
});
});
</script>
Controller method:
[HttpPost]
public ActionResult Order(Models.PrePurchaseSearch search)
{
try
{
if (!ModelState.IsValid)
{
return Json(new
{
Result = "ERROR",
Message = "Form is not valid! " +
"Please correct it and try again."
});
}
return Json(new { Result = "OK", Record = search });
}
catch (Exception ex)
{
return Json(new { Result = "ERROR", Message = ex.Message });
}
return Index();
}
where Models.PrePurchaseSearch is:
public class PrePurchaseSearch
{
public string Type { get; set; }
}
Maybe someone can help me with this issue and rewrite my implementation in such way, that by selecting appropriate data in my select control and pressing btnSearch , application will change content (sort data by appropriate prePurchaseType)
??