<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
	<title>jQuery Grid Plugin - jqGrid - Topic: Error during JQGrid load</title>
	<link>http://www.trirand.com/blog/?page_id=393/help/error-during-jqgrid-load</link>
	<description><![CDATA[Grid plugin]]></description>
	<generator>Simple:Press Version 5.7.5.3</generator>
	<atom:link href="http://www.trirand.com/blog/?page_id=393/help/error-during-jqgrid-load/rss" rel="self" type="application/rss+xml" />
        <item>
        	<title>lkritchey on Error during JQGrid load</title>
        	<link>http://www.trirand.com/blog/?page_id=393/help/error-during-jqgrid-load#p20286</link>
        	<category>Help</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/help/error-during-jqgrid-load#p20286</guid>
        	        	<description><![CDATA[<p>I am creating a jqgrid that appears in a jquery modal window.&#160; It loads the grid successfully, but while loading the grid, it comes up with the error: Invalid argument.&#160; It pauses at a line in the jquery-1.4.2.min.js file ("{e.username?x.open(n,e.url,e.async,e.username,e.password):x.open(n,e.url,e.async);").</p>
<p>To create the grid, I call a webservice, which returns an object.&#160; I serialize the object, and parse it once it is returned to the webpage.&#160; Below is my code to set up the grid:</p>
<p style="padding-left: 30px;">ItemOverview.prototype.itemGridView = function()&#160; {</p>
<p style="padding-left: 60px;">$("itemGridView").jqGrid({</p>
<p style="padding-left: 60px;">mytype: &#39;POST&#39;,</p>
<p style="padding-left: 60px;">datatype: this.GetData(),</p>
<p style="padding-left: 60px;">jsonReader: {</p>
<p style="padding-left: 90px;">root: "root",</p>
<p style="padding-left: 90px;">repeatitems: false,</p>
<p style="padding-left: 90px;">id: "itemKey",</p>
<p style="padding-left: 90px;">cell: ""</p>
<p style="padding-left: 60px;">},</p>
<p style="padding-left: 60px;">colNames: [&#39;Item Key&#39;, &#39;Item&#39;, &#39;CAGE&#39;, &#39;Nomen&#39;],</p>
<p style="padding-left: 60px;">colModel: [</p>
<p style="padding-left: 90px;">{name: &#39;itemKey&#39;, hidden: true, sortable: false},</p>
<p style="padding-left: 90px;">{name: &#39;item&#39;, sortable: true},</p>
<p style="padding-left: 90px;">{name: &#39;nomenclature&#39;, sortable: true}</p>
<p style="padding-left: 90px;">],</p>
<p style="padding-left: 90px;">pager: &#39;#pageNavigation&#39;,</p>
<p style="padding-left: 90px;">rowNum: 500,</p>
<p style="padding-left: 90px;">&#8230;moreoptions&#8230;</p>
<p style="padding-left: 60px;">});</p>
<p style="padding-left: 30px;">}</p>
<p>Below is the code for GetData():</p>
<p style="PADDING-LEFT: 30px">ItemOverview.prototype.GetData = function() {</p>
<p style="PADDING-LEFT: 30px">&#160;</p>
<p style="PADDING-LEFT: 30px">data = this.txtItemNomen.val();</p>
<p style="PADDING-LEFT: 30px">//Web service function&#160;- common function for all web pages</p>
<p style="PADDING-LEFT: 30px">var ws = new WebService();</p>
<p style="PADDING-LEFT: 30px">ws.RunFunction("GetItemJsonReader", data, $.proxy(this.GetItemsInList, this), $.proxy(this.Unsuccessful, this));</p>
<p style="PADDING-LEFT: 30px">}</p>
<p style="PADDING-LEFT: 30px">&#160;</p>
<p>This code returns a JSON object with the following data (note that I have real data in the actual code with more than 2 records):</p>
<p style="PADDING-LEFT: 30px">&#160;{"page:":"x","total":"x","records":x,"root":[{"col1":x,"col2":x,"col3":x},{"col1":y,"col2":y,"col3":y}]}</p>
<p style="PADDING-LEFT: 30px">&#160;</p>
<p>Below is the success function (GetItemsInList)</p>
<p style="padding-left: 30px;">ItemOverview.prototype.GetItemsInList = function(jObject) {</p>
<p style="padding-left: 60px;">var theGrid=jQuery("#itemGridView")[0];</p>
<p style="padding-left: 60px;">theGrid.addJSONData(jObject);</p>
<p style="padding-left: 30px;">}</p>
</p>
<p style="PADDING-LEFT: 30px">&#160;</p>
<p>Where GetItemJsonReader() is the webservice function name, this.GetItemsInList is the success function and this.Unsuccessful is the failed option</p>
<p>this.GetItemsInList code below:</p>
<p style="PADDING-LEFT: 30px">&#160;</p>
<p style="padding-left: 30px;">&#160;ItemOverview.prototype.GetItemsInList = function(jObject) {</p>
<p style="padding-left: 30px;">var theGrid=jQuery("#itemGridView")[0];</p>
<p style="padding-left: 30px;">theGrid.addJSONData(jObject);</p>
<p style="padding-left: 30px;">}</p>
<p style="padding-left: 30px;">&#160;</p>
<p>Below is the code to show the table in a jQuery modal window:</p>
</p>
<p style="padding-left: 30px;">ItemOverview.prototype.Search_Click = function() {</p>
<p style="padding-left: 30px;">&#160;</p>
<p style="padding-left: 60px;">$("#itemGridView").dialog(</p>
<p style="padding-left: 60px;">{</p>
<p style="padding-left: 90px;">modal: true,</p>
<p style="padding-left: 90px;">close: $.proxy(this.DialogClosed, this),</p>
<p style="padding-left: 90px;">closeText: "hide",</p>
<p style="padding-left: 90px;">&#8230;More Options&#8230;</p>
<p style="padding-left: 60px;">})</p>
<p style="padding-left: 60px;">&#160;</p>
<p style="padding-left: 60px;">this.itemGridView();</p>
<p style="padding-left: 60px;">$("#itemGridView").show();</p>
<p style="padding-left: 30px;">}</p>
<p style="padding-left: 30px;">&#160;</p>
<p>Please note again that the data does load successfully &#8211; it just comes up with the Invalid argument error while the data is loading.&#160; Any help is very much appreciated&#8230;if any other code or information should be posted, please let me know.</p>
</p>
<p>Thanks,</p>
<p>Laura</p>
]]></description>
        	        	<pubDate>Wed, 13 Oct 2010 18:10:59 +0300</pubDate>
        </item>
</channel>
</rss>