Hi...
I am beginner to MVC. am trying to develop a search engine using Ajax. my project have two views and one controller.. search screen having a textbox and a search button.
if i enter the value in the text box and click search button it navigate to next page(search result page) and the textbox filled with value which we give in search screen page textbox.
Thanks..
Search Screen Page:
<form method="post" action="@Url.Action("GetSearch","Search")">
<div style="float: left; margin-left: 325px;">
<input type="text" id="copy" name="search" style="height: 25px;width: 450px;border: 1px solid #4194FF;">
</div>
<div>
<input type="submit" id="btnsearch" name="btnsearch" value="search" />
</div>
</form>
Search Result Page:
<table>
<tr>
<td>
Keyword :
@*textbox*@ <input type="text" id="txtSearch" value="@Model.Item1" name="txtsearch" />
@*search*@ <input type="button" value="Search" id="btnSearch" />
@*AllSearch*@<input type="button" value="Get All User" id="btnAllUser" />
</td>
</tr>
<tr>
<td>
<div id="UpdatePanel">
</div>
</td>
</tr>
</table>
@section Scripts{
<script>
$(document).ready(function () {
// This is for Get All Data
$("#btnAllUser").click(function () {
$.ajax({
url: "@Url.Action("GetAllUser","User")",
data: "",
type: "GET",
dataType: "json",
success: function (data) {
loadData(data);
},
error: function () {
alert("Failed! Please try again.");
}
});
});
// this will use for Get Data based on parameter
$("#btnSearch").click(function () {
$.ajax({
url: "@Url.Action("GetUserWithParameter","User")",
data: { prefix: $('#txtSearch').val() },
type: "GET",
dataType: "json",
success: function (data) {
loadData(data);
},
error: function () {
alert("Failed! Please try again.");
}
});
});
function loadData(data) {
// Here we will format & load/show data
var tab = $('<table class="myTable"></table>');
var thead = $('<thead></thead>');
thead.append('<th>Business Name</th>');
thead.append('<th>Category</th>');
thead.append('<th>Description</th>');
tab.append(thead);
$.each(data, function (i, val) {
// Append database data here
var trow = $('<tr></tr>');
trow.append('<td>' + val.BusinessName + '</td>');
trow.append('<td>' + val.BusinessCategory + '</td>');
trow.append('<td>' + val.BusinessDescription + '</td>');
tab.append(trow);
});
$("#UpdatePanel").html(tab);
};
});
</script>
}
Controller:
public ActionResult GetUser(string keyword)
{
return View(new Tuple<string>(keyword));
}
[HttpPost]
public ActionResult GetSearch(FormCollection frm, string search)
{
return RedirectToAction("GetUser", new { keyword = frm["search"] });
}
public JsonResult GetAllUser()
{
List<tblbusinesscategory> allUser = new List<tblbusinesscategory>();
// Here "MyDatabaseEntities " is dbContext, which is created at time of model creation.
using (MvcApplication1Entities2 dc = new MvcApplication1Entities2())
{
allUser = dc.tblBusinessCategories.ToList();
}
return new JsonResult { Data=allUser, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
public JsonResult GetUserWithParameter(string prefix)
{
List<tblbusinesscategory> allUser = new List<tblbusinesscategory>();
// Here "MyDatabaseEntities " is dbContext, which is created at time of model creation.
using (MvcApplication1Entities2 dc = new MvcApplication1Entities2())
{
allUser = dc.tblBusinessCategories.Where(a => a.BusinessDescription.Contains(prefix) || a.BusinessName.Contains(prefix) || a.BusinessCategory.Contains(prefix)).ToList();
}
return new JsonResult { Data = allUser, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
}
}