<?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: Table To Grid Bug</title>
	<link>http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug</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/bugs/table-to-grid-bug/rss" rel="self" type="application/rss+xml" />
        <item>
        	<title>sorin_postelnicu on Table To Grid Bug</title>
        	<link>http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p27778</link>
        	<category>Bugs</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p27778</guid>
        	        	<description><![CDATA[<p>I encountered a similar problem (TypeError: colModel[rowPos] is undefined <a href="http://myapp/js/jquery.jqGrid.src.js" rel="nofollow" target="_blank">http://myapp/js/jquery.jqGrid.src.js</a> Line 12202) and I made the following changes to the function tableToGrid in order to make it easier to debug (and also faster!):</p>
</p>
<p>function tableToGrid(selector, options) {<br />jQuery(selector).each(function() {<br />&#160;&#160; &#160;if(this.grid) {return;} //Added by Tony Tomov<br />&#160;&#160; &#160;// This is a small "hack" to make the width of the jqGrid 100%<br />&#160;&#160; <strong>var thisTable = jQuery(this);</strong><br />&#160;&#160; <strong>thisTable</strong>.width("99%");<br />&#160;&#160; &#160;var w = <strong>thisTable</strong>.width();</p>
<p>&#160;&#160; &#160;// Text whether we have single or multi select<br />&#160;&#160; &#160;var inputCheckbox = jQuery(&#39;tr td:first-child input[type=checkbox]:first&#39;, <strong>thisTable</strong>);<br />&#160;&#160; &#160;var inputRadio = jQuery(&#39;tr td:first-child input[type=radio]:first&#39;, <strong>thisTable</strong>);<br />&#160;&#160; &#160;var selectMultiple = inputCheckbox.length &#62; 0;<br />&#160;&#160; &#160;var selectSingle = !selectMultiple &#38;&#38; inputRadio.length &#62; 0;<br />&#160;&#160; &#160;var selectable = selectMultiple &#124;&#124; selectSingle;<br />&#160;&#160; &#160;//var inputName = inputCheckbox.attr("name") &#124;&#124; inputRadio.attr("name");</p>
<p>&#160;&#160; &#160;// Build up the columnModel and the data<br />&#160;&#160; &#160;var colModel = [];<br />&#160;&#160; &#160;var colNames = [];<br />&#160;&#160; &#160;jQuery(&#39;th&#39;, <strong>thisTable</strong>).each(function() {<br />&#160;&#160;&#160;&#160;&#160; <strong>var thisTh = jQuery(this);</strong><br />&#160;&#160;&#160;&#160;&#160; if (colModel.length === 0 &#38;&#38; selectable) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;colModel.push({<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;name: &#39;__selection__&#39;,<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;index: &#39;__selection__&#39;,<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;width: 0,<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;hidden: true<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;});<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;colNames.push(&#39;__selection__&#39;);<br />&#160;&#160; &#160;&#160;&#160; &#160;} else {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;colModel.push({<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;name: <strong>thisTh</strong>.attr("id") &#124;&#124; jQuery.trim(jQuery.jgrid.stripHtml(<strong>thisTh</strong>.html())).split(&#39; &#39;).join(&#39;_&#39;),<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;index: <strong>thisTh</strong>.attr("id") &#124;&#124; jQuery.trim(jQuery.jgrid.stripHtml(<strong>thisTh</strong>.html())).split(&#39; &#39;).join(&#39;_&#39;),<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;width: <strong>thisTh</strong>.width() &#124;&#124; 150<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;});<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;colNames.push(<strong>thisTh</strong>.html());<br />&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160; &#160;});<br />&#160;&#160; &#160;var data = [];<br />&#160;&#160; &#160;var rowIds = [];<br />&#160;&#160; &#160;var rowChecked = [];<br />&#160;&#160; &#160;jQuery(&#39;tbody &#62; tr&#39;, <strong>thisTable</strong>).each(function() {<br />&#160;&#160;&#160;&#160;&#160; <strong>var thisTr = jQuery(this);</strong><br />&#160;&#160;&#160;&#160;&#160; var row = {};<br />&#160;&#160; &#160;&#160;&#160; &#160;var rowPos = 0;<br />&#160;&#160; &#160;&#160;&#160; &#160;jQuery(&#39;td&#39;, <strong>thisTr</strong>).each(function() {<br />&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; <strong>var thisTd = jQuery(this);</strong><br />&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; if (rowPos === 0 &#38;&#38; selectable) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;var input = jQuery(&#39;input&#39;, <strong>thisTd</strong>);<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;var rowId = input.attr("value");<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;rowIds.push(rowId &#124;&#124; data.length);<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;if (input.is(":checked")) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;rowChecked.push(rowId);<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;row[colModel[rowPos].name] = input.attr("value");<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;} else {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;row[colModel[rowPos].name] = <strong>thisTd</strong>.html();<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;rowPos++;<br />&#160;&#160; &#160;&#160;&#160; &#160;});<br />&#160;&#160; &#160;&#160;&#160; &#160;if(rowPos &#62;0) { data.push(row); }<br />&#160;&#160; &#160;});</p>
<p>&#160;&#160; &#160;// Clear the original HTML table<br />&#160;&#160; <strong>thisTable</strong>.empty();</p>
<p>&#160;&#160; &#160;// Mark it as jqGrid<br />&#160;&#160; <strong>thisTable</strong>.addClass("scroll");</p>
<p>&#160;&#160; <strong>thisTable</strong>.jqGrid(jQuery.extend({<br />&#160;&#160; &#160;&#160;&#160; &#160;datatype: "local",<br />&#160;&#160; &#160;&#160;&#160; &#160;width: w,<br />&#160;&#160; &#160;&#160;&#160; &#160;colNames: colNames,<br />&#160;&#160; &#160;&#160;&#160; &#160;colModel: colModel,<br />&#160;&#160; &#160;&#160;&#160; &#160;multiselect: selectMultiple<br />&#160;&#160; &#160;&#160;&#160; &#160;//inputName: inputName,<br />&#160;&#160; &#160;&#160;&#160; &#160;//inputValueCol: imputName != null ? "__selection__" : null<br />&#160;&#160; &#160;}, options &#124;&#124; {}));</p>
<p>&#160;&#160; &#160;// Add data<br />&#160;&#160; &#160;var a;<br />&#160;&#160; &#160;for (a = 0; a &#60; data.length; a++) {<br />&#160;&#160; &#160;&#160;&#160; &#160;var id = null;<br />&#160;&#160; &#160;&#160;&#160; &#160;if (rowIds.length &#62; 0) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;id = rowIds[a];<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;if (id &#38;&#38; id.replace) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;// We have to do this since the value of a checkbox<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;// or radio button can be anything <br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;id = encodeURIComponent(id).replace(/[.-%]/g, "_");<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160; &#160;&#160;&#160; &#160;if (id === null) {<br />&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;id = a + 1;<br />&#160;&#160; &#160;&#160;&#160; &#160;}<br />&#160;&#160;&#160;&#160;&#160; <strong>thisTable</strong>.jqGrid("addRowData",id, data[a]);<br />&#160;&#160; &#160;}</p>
<p>&#160;&#160; &#160;// Set the selection<br />&#160;&#160; &#160;for (a = 0; a &#60; rowChecked.length; a++) {<br />&#160;&#160;&#160;&#160;&#160; <strong>thisTable</strong>.jqGrid("setSelection",rowChecked[a]);<br />&#160;&#160; &#160;}<br />});<br />};</p>
</p>
<p>Maybe you can include these improvements into your next jqgrid release&#8230;</p>
<p>Thanks!</p>
<p>Sorin</p>
]]></description>
        	        	<pubDate>Thu, 22 Nov 2012 19:24:19 +0200</pubDate>
        </item>
        <item>
        	<title>tony on Table To Grid Bug</title>
        	<link>http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p9166</link>
        	<category>Bugs</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p9166</guid>
        	        	<description><![CDATA[<p>Hello,</p>
<p>Thanks. Fixed.</p>
<p>Best Regards</p>
<p>Tony</p>
]]></description>
        	        	<pubDate>Tue, 01 Sep 2009 03:09:11 +0300</pubDate>
        </item>
        <item>
        	<title>sstodola on Table To Grid Bug</title>
        	<link>http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p9152</link>
        	<category>Bugs</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/bugs/table-to-grid-bug#p9152</guid>
        	        	<description><![CDATA[<p>When using table to grid I noticed that I always get a blank row as the first row in the table. Even when running the examples this would happen to me. I changed the following to check to see if the row has data before adding it to the data. I removed the bold line from the top block and replaced it with the 3 bold lines in the bottom block. This fixed the issue for me.</p>
</p>
<p><input type='button' class='sfcodeselect' name='sfselectit9556' value='Select Code' data-codeid='sfcode9556' /></p>
<div class='sfcode' id='sfcode9556'>&#160;&#160;&#160; $(&#39;tbody &#62; tr&#39;, $(this)).each(function() {<br />&#160;&#160;&#160; &#160;&#160;&#160; var row = {};<br />&#160;&#160;&#160; &#160;&#160;&#160; var rowPos = 0;<br /><strong>&#160;&#160;&#160; &#160;&#160;&#160; data.push(row);</strong><br />&#160;&#160;&#160; &#160;&#160;&#160; $(&#39;td&#39;, $(this)).each(function() {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; if (rowPos == 0 &#38;&#38; selectable) {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; var input = $(&#39;input&#39;, $(this));<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; var rowId = input.attr("value");<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowIds.push(rowId &#124;&#124; data.length);<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; if (input.attr("checked")) {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowChecked.push(rowId);<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; }<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; row[colModel[rowPos].name] = input.attr("value");<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; } else {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; row[colModel[rowPos].name] = $(this).html();<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; }<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowPos++;<br />&#160;&#160;&#160; &#160;&#160;&#160; });<br />&#160;&#160;&#160; });</div>
<p><input type='button' class='sfcodeselect' name='sfselectit9544' value='Select Code' data-codeid='sfcode9544' /></p>
<div class='sfcode' id='sfcode9544'>&#160;&#160;&#160; $(&#39;tbody &#62; tr&#39;, $(this)).each(function() {<br />&#160;&#160;&#160; &#160;&#160;&#160; var row = {};<br />&#160;&#160;&#160; &#160;&#160;&#160; var rowPos = 0;<br />&#160;&#160;&#160; &#160;&#160;&#160; $(&#39;td&#39;, $(this)).each(function() {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; if (rowPos == 0 &#38;&#38; selectable) {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; var input = $(&#39;input&#39;, $(this));<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; var rowId = input.attr("value");<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowIds.push(rowId &#124;&#124; data.length);<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; if (input.attr("checked")) {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowChecked.push(rowId);<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; }<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; row[colModel[rowPos].name] = input.attr("value");<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; } else {<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; row[colModel[rowPos].name] = $(this).html();<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; }<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; rowPos++;<br />&#160;&#160;&#160; &#160;&#160;&#160; });<br />&#160;&#160;&#160; &#160;&#160;&#160; <strong>if(rowPos &#62; 0){<br />&#160;&#160;&#160; &#160;&#160;&#160; &#160;&#160;&#160; data.push(row);<br />&#160;&#160;&#160; &#160;&#160;&#160; }</strong><br />&#160;&#160;&#160; });</div>
]]></description>
        	        	<pubDate>Mon, 31 Aug 2009 14:31:57 +0300</pubDate>
        </item>
</channel>
</rss>