<?xml version="1.0" encoding="UTF-8"?>
<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/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>RubberNeck Designs &#187; AJAX</title>
	<atom:link href="http://www.rubberneckdesigns.com/category/ajax-web-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.rubberneckdesigns.com</link>
	<description>Web Developer Notes &#38; Sharing</description>
	<lastBuildDate>Sat, 10 Apr 2010 15:22:42 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.6</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Screen shot of the up and comming CPI Data Panel</title>
		<link>http://www.rubberneckdesigns.com/ajax-web-design/screen-shot-of-the-up-and-comming-cpi-data-panel/</link>
		<comments>http://www.rubberneckdesigns.com/ajax-web-design/screen-shot-of-the-up-and-comming-cpi-data-panel/#comments</comments>
		<pubDate>Fri, 03 Jul 2009 14:24:22 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[AJAX]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://rubberneckdesigns.com/?p=147</guid>
		<description><![CDATA[I havn&#8217;t posted in few weeks because I have been very busy with several projects. One of the projects I am particularly excited about the CPI panel. The Cpi panel is new &#8220;back end&#8221; for LoveFineArt.com. IT used to be that each and every product would take about 20 minuets to enter. With this new [...]]]></description>
			<content:encoded><![CDATA[<p>I havn&#8217;t posted in few weeks because I have been very busy with several projects. One of the projects I am particularly excited about the CPI panel. The Cpi panel is new &#8220;back end&#8221; for LoveFineArt.com. IT used to be that each and every product would take about 20 minuets to enter. With this new panel (incorperating secure AJAX), The products can be entered as fast as the site owner can type!</p>
<p>Here is a screen shot of the new back end.</p>
<dl id="attachment_148" class="wp-caption alignnone" style="width: 310px;">
<dt class="wp-caption-dt"><img class="size-medium wp-image-148" title="cpi_panel_screenshot_for_we" src="http://rubberneckdesigns.com/wp-content/uploads/2009/07/cpi_panel_screenshot_for_we-300x243.jpg" alt="Screen shot of the up and comming CPI Data Panel" width="300" height="243" /></dt>
</dl>
<p>I have also been busy learning the Drupal platform. AS I become more knowledgeable there will be posts and perhaps a special section on this blog devoted to cool new drupalistic methods and problem solving.</p>
<p>AS always, I invite you to leave a coment or sugestion or critisizm.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.rubberneckdesigns.com/ajax-web-design/screen-shot-of-the-up-and-comming-cpi-data-panel/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Dynamically Change the onClick, onChange (or other) Value of an Element</title>
		<link>http://www.rubberneckdesigns.com/ajax-web-design/how-to-dynamically-change-the-onclick-and-other-value-of-an-element/</link>
		<comments>http://www.rubberneckdesigns.com/ajax-web-design/how-to-dynamically-change-the-onclick-and-other-value-of-an-element/#comments</comments>
		<pubDate>Fri, 15 May 2009 16:38:06 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[AJAX]]></category>
		<category><![CDATA[User Iterface Design]]></category>
		<category><![CDATA[javaScript Tips]]></category>

		<guid isPermaLink="false">http://rubberneckdesigns.com/?p=106</guid>
		<description><![CDATA[If you are implementing AJAX, you will likely run into the need to change the functionality of a button dynamically. There is not a whole lot out there on how to quickly accomplish this so here is a simple explanation.
Typically, you have an element such as an “input”, “a” or “select (options)” that has an [...]]]></description>
			<content:encoded><![CDATA[<p>If you are implementing AJAX, you will likely run into the need to change the functionality of a button dynamically. There is not a whole lot out there on how to quickly accomplish this so here is a simple explanation.</p>
<p>Typically, you have an element such as an “<span style="color: #008000;">input</span>”, “<span style="color: #008000;">a</span>” or “<span style="color: #008000;">select</span> (options)” that has an attribute of “<span style="color: #008000;">onClick</span>”, “<span style="color: #008000;">onMouseOver</span>” or “<span style="color: #008000;">onChange</span>” with a value of some function that will execute upon the event represented by the attribute.</p>
<p><span style="color: #0000ff;"><strong>UPDATE</strong></span>: This has been changed to accommodate ie. The following way will work in both Firefox and Internet Explorer:</p>
<p>button_element.onclick = function() {doSomething();};</p>
<p>Thanks! <a href="http://stackoverflow.com/questions/95731/why-does-an-onclick-property-set-with-setattribute-fail-to-work-in-ie">to this pos</a>t. (note: the answer is at the bottom of the post after some discussion.) Thanks for sharing <img class="alignnone" title="stackoverflow.com" src="http://stackoverflow.com/content/img/so/logo.png" alt="" width="128" height="31" /></p>
<p><span style="text-decoration: line-through;"><span style="color: #ff6600;">To assign a new value to the attribute, you need to identify the element you want to change like this:</span></span></p>
<p><span style="text-decoration: line-through;"><span style="color: #ff6600;">elem =  document.getElementById(&#8221;myElementId&#8221;)</span></span></p>
<p><span style="text-decoration: line-through;"><span style="color: #ff6600;">Then simply assign the new value to the attribute like this:</span></span></p>
<p><span style="color: #008000;"><span style="text-decoration: line-through;"><span style="color: #ff6600;">elem.attributes["onclick"].value = &#8220;myUpdatedFunction(&#8217;My parameter&#8217;)” ;</span></span><br />
</span><br />
Now, if someone clicks on the element, the new updated version of <span style="color: #008000;">myUpdatedFunction()</span> will be called. Notice that you can even pass a parameter to the function this way. Just be sure to nest your quotes properly.</p>
<p>This method will also work for other attribute types such as <span style="color: #008000;">onMouseOver</span>, <span style="color: #008000;">onChange</span> an so on.</p>
<p>I hope this helps.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.rubberneckdesigns.com/ajax-web-design/how-to-dynamically-change-the-onclick-and-other-value-of-an-element/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>How to Protect Against SQL Injection</title>
		<link>http://www.rubberneckdesigns.com/ajax-web-design/how-to-protect-against-sql-injection/</link>
		<comments>http://www.rubberneckdesigns.com/ajax-web-design/how-to-protect-against-sql-injection/#comments</comments>
		<pubDate>Thu, 07 May 2009 17:44:31 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[AJAX]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[Web Security]]></category>

		<guid isPermaLink="false">http://rubberneckdesigns.com/?p=74</guid>
		<description><![CDATA[One of the most common web security problems is SQL Injection. As the name implies, SQL injections works by introducing malicious SQL code where it doesn&#8217;t belong. Since it is SQL code you could probably guess that the attacker &#8220;injects&#8221; his poison via database queries. Web developers often pass some sort of variable to their [...]]]></description>
			<content:encoded><![CDATA[<p>One of the most common web security problems is SQL Injection. As the name implies, SQL injections works by introducing malicious SQL code where it doesn&#8217;t belong. Since it is SQL code you could probably guess that the attacker &#8220;injects&#8221; his poison via database queries. Web developers often pass some sort of variable to their database queries. Very common are variables that are influenced by user input. User input, to variable, then to query,- get it? So, there is a need for a way of eliminating the user&#8217;s ability to manipulate the variable in any way that could effect the query.</p>
<p><strong>What Happens With SQL Injection</strong></p>
<p>By passing an unexpected string of code into a user input, such a form, an attacker send damaging code that causes an otherwise good query to go haywire. For example:<span id="more-74"></span></p>
<div id="attachment_73" class="wp-caption alignleft" style="width: 384px"><img class="size-full wp-image-73" title="code snippet sql injection unprotected" src="http://www.rubberneckdesigns.com.php5-5.dfw1-2.websitetestlink.com/wp-content/uploads/2009/05/picture-8.png" alt="unprotected query is vulnerable" width="374" height="18" /><p class="wp-caption-text">unprotected query is vulnerable</p></div>
<p>The above snippet of code works as long as users put in the expected information. An attacker, will instead, make clever use of a few extra characters. You likely know by now that SQL requires a semi-colon at the end of each query. PHP automatically adds it in if you omit it. Because of this, the attacker, by closing the string and using the closing parenthesis to finish the query followed by a semi colon, can add an additional query to drop the table.<img class="size-full wp-image-75" title="example of SQL Injection" src="http://www.rubberneckdesigns.com.php5-5.dfw1-2.websitetestlink.com/wp-content/uploads/2009/05/picture-9.png" alt="example of SQL Injection" width="349" height="14" /></p>
<div class="mceTemp">
<dl id="attachment_75" class="wp-caption alignnone" style="width: 359px;">
<dd class="wp-caption-dd"><span style="color: #888888;">example of SQL Injection</span></dd>
</dl>
</div>
<p>This is what we in the world of secure web development refer to as a &#8216;bad thing&#8217;!<br />
Scary isn&#8217;t it? Attackers have used this method to not only drop tables and destroy records, but also to retrieve highly sensitive information.</p>
<p><strong>How to Protect Against SQL Injection</strong></p>
<p>OK, after that scary bit of information, you&#8217;ll be glad to know that protecting yourself is really not all that hard. The hard part is always remembering when and where to do it.</p>
<p>Protecting against SQL Injection is a simple matter of calling a PHP function that renders data safe ( or cleansed ) for use in a query. There are a few methods for cleansing user input in PHP depending on the PHP extension you are using. We will be discussing the mysql extension.The name of the function is:<br />
<span style="color: #0000ff;">mysql_real_escape_string()</span>. Notice in this snippet how it is used:</p>
<div id="attachment_72" class="wp-caption alignnone" style="width: 480px"><img class="size-full wp-image-72" title="code snippet mysql_real_escape_string" src="http://www.rubberneckdesigns.com.php5-5.dfw1-2.websitetestlink.com/wp-content/uploads/2009/05/picture-7.png" alt="How to protect again SQL Injection" width="470" height="205" /><p class="wp-caption-text">How to protect again SQL Injection</p></div>
<p>See how easy it is?  Just take the user input (in this case a post ) and pass it through the <span style="color: #0000ff;">mysql_real_escape_string()</span> function, (as shown on line 7 ). Then use the &#8220;cleansed&#8221; variable in the query ( as shown on line 9 ).</p>
<p>It is so easy to protect against this, yet it is often overlooked or forgotten. SO remember to use <span style="color: #0000ff;">mysql_real_escape_string()</span> to cleanse your input to help guard against SQL Injection.</p>
<p>There is more to learn and be discussed so feel free to stop back or drop me any suggestions or tips to share.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.rubberneckdesigns.com/ajax-web-design/how-to-protect-against-sql-injection/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>What is AJAX</title>
		<link>http://www.rubberneckdesigns.com/ajax-web-design/what-is-ajax/</link>
		<comments>http://www.rubberneckdesigns.com/ajax-web-design/what-is-ajax/#comments</comments>
		<pubDate>Fri, 01 May 2009 18:48:08 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[AJAX]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://rubberneckdesigns.com/?p=40</guid>
		<description><![CDATA[Asynchronous Put the “A” in AJAX
The key word is asynchronous.
“1.  A process in a multitasking system whose execution can proceed independently, &#8220;in the background&#8221;. Other processes may be started before the asynchronous process has finished.”—Dictionary.com
Most web pages are rather &#8220;choppy&#8221; because they need to “refresh” themselves, which is a nice way of saying completely re-load [...]]]></description>
			<content:encoded><![CDATA[<p><strong>Asynchronous Put the “A” in AJAX</strong><br />
The key word is asynchronous.<br />
<span style="color: #808080;"><em>“1.  A process in a multitasking system whose execution can proceed independently, &#8220;in the background&#8221;. Other processes may be started before the asynchronous process has finished.”</em></span><span style="color: #808080;">—Dictionary.com</span><br />
Most web pages are rather &#8220;choppy&#8221; because they need to “refresh” themselves, which is a nice way of saying completely re-load the entire page. This must happen every single time they need to &#8220;refresh&#8221; their data from the server. You probably have figured out by now that this takes time. What AJAX does is allow a web page to asynchronously update only the portion of the web page that is actually in need of fresh data instead of the entire page. Not only is it much faster, but the effect is that it is much smoother. This is because your eye does not have to endure the “flicker” or “hang ups” of the complete page re-load. Sometime the transaction is so smooth that the user often has no idea that it has happened. Knowing that you have affect<span id="more-40"></span>ed the page is often important and a part of good usability. This has lead to coming up with ways to give the user a pleasant visual signal as feedback that they have caused a change on the page.</p>
<p><strong>“J” is for JavaScript</strong><br />
To accomplish the asynchronous there needs to be communication with the web server and the application on the server without reloading the page. Thanks to JavaScript’s XMLHttpRequestObject, we can do that. I will be writing more on this in other articles. Suffice it to say for now; “J” is for JavaScript</p>
<p><strong>“A” is also for AND</strong><br />
AS in Asynchronous JavaScript AND XML</p>
<p><strong>“X” is for XML</strong><br />
The data that is passed back and forth between the server and client’s computer is very often XLM data. However this is not always the case. I very often pass simple text output by PHP code on the server. But anyway, the “X” is for XML.</p>
<p>The basic thing to know is that AJAX is in and of itself not a programming “language” per say. It is a technique or way of doing things that very nicely fits in with the Web 2.0 way of designing web sites. It helps to create a smoother faster more pleasant human experience when it is used properly. Ah! Yes, using it properly. There is a topic for several posts.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.rubberneckdesigns.com/ajax-web-design/what-is-ajax/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
