<?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: gridComplete </title>
	<link>http://www.trirand.com/blog/?page_id=393/help/gridcomplete</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/gridcomplete/rss" rel="self" type="application/rss+xml" />
        <item>
        	<title>tony on gridComplete </title>
        	<link>http://www.trirand.com/blog/?page_id=393/help/gridcomplete#p17100</link>
        	<category>Help</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/help/gridcomplete#p17100</guid>
        	        	<description><![CDATA[<p>Hello,</p>
<p>Try this</p>
<p>gridComplete: function() {</p>
<p>$(&#39;.jqgrow&#39;).mouseover(function(e) {</p>
</p>
<p>var rowId = $(this).attr(&#39;id&#39;);</p>
<p>alert("You rolled over " + rowId.Id);</p>
<p>});</p>
<p>}</p>
]]></description>
        	        	<pubDate>Wed, 12 May 2010 13:17:14 +0300</pubDate>
        </item>
        <item>
        	<title>coden4fun on gridComplete </title>
        	<link>http://www.trirand.com/blog/?page_id=393/help/gridcomplete#p17041</link>
        	<category>Help</category>
        	<guid isPermaLink="true">http://www.trirand.com/blog/?page_id=393/help/gridcomplete#p17041</guid>
        	        	<description><![CDATA[<p>Hi, I&#39;m trying to do a mouseover for the jquery and when the mouse is hovered over a certain row I can get the id from that row and populate information and display an image.&#160; However, I have been having the hardest time trying to do so.</p>
</p>
<p>Here is what I want to happen</p>
</p>
<p>Just like in the onSelectRow where I obtain the data using the following code</p>
<p>var ret = $(&#39;#list&#39;).jqGrid(&#39;getRowData&#39;, Id);</p>
</p>
<p>I want to use when I do a mouseover.&#160; However, I don&#39;t see a way of doing this.&#160; I tried the following under gridComplete</p>
</p>
<p>gridComplete: function() {&#39;.jqgrow&#39;).mouseover(function(e) {</p>
</p>
<p>var rowId = $(&#39;.jqgrow&#39;).parent(tr:first).attr(&#39;id&#39;);</p>
<p>alert("You rolled over " + rowId.Id);</p>
<p>});</p>
<p>}</p>
</p>
<p>but it only gave me the ide number of the row of that table inside the jqgrid and I need the data from that row instead.</p>
</p>
<p>For instance, in my data I have Id, FirstName, LastName, FullName, Title, SortID</p>
</p>
<p>I would like to present a picture on the right side of my HTML page when hovered over certain rows by passing the Id to the HTML page, and querying through an array.&#160; If I can some how get the actual Id that&#39;s within my dataset I can do the rest.</p>
</p>
<p>Any help would be lovely.</p>
</p>
<p>I have given the entire code of my jqGrid at the bottom for reference.</p>
</p>
<p><span style="font-size: x-small;">jQuery(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">"#list"</span></span><span style="font-size: x-small;">).jqGrid({</span></p>
<p>url:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;/Providers/DynamicGridData/&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>datatype:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;json&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>mtype:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;GET&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>colNames: [</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Id&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;LastName&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FirstName&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FullName&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Title&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Url&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;SortId&#39;</span></span><span style="font-size: x-small;">],</span></p>
<p>colModel: [</p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Id&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Id&#39;</span></span><span style="font-size: x-small;">, width: 30, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;">, hidden: </span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;"> },</span></p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;LastName&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;LastName&#39;</span></span><span style="font-size: x-small;">, width: 30, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;">, hidden: </span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;"> },</span></p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FirstName&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FirstName&#39;</span></span><span style="font-size: x-small;">, width: 30, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;">, hidden: </span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;"> },</span></p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FullName&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;FullName&#39;</span></span><span style="font-size: x-small;">, width: 100, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;"> },</p>
<p></span></p>
<p><span style="color: #008000; font-size: x-small;"><span style="color: #008000; font-size: x-small;">/*{ name: &#39;FirstName&#39;, index: &#39;FirstName&#39;, width: 100, align: &#39;left&#39; },*/</span></span></p>
<p><span style="font-size: x-small;"></span></p>
<p>{name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Title&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Title&#39;</span></span><span style="font-size: x-small;">, width: 200, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;"> },</span></p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Url&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Url&#39;</span></span><span style="font-size: x-small;">, width: 30, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;">, hidden: </span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;"> },</span></p>
<p>{ name:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;SortId&#39;</span></span><span style="font-size: x-small;">, index: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;SortId&#39;</span></span><span style="font-size: x-small;">, width: 30, align: </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;left&#39;</span></span><span style="font-size: x-small;">, hidden: </span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;">}],</span></p>
<p>pager: jQuery(</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;#pager&#39;</span></span><span style="font-size: x-small;">),</span></p>
<p>rowNum: 10,</p>
<p>rowList: [5, 10, 20, 50],</p>
<p>sortname:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Id&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>scrollOffset: 0,</p>
<p>width:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;425&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>altRows:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;true&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>altClass:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;ui-priority-secondary&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>autowidth:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;true&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>height:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;300&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>altRows:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;true&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>altClass:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;ui-priority-secondary&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>viewrecords:</p>
</p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">true</span></span><span style="font-size: x-small;">,</span></p>
<p>caption:</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;Clinical Providers&#39;</span></span><span style="font-size: x-small;">,</span></p>
<p>onSelectRow:</p>
</p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">function</span></span><span style="font-size: x-small;">() {</p>
<p></span></p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">var</span></span><span style="font-size: x-small;"> Id = $(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">"#list"</span></span><span style="font-size: x-small;">).jqGrid(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;getGridParam&#39;</span></span><span style="font-size: x-small;">, </span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;selrow&#39;</span></span><span style="font-size: x-small;">);</p>
<p></span></p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">if</span></span><span style="font-size: x-small;"> (Id) {</p>
<p></span></p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">var</span></span><span style="font-size: x-small;"> ret = $(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;#list&#39;</span></span><span style="font-size: x-small;">).jqGrid(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;getRowData&#39;</span></span><span style="font-size: x-small;">, Id);</p>
<p></span></p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">var</span></span><span style="font-size: x-small;"> url = ret.Url;</span></p>
<p>url.split(</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39; &#39;</span></span><span style="font-size: x-small;">).join(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;&#39;</span></span><span style="font-size: x-small;">);</p>
<p></span></p>
<p><span style="color: #008000; font-size: x-small;"><span style="color: #008000; font-size: x-small;">//alert("id=" + ret.Id + "FullName=" + ret.FullName + "...");</span></span></p>
<p><span style="font-size: x-small;"></span></p>
<p>window.location =</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">"/"</span></span><span style="font-size: x-small;"> + url;</span></p>
<p>}</p>
</p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">else</span></span><span style="font-size: x-small;"> { alert(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">"Please select a row"</span></span><span style="font-size: x-small;">); }</span></p>
<p>},</p>
<p>gridComplete:</p>
</p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">function</span></span><span style="font-size: x-small;">() {</span></p>
<p>$(</p>
</p>
<p><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;.jqgrow&#39;</span></span><span style="font-size: x-small;">).mouseover(</span><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">function</span></span><span style="font-size: x-small;">(e) {</p>
<p></span></p>
<p><span style="color: #0000ff; font-size: x-small;"><span style="color: #0000ff; font-size: x-small;">var</span></span><span style="font-size: x-small;"> rowId = $(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">&#39;.jqgrow&#39;</span></span><span style="font-size: x-small;">).</span></p>
<p><span style="font-size: x-small;">alert(</span><span style="color: #a31515; font-size: x-small;"><span style="color: #a31515; font-size: x-small;">"You rolled over "</span></span><span style="font-size: x-small;"> + rowId.Id);</span></p>
<p>});</p>
<p>}</p>
<p>});</p></p>
]]></description>
        	        	<pubDate>Mon, 10 May 2010 23:16:31 +0300</pubDate>
        </item>
</channel>
</rss>