Hi,
I'm having issues when trying to use .NET MVC Partial View with igLoader. Here's the scenario:
- I have a page with several tabs and each tab is an MVC partial view. The first tab does not have igGrid, and it loads just fine. On the second tab, it has a grid and when it tries to load the partial view I'm getting two errors:
"Cannot read property 'locale' of undefined" and "Uncaught Error: No such widget loaded: igGridPaging"
This happens both on IE9 and Chrome.
What I found is that when I'm not using partial view, the generated script for a control always have the widget name in front of it. so for instance:
$.ig.loader('igCombo', function() {})
However, when the control is on a partial view, the generated script does not have the widget name in front of it
$.ig.loader(function() {$('controlId')....})
I'm using MVC helper and the latest service release 2056
Please help
Hello jAndika,
Thank you for contacting Infragistics!
I have a few questions concerning this matter. Can you please clarify what version of Ignite UI you are using v12.1 or v12.2? What version of Chrome are you using? Have you tried it in FireFox?
Looking forward to hear from you.
Sincerely,Mike P.Developer Support EngineerInfragistics, Inc.www.infragistics.com
I'm using v12.2, and I just actually updated the scripts today to the latest SR 2086 but the issue is still there. It does not work in Firefox as well.
Chrome Version: 24.0.1312.52 m
Firefox Version: 17.0.1
Thank you for the update. With MVC are you using the ASPX or Razor view engine? Is there a reason you are using JavaScript over the MVC helper for example:
<%= Html. Infragistics(). Combo(). ID("comboTarget"). Render() %>
Or
@(Html.Infragistics().Combo().ID("combo").Render())
I made a quick sample using Razor and I was unable to reproduce this behavior. I am attaching the sample to the thread. Please note I deleted the scripts folder so I could attach it to the forums.
Mike,
I'm using the Razor view engine, and I do use the MVC helper. What I meant in the earlier post is the script generated on the browser, so I used browser's developer tool to view the source.
Thanks for the sample. What's different is that you're doing this: @{Html.RenderPartial("ViewUserControl1");}
What I did on my screen is I have a <div> tag holder, and then do an AJAX call to get the partial view and append it to the <div> tag on success.
Can you try that ?
Thanks
Thank you for the update. Would you be able to provide a small of example of what you are doing there so I can take a look at how you are inserting the partial view?
Ok, so I have this html on my cshtml file:
<div id="tabs"> <ul> <li><a href="#General" tabindex="-1" onclick="getTabContent(1);">General</a></li> <li><a href="#Accounts" tabindex="-1" onclick="getTabContent(2);">Customer Accounts</a></li> <li><a href="#Items" tabindex="-1" onclick="getTabContent(3);">Items</a></li> <li><a href="#Groups" tabindex="-1" onclick="getTabContent(4);">Groups</a></li> </ul> <div id="General"> @Html.Partial("GeneralTabView", Model) </div> <div id="Accounts"> </div> <div id="Items"> </div> <div id="Groups"> </div> </div>
inside the getTabContent javascript method I have this which gets a partial view from the server, and appends it to the right div:
$.ajax({ type: "post", url: url, data: $('form').serialize(), success: function (response) { $(targetDiv).html(response); PrepLoadedTabs(targetDiv); }, error: function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(xhr.responseText); } });
When I go to the second, third, or fourth tab is when I'm getting the error. Inside the partial view for each tab I have the regular loader with infragistics grid. The grid has all the features on: paging, sorting, hiding, filtering, updating, resizing.
@(Html.Infragistics().Loader() .ScriptPath(Url.Content("~/Scripts/IG/")) .CssPath(Url.Content("~/Content/IG/")) .Render() )
Thank you for the update. I have done some further looking into this matter and have the following questions:
How are you building the url you use for the ajax post? What is the file type you use were you have the grid you are using as a partial, html, cshtml? Have you tried having the call to the loader just on the main page instead of all the partial views?
Sincerely, Mike P. Developer Support Engineer Infragistics, Inc. www.infragistics.com
I use the basic Url.Action to create the url, and the file is cshtml. I do have igLoader on the main page, but it does not seem to load the required igGrid widgets as there is no igGrid control the first time it loads.