<?xml version="1.0" encoding="UTF-8"?>
<!-- generator="wordpress/1.5.1-alpha" -->
<rss version="2.0" 
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
>

<channel>
	<title>JDev</title>
	<link>http://jdev.blogsome.com</link>
	<description>Latest code snippets</description>
	<pubDate>Wed, 23 Jul 2008 12:14:08 +0000</pubDate>
	<generator>http://wordpress.org/?v=1.5.1-alpha</generator>
	<language>en</language>

		<item>
		<title>JavaScript event delegation</title>
		<link>http://jdev.blogsome.com/2008/07/23/javascript-event-delegation/</link>
		<comments>http://jdev.blogsome.com/2008/07/23/javascript-event-delegation/#comments</comments>
		<pubDate>Wed, 23 Jul 2008 12:14:08 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>javascript</category>
		<guid>http://jdev.blogsome.com/2008/07/23/javascript-event-delegation/</guid>
		<description><![CDATA[	A good explanation of the JavaScript event delegation can found in this SitePoint article.
	&nbsp;
]]></description>
			<content:encoded><![CDATA[	<p>A good explanation of the JavaScript event delegation can found in <a href="http://www.sitepoint.com/blogs/2008/07/23/javascript-event-delegation-is-easier-than-you-think/" target="_self">this SitePoint article</a>.</p>
	<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/07/23/javascript-event-delegation/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Some CSS Rules</title>
		<link>http://jdev.blogsome.com/2008/06/30/some-css-rules-2/</link>
		<comments>http://jdev.blogsome.com/2008/06/30/some-css-rules-2/#comments</comments>
		<pubDate>Mon, 30 Jun 2008 17:41:29 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>css</category>
		<guid>http://jdev.blogsome.com/2008/06/30/some-css-rules-2/</guid>
		<description><![CDATA[	Adjusting the left property will have no effect on the matching elements unless those elements have their CSS position set to relative or absolute. The default CSS position for all block‑level elements is static.
	If you put an absolutely positioned box inside a relatively positioned box, it  moves with that box. It is absolutely relative! [...]]]></description>
			<content:encoded><![CDATA[	<p>Adjusting the <em>left </em>property will have no effect on the matching elements unless those elements have their CSS position set to <em>relative </em>or <em>absolute</em>. The default CSS position for all block‑level elements is <em>static</em>.</p>
	<p>If you put an absolutely positioned box inside a relatively positioned box, it  moves with that box. It is absolutely relative! </p>
	<p><a href="http://www.wpdfd.com/issues/78/absolutely_relative/" target="_self">http://www.wpdfd.com/issues/78/absolutely_relative/&nbsp;</a></p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/06/30/some-css-rules-2/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Prevent browser from jumping to top of the page</title>
		<link>http://jdev.blogsome.com/2008/06/25/prevent-browser-from-jumping-to-top-of-the-page/</link>
		<comments>http://jdev.blogsome.com/2008/06/25/prevent-browser-from-jumping-to-top-of-the-page/#comments</comments>
		<pubDate>Wed, 25 Jun 2008 13:36:29 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
	<category>.NET</category>
		<guid>http://jdev.blogsome.com/2008/06/25/prevent-browser-from-jumping-to-top-of-the-page/</guid>
		<description><![CDATA[	When you use href=&#8217;#&#8217; and provide a JavaScript function for the onclick event, the browser always jumps to the top of the page after executing the JavaScript function. The simple way to avoid the jumping effect is to include a &#8216;return false&#8217; statement after the call to the JavaScript function. Example:
	&lt;a href=&#8217;#&#8217; onclick=&#8217;fnClick(this); return false;&#8217;&gt;Do [...]]]></description>
			<content:encoded><![CDATA[	<p>When you use href=&#8217;#&#8217; and provide a JavaScript function for the onclick event, the browser always jumps to the top of the page after executing the JavaScript function. The simple way to avoid the jumping effect is to include a &#8216;return false&#8217; statement after the call to the JavaScript function. Example:</p>
	<p>&lt;a href=&#8217;#&#8217; onclick=&#8217;fnClick(this); return false;&#8217;&gt;Do something &lt;/a&gt;&nbsp;</p>
	<p>If you use .NET 1.1, you can set &quot;Smartnavigation=true&quot; in Document properties.</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/06/25/prevent-browser-from-jumping-to-top-of-the-page/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Rounded Corners In Forms With CSS and JavaScript</title>
		<link>http://jdev.blogsome.com/2008/06/13/rounded-corners-in-forms-with-css-and-javascript/</link>
		<comments>http://jdev.blogsome.com/2008/06/13/rounded-corners-in-forms-with-css-and-javascript/#comments</comments>
		<pubDate>Fri, 13 Jun 2008 13:39:47 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
		<guid>http://jdev.blogsome.com/2008/06/13/rounded-corners-in-forms-with-css-and-javascript/</guid>
		<description><![CDATA[	I used a NiftyCube javascript and css from Alessandro Fulciniti to create rounded corners for a form. The form used fieldset and legend tags to separate different sections of the form. I used &#8216;border-style:none&#8216; for the fieldset to get rid of the borders around it. The NiftyCube worked perfectly in Internet Exporer, however the form [...]]]></description>
			<content:encoded><![CDATA[	<p>I used a <a href="http://www.html.it/articoli/niftycube/index.html" target="_self">NiftyCube </a>javascript and css from Alessandro Fulciniti to create rounded corners for a form. The form used <strong>fieldset </strong>and <strong>legend </strong>tags to separate different sections of the form. I used &#8216;<em>border-style:none</em>&#8216; for the fieldset to get rid of the borders around it. The NiftyCube worked perfectly in Internet Exporer, however the form looked messy in Firefox. The rounded corners were below the legend. </p>
	<p>The solution was to get rid of the <strong>legend </strong>tag and use a <strong>div </strong>tag within the fieldset with the following style:</p>
	<p><em>&nbsp;&nbsp;&nbsp; display:block;<br />&nbsp;&nbsp;&nbsp; margin:10px;<br />&nbsp;&nbsp;&nbsp; font-weight:bold;&nbsp;</em></p>
	<p><img width="642" height="308" border="0" title="Form with rounded corners" alt="Form with rounded corners" src="http://jdev.blogsome.com/wp-admin/images/round.JPG" />&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/06/13/rounded-corners-in-forms-with-css-and-javascript/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Some Jquery Selector Examples</title>
		<link>http://jdev.blogsome.com/2008/05/01/some-jquery-selector-examples/</link>
		<comments>http://jdev.blogsome.com/2008/05/01/some-jquery-selector-examples/#comments</comments>
		<pubDate>Thu, 01 May 2008 17:12:17 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
	<category>jquery</category>
		<guid>http://jdev.blogsome.com/2008/05/01/some-jquery-selector-examples/</guid>
		<description><![CDATA[	$(&#8217;div.panel&#8217;)&nbsp;&nbsp;&nbsp; All divs with class=&ldquo;panel&rdquo;&nbsp;$(&#8217;p#intro&#8217;)&nbsp;&nbsp;&nbsp; The paragraph with id=&ldquo;intro&rdquo;&nbsp;$(&#8217;div#content a:visible&#8217;)&nbsp;&nbsp;&nbsp; All visible links inside the div with id=&ldquo;content&rdquo;&nbsp;$(&#8217;input[@name=email]&#8217;)&nbsp;&nbsp;&nbsp; All input fields with name=&ldquo;email&rdquo;$(&#8217;input[id*=plan]&#8217;)&nbsp;&nbsp;&nbsp; All input fields whose id contains string &#8216;plan&#8217;&nbsp;$(&quot;table.striped &gt; tr:odd&quot;) &nbsp;&nbsp;&nbsp;&nbsp; Odd rows in a table with a striped class&nbsp;$(&#8217;a[@href^=&quot;http://&quot;]&#8217;)&nbsp;&nbsp;&nbsp; All external links (links that start with http://)&nbsp;$(&#8217;p[a]&#8217;)&nbsp;&nbsp;&nbsp; All paragraphs that contain [...]]]></description>
			<content:encoded><![CDATA[	<p><em>$(&#8217;div.panel&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All divs with class=&ldquo;panel&rdquo;<br /><em>&nbsp;$(&#8217;p#intro&#8217;)</em><br />&nbsp;&nbsp;&nbsp; The paragraph with id=&ldquo;intro&rdquo;<br /><em>&nbsp;$(&#8217;div#content a:visible&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All visible links inside the div with id=&ldquo;content&rdquo;<br /><em>&nbsp;$(&#8217;input[@name=email]&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All input fields with name=&ldquo;email&rdquo;<br /><em>$(&#8217;input[id*=plan]&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All input fields whose id contains string &#8216;plan&#8217;<br /><em>&nbsp;</em><em>$(&quot;table.striped &gt; tr:odd&quot;)</em><br /> &nbsp;&nbsp;&nbsp;&nbsp; Odd rows in a table with a <em>striped </em>class<br /><em>&nbsp;$(&#8217;a[@href^=&quot;http://&quot;]&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All external links (links that start with http://)<br /><em>&nbsp;$(&#8217;p[a]&#8217;)</em><br />&nbsp;&nbsp;&nbsp; All paragraphs that contain one or more links&nbsp;&nbsp;&nbsp; &nbsp;<br />&nbsp;&nbsp; &nbsp;<br /><em>&nbsp;$(&quot;p:even&quot;);</em><br />&nbsp;&nbsp;&nbsp; All even &lt;p&gt; elements.<br /><em>&nbsp;$(&quot;tr:nth-child(1)&quot;);</em><br />&nbsp; The first row of each table.<br /><em>&nbsp;$(&quot;body &gt; div&quot;);</em><br />&nbsp;&nbsp; Direct &lt;div&gt; children of &lt;body&gt;.<br /><em>&nbsp;$(&quot;a[href$=pdf]&quot;);</em><br />&nbsp;&nbsp;&nbsp; Links to PDF files.<br /><em>&nbsp;$(&quot;body &gt; div:has(a)&quot;)</em><br />&nbsp;&nbsp; Direct &lt;div&gt; children of &lt;body&gt;-containing links.</p>
	<p>&nbsp;<em>$(&quot;td:empty)&quot;)</em><br />&nbsp;&nbsp;&nbsp; Empty table cells&nbsp;</p>
	<p>&nbsp;<br /><em>$(&rsquo;#plugins td.name&rsquo;).filter(&rsquo;:contains(ImageManager)&rsquo;)</em><br />&nbsp;&nbsp;&nbsp; In the &lt;div id=plugins&gt;, find &lt;td class=name&gt; which contains the text ImageManager<br />&nbsp;</p>
	<p><a href="http://simonwillison.net/2007/Aug/15/jquery/" target="_self">More</a> on Jquery.&nbsp;</p>
	<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/05/01/some-jquery-selector-examples/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Text Slideshow with Prototype</title>
		<link>http://jdev.blogsome.com/2008/04/17/text-slideshow-with-prototype/</link>
		<comments>http://jdev.blogsome.com/2008/04/17/text-slideshow-with-prototype/#comments</comments>
		<pubDate>Thu, 17 Apr 2008 19:05:32 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
	<category>prototype</category>
		<guid>http://jdev.blogsome.com/2008/04/17/text-slideshow-with-prototype/</guid>
		<description><![CDATA[	Here is how you could do a text-based slideshow in Prototype/Script.aculo.us:
	We declare a JavaScript array:
	var students = new Array (&quot;Audrey&quot;, &quot;John&quot;, &quot;Mark&quot;, &quot;Benny&quot;, &quot;Peter&quot;);&nbsp;&nbsp;
	We need a div with an id of &#8216;panel&#8217; that will contain the slideshow. 
	document.observe(&#8217;dom:loaded&#8217; , function() {&nbsp;&nbsp;&nbsp;&nbsp; i=0;&nbsp;&nbsp;&nbsp;&nbsp; new PeriodicalExecuter(cycle, 5&nbsp; //5-second interval&nbsp;&nbsp;&nbsp;&nbsp; );&nbsp;});&nbsp;function cycle(){&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;  &nbsp;&nbsp;&nbsp; [...]]]></description>
			<content:encoded><![CDATA[	<p>Here is how you could do a text-based slideshow in Prototype/Script.aculo.us:</p>
	<p>We declare a JavaScript array:</p>
	<p>var students = new Array (&quot;Audrey&quot;, &quot;John&quot;, &quot;Mark&quot;, &quot;Benny&quot;, &quot;Peter&quot;);&nbsp;&nbsp;</p>
	<p>We need a div with an id of &#8216;panel&#8217; that will contain the slideshow. </p>
	<p><em>document.observe(&#8217;dom:loaded&#8217; , function() {<br />&nbsp;&nbsp;&nbsp;&nbsp; i=0;<br />&nbsp;&nbsp;&nbsp;&nbsp; new PeriodicalExecuter(cycle, 5&nbsp; //5-second interval<br />&nbsp;&nbsp;&nbsp;&nbsp; );<br />&nbsp;});<br />&nbsp;<br />function cycle(){&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;  &nbsp;&nbsp;&nbsp;  <br />&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; $(&#8217;panel&#8217; ).visualEffect&nbsp; (&#8217;BlindUp&#8217;,<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; { duration: 1,&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; fps: 50,&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; afterFinish: function() {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; $(&#8217;panel&#8217;).update(students[i]); //the div is still invisible at this point<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(&#8217;panel&#8217; ).visualEffect&nbsp; (&#8217;BlindDown&#8217;,<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; { duration: 1,<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fps: 50,<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; queue:&#8217;end&#8217;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; }<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; );&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });<br />&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; i++;<br />&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; if(i==students.length)<br />&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; i=0; //restart the slideshow<br />&nbsp;}</em></p>
	<p>&nbsp;</p>
	<p>This code will display all the elements of the array, one by one, automatically at a 5-second&nbsp; interval.</p>

</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/04/17/text-slideshow-with-prototype/feed/</wfw:commentRss>
	</item>
		<item>
		<title>How to use default options in Prototype</title>
		<link>http://jdev.blogsome.com/2008/04/10/how-to-use-default-options-in-prototype/</link>
		<comments>http://jdev.blogsome.com/2008/04/10/how-to-use-default-options-in-prototype/#comments</comments>
		<pubDate>Thu, 10 Apr 2008 20:37:34 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
	<category>prototype</category>
		<guid>http://jdev.blogsome.com/2008/04/10/how-to-use-default-options-in-prototype/</guid>
		<description><![CDATA[	An excellent explanation can be found here.

]]></description>
			<content:encoded><![CDATA[	<p>An excellent explanation can be found <a href="http://railstips.org/2006/12/15/default-options-for-javascript-classes-using-prototype" target="_self">here</a>.
</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/04/10/how-to-use-default-options-in-prototype/feed/</wfw:commentRss>
	</item>
		<item>
		<title>CHM File Problem and Solution</title>
		<link>http://jdev.blogsome.com/2008/03/26/chm-file-problem-and-solution/</link>
		<comments>http://jdev.blogsome.com/2008/03/26/chm-file-problem-and-solution/#comments</comments>
		<pubDate>Wed, 26 Mar 2008 19:23:58 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
		<guid>http://jdev.blogsome.com/2008/03/26/chm-file-problem-and-solution/</guid>
		<description><![CDATA[	An interesting note on a problem with opening chm files and a simple solution:
	http://www.nik.com.au/archives/2005/04/06/chm-help-files-error-the-page-cannot-be-displayed/
	&nbsp;
]]></description>
			<content:encoded><![CDATA[	<p>An interesting note on a problem with opening chm files and a simple solution:</p>
	<p><a href="http://www.nik.com.au/archives/2005/04/06/chm-help-files-error-the-page-cannot-be-displayed/" target="_self">http://www.nik.com.au/archives/2005/04/06/chm-help-files-error-the-page-cannot-be-displayed/</a></p>
	<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/03/26/chm-file-problem-and-solution/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Create Striped Lists in Prototype and Jquery</title>
		<link>http://jdev.blogsome.com/2008/02/26/create-striped-lists-in-prototype-and-jquery/</link>
		<comments>http://jdev.blogsome.com/2008/02/26/create-striped-lists-in-prototype-and-jquery/#comments</comments>
		<pubDate>Tue, 26 Feb 2008 15:47:49 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>javascript</category>
	<category>prototype</category>
	<category>jquery</category>
		<guid>http://jdev.blogsome.com/2008/02/26/create-striped-lists-in-prototype-and-jquery/</guid>
		<description><![CDATA[	We are going to show how to create lists with alternate colors in Prototype and Jquery.
	Let&#8217;s say you have an HTML list with with the &#8216;result&#8216; id, and you want it to have alternating colors.&nbsp;
	First, create a css class that displays a list item in a different color:
	li.alternate { color:green;}&nbsp;
	In Prototype, you use the following [...]]]></description>
			<content:encoded><![CDATA[	<p>We are going to show how to create lists with alternate colors in <a target="_self" href="http://www.prototypejs.org/">Prototype </a>and <a target="_self" href="http://jquery.com/">Jquery</a>.</p>
	<p>Let&#8217;s say you have an HTML list with with the &#8216;<em>result</em>&#8216; id, and you want it to have alternating colors.&nbsp;</p>
	<p>First, create a css class that displays a list item in a different color:</p>
	<p>li.alternate { color:green;}&nbsp;</p>
	<p>In Prototype, you use the following syntax:</p>
	<p><em>document.observe(&#8217;dom:loaded&#8217; , function(){<br />&nbsp;&nbsp;&nbsp; $$(&#8217;#result li:nth-child(2n)&#8217; ).invoke(&#8217;addClassName&#8217; , &#8216;alternate&#8217; );<br />});</em> </p>
	<p>Jquery uses the following syntax:</p>
	<p><em>$(document).ready(function(){&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp; $(&quot;#result li:nth-child(even)&quot;).addClass(&quot;alternate&quot;);&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />}); </em></p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/02/26/create-striped-lists-in-prototype-and-jquery/feed/</wfw:commentRss>
	</item>
		<item>
		<title>Creating striped lists/tables  in JSTL</title>
		<link>http://jdev.blogsome.com/2008/02/21/creating-stiped-liststables-in-jstl-2/</link>
		<comments>http://jdev.blogsome.com/2008/02/21/creating-stiped-liststables-in-jstl-2/#comments</comments>
		<pubDate>Thu, 21 Feb 2008 20:56:54 +0000</pubDate>
		<dc:creator>Administrator</dc:creator>
		
	<category>Code</category>
	<category>jstl</category>
		<guid>http://jdev.blogsome.com/2008/02/21/creating-stiped-liststables-in-jstl-2/</guid>
		<description><![CDATA[	The JSTL iterator exposes&nbsp; a varStatus variable that holds the loop status. With this information at hand, we can constuct the following JSTL loop to create a list with alternate colors.
	&lt;ul&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;c:forEach var=&quot;row&quot; items=&quot;${queryResults.rowsByIndex}&quot; varStatus=&#8217;vs&#8217;&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;c:choose&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;c:when test= &quot;${vs.index % 2 == 0}&quot;&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; [...]]]></description>
			<content:encoded><![CDATA[	<p>The JSTL iterator exposes&nbsp; a <em>varStatus </em>variable that holds the loop status. With this information at hand, we can constuct the following JSTL loop to create a list with alternate colors.</p>
	<p><em>&lt;ul&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;c:forEach var=&quot;row&quot; items=&quot;${queryResults.<font color="#3300ff">rowsByIndex</font>}&quot; <font color="#666600">varStatus</font>=&#8217;vs&#8217;&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;c:choose&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;c:when test= &quot;${vs.<font color="#3300ff">index </font>% 2 == 0}&quot;&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;li class=&#8217;even&#8217;&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;/c:when&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;c:otherwise&gt;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;li&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &lt;/c:otherwise&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &lt;/c:choose&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;c:out value=&quot;${row[0]}&quot;/&gt;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;  <br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&lt;/li&gt;<br />&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;/c:forEach&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp; &lt;/ul&gt; </em></p>
	<p>The test condition checks whether the <em>index </em>property <em>of varStatus</em> variable is even or odd, and assigns a css class named &#8216;even&#8217; to each even item.</p>
	<p>You can easily substitute table rows for li elements in this example.</p>
]]></content:encoded>
			<wfw:commentRss>http://jdev.blogsome.com/2008/02/21/creating-stiped-liststables-in-jstl-2/feed/</wfw:commentRss>
	</item>
	</channel>
</rss>
