Hi,
I am using Asp.Net MVC3 and Infragistics grid.
I have a page with few controls and a search button. On the click of search, I am showing Search results in igGrid.
The Ajax Form code is as below:
@using (Ajax.BeginForm("Search", "Search", new AjaxOptions() { HttpMethod = "POST", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, OnBegin = "BlockUI", OnComplete = "UnBlockUI", UpdateTargetId = "page" }))
{
<div class="div-left">
//other controls
<div><br /><input type="submit" class="ui-button" value="Search" id="searchButton" /> </div>
</div>
<div class="div-right">
@{ if (Model.SearchResults != null && Model.SearchResults.Count > 0)
{ @(Html
.Infragistics().Grid<SearchSummary>(Model.SearchResults.AsQueryable()).ID("grid").AutoGenerateColumns(false)
.Columns(col => { col.For(x => x.SummaryName).HeaderText("Run Id");
col.For(x => x.Inventory).HeaderText("Inventory");
col.For(x => x.Process).HeaderText("Process"); })
.Features(features => { features.Paging().PageSize(50).Type(OpType.Local);
features.Selection().Mode(SelectionMode.Row).MultipleSelection(false).Activation(true);
features.Filtering().Mode(FilterMode.Advanced).CaseSensitive(true); features.Sorting(); features.Resizing(); })
.Height("700px") .DataBind() .Render() ) }
}
When in click on SEARCH, first time the GRID gets loaded with data. But when I hit Search button second time, I get below error:
Microsoft JScript runtime error: Object doesn't support property or method 'igGrid'
I found that the loader is getting removed on postback. Hence the error is coming.
Below is my code with loader:
@(Html.Infragistics().Loader() .ScriptPath(Url.Content("~/Scripts/Ig")) .CssPath(Url.Content("~/Content/Ig")) .Render() )
//content controls and submit button
When first time Ajax Postback hits, the Loader is present and grid gets loaded correctly. When the search button is hit for second time, the loader is not available.
I believe this is happening because of AJAX. Additionally is there any way to inject loader using script ??
Hello sanjaysutar,
Thank you for posting in our forum.
Are you returning a whole view from the ActionResult Search of the controller ( return View(data))?
Generally when you set a UpdateTargetId you should not return a whole new view but a partial view or a json result .When you have UpdateTargetId this will remove the content of the target container and append the new one as html/script. So the two options I can suggest are:
- Use a partial view: Set the grid and its loader in a partial view and load it inside your form. More information on the partial views and how to use them you can find here:http://www.devcurry.com/2012/04/partial-views-in-aspnet-mvc-3.html
- Return a json result with the data from your action: return Json(data, JsonRequestBehavior.AllowGet); and bind the grid on success of the request:
$('#gridId').igGrid('option', 'dataSource', data);
If you want to return the whole view you’ll have to omit the UpdateTargetId. The post will make a new request to the whole view so it will load the view and the layout and will render them again.
Best Regards,
Maya Kirova
Developer Support Engineer
Infragistics, Inc.
http://ko.infragistics.com/support