<?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>A Leased Line to the Collective Unconscious &#187; geek stuff</title>
	<atom:link href="http://www.chichira.com/topic/geek-stuff/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.chichira.com</link>
	<description>random scribblings from the other end of the wire</description>
	<lastBuildDate>Wed, 04 Nov 2009 12:15:29 +0000</lastBuildDate>
	
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>WordPress multi-user on PLESK (howto)</title>
		<link>http://www.chichira.com/2009/11/04/wordpress-multi-user-on-plesk-howto/</link>
		<comments>http://www.chichira.com/2009/11/04/wordpress-multi-user-on-plesk-howto/#comments</comments>
		<pubDate>Wed, 04 Nov 2009 12:07:44 +0000</pubDate>
		<dc:creator>RobinLayfield</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[geek stuff]]></category>
		<category><![CDATA[linux]]></category>
		<category><![CDATA[multi-user]]></category>
		<category><![CDATA[plesk]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://www.chichira.com/?p=159</guid>
		<description><![CDATA[]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve recently been tasked with setting up a WordPress Multi-User (Wordpress Mu) instance running on a PLESK based web-server. For the most part this is fairly straightforward, however WordPress Multi-User likes to let users setup blogs as subdomains of the main site, for example, the blog for &#8220;RoadRunner&#8221; would be viewed by visiting</p>
<p>roadrunner.example.com</p>
<p>This presents a problem for PLESK as it manages Virtual Hosting (vhosts) very carefully and it will treat this as an entirely separate domain. The way to solve it involves 2 techniques: setting up a wildcard DNS entry and adding in a special configuration file to the PLESK domain. Here&#8217;s how to do it:</p>
<p><strong>Wildcard DNS entry<br />
</strong></p>
<ul>
<li>go to your PLESK control panel</li>
<li>select your domain</li>
<li>click on the DNS settings icon</li>
<li>
<p><div id="attachment_160" class="wp-caption alignnone" style="width: 148px"><img class="size-full wp-image-160" title="PLESK DNS Settings" src="http://www.chichira.com/wp-content/uploads//Screen-shot-2009-11-04-at-11.54.17.png" alt="PLESK DNS Settings" width="138" height="54" /><p class="wp-caption-text">PLESK DNS Settings</p></div></li>
<li>Now create a new wildcard entry with the following details:<br />
Record Type: CNAME<br />
Domain name: *  (the rest of the domain is written outside the textbox eg. .example.com)<br />
Canonical name: example.com</li>
<li>Click OK</li>
<li>When you make a change to the DNS, PLESK won&#8217;t actually apply it until you hit the UPDATE button, this is sometimes obscured off to screen right</li>
</ul>
<p><strong>VHOST config<br />
</strong>The next part involves having root access to the web server. If you control the whole PLESK domain, this is possible, however you may have to make a technical request if you don&#8217;t</p>
<ul>
<li>using <strong>Terminal</strong>, logon to the server with SSH (eg <strong>ssh root@example.com</strong>) enter your password and you should be presented with a command prompt</li>
<li>cd to the correct folder for your domain (usually /var/www/vhosts/example.com/)</li>
<li>cd into the <strong>conf</strong> folder</li>
<li>create a new file, using <strong>vi</strong><br />
<em><strong>vi vhost.conf</strong></em></li>
<li>press <strong><em>i</em></strong> to go into insert mode and enter the following line:<br />
<em><strong>ServerAlias *.example.com</strong></em><br />
(where example.com is your domain)</li>
<li>hit <em><strong>ESC</strong></em> and then tap <em><strong>:wq!</strong></em> to save the file and quit<br />
You may also be able to create this file using your favourite web editor &#8211; mine is <a title="Coda by Panic" href="http://www.panic.com/coda/" target="_blank">Coda</a> from Panic software &#8211; and FTPing it up into the <strong>conf</strong> folder one level up from the root of the web site, however you will still need to be able to restart the PLESK instance to get it to read the new file.</li>
<li>in the command prompt, type the following command:<br />
<em><strong>/usr/local/psa/admin/sbin/websrvmng -a -v</strong></em><br />
this will restart PLESK</li>
</ul>
<p>That&#8217;s it. You should find that you can now create blogs and view them in their dedicated subdomains.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.chichira.com/2009/11/04/wordpress-multi-user-on-plesk-howto/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>serving Microsoft Office 2007 documents from a Linux PLESK web site</title>
		<link>http://www.chichira.com/2009/06/10/serving-microsoft-office-2007-documents-from-a-linux-plesk-web-site/</link>
		<comments>http://www.chichira.com/2009/06/10/serving-microsoft-office-2007-documents-from-a-linux-plesk-web-site/#comments</comments>
		<pubDate>Wed, 10 Jun 2009 13:06:13 +0000</pubDate>
		<dc:creator>RobinLayfield</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[geek stuff]]></category>
		<category><![CDATA[Apache]]></category>
		<category><![CDATA[Internet Explorer]]></category>
		<category><![CDATA[Microsoft]]></category>
		<category><![CDATA[Mime-types]]></category>
		<category><![CDATA[Office 2007 file formats]]></category>

		<guid isPermaLink="false">http://www.chichira.com/?p=147</guid>
		<description><![CDATA[Office 2007 introduced a whole host of new application extensions, most of which aren&#8217;t recognised by the Apache web server.
What happens if you link to a downloadable file can often be unpredictable; Firefox on OS X will merely download the file. Internet Explorer on the other hand &#8211; even on a system that has Office [...]]]></description>
			<content:encoded><![CDATA[<p>Office 2007 introduced a whole host of new application extensions, most of which aren&#8217;t recognised by the Apache web server.</p>
<p>What happens if you link to a downloadable file can often be unpredictable; Firefox on OS X will merely download the file. Internet Explorer on the other hand &#8211; even on a system that has Office 2007 installed &#8211; will attempt to treat the file as a compressed file.</p>
<div id="attachment_149" class="wp-caption alignnone" style="width: 415px"><img class="size-full wp-image-149" title="Download dialog showing incorrect file type" src="http://www.chichira.com/wp-content/uploads//picture-13.png" alt="Download dialog showing incorrect file type" width="405" height="288" /><p class="wp-caption-text">Download dialog showing incorrect file type</p></div>
<p>Once you choose save in Internet Explorer, it saves it as a compressed file which when you open it gives you a set of resources, similar to a Mac Bundle. It&#8217;s pretty hard to actually get the correct application to launch and run the file as it should (the example above was a PowerPoint pptx file).</p>
<p>Luckily, help is at hand and all you really need to do is register the new Mime types with Apache. You can either do this at the server level in the Apache configuration file, or on a per-site basis using a .htaccess file.</p>
<p><strong>Apache config file<br />
</strong>This file is called httpd.conf for Apache 1 and apache2.conf on Apache 2. There are a number of places it can be so it&#8217;s best to run a file search on the server to find it.</p>
<p>SSH into your server as root (if possible)<br />
Run the command  <em><strong>find / -name apache2.conf</strong></em> or    <em><strong>find / -name httpd.conf<br />
</strong></em>You should now see a file listing which will give you a clue as to where the file will be (most likely etc/apache2 for Apache 2 web servers).<br />
Edit the file using the command <em><strong>vi /etc/apache2/apache2.conf</strong></em> (if that&#8217;s where the file is)<br />
Type <em><strong>:10000 </strong></em>to jump to line 10000 (and therefore the end of the file)<br />
Press <em><strong>I </strong></em>to insert and then newline<br />
Paste in the following lines:</p>
<blockquote><p>AddType application/vnd.ms-word.document.macroEnabled.12 .docm<br />
AddType application/vnd.openxmlformats .docx .pptx .xlsx<br />
#AddType application/vnd.openxmlformats-officedocument.presentationml.presentation .pptx<br />
#AddType application/vnd.openxmlformats-officedocument.spreadsheetml.sheet .xlsx<br />
AddType application/vnd.openxmlformats-officedocument.wordprocessingml.document .docx<br />
AddType application/vnd.ms-word.template.macroEnabled.12 .dotm<br />
AddType application/vnd.openxmlformats-officedocument.wordprocessingml.template .dotx<br />
AddType application/vnd.ms-powerpoint.template.macroEnabled.12 .potm<br />
AddType application/vnd.openxmlformats-officedocument.presentationml.template .potx<br />
AddType application/vnd.ms-powerpoint.addin.macroEnabled.12 .ppam<br />
AddType application/vnd.ms-powerpoint.slideshow.macroEnabled.12 .ppsm<br />
AddType application/vnd.openxmlformats-officedocument.presentationml.slideshow .ppsx<br />
AddType application/vnd.ms-powerpoint.presentation.macroEnabled.12 .pptm<br />
AddType application/vnd.ms-excel.addin.macroEnabled.12 .xlam<br />
AddType application/vnd.ms-excel.sheet.binary.macroEnabled.12 .xlsb<br />
AddType application/vnd.ms-excel.sheet.macroEnabled.12 .xlsm<br />
AddType application/vnd.ms-excel .xlt .xla<br />
AddType application/vnd.openxmlformats-officedocument.spreadsheetml.template .xltx<br />
AddType application/vnd.ms-excel.template.macroEnabled.12 .xltm<br />
AddType application/vnd.ms-xpsdocument .xps<br />
AddType application/application/vnd.ms-powerpoint .ppt .pot .pps .ppa<br />
AddType application/msword .doc .dot</p></blockquote>
<p>Now hit <em><strong>[Esc] </strong></em>to leave insert mode<br />
Type <em><strong>:wq!</strong></em> to save the file<br />
Finally restart the apache server, most likely by using the command <em><strong>/etc/init.d/apache2 restart<br />
</strong></em>Your entire web server should now be able to deliver the correct file types &#8211; problem no more.<br />
<strong>Per site .htaccess configuration</strong><br />
Browse to your remote site and open the .htaccess file if it&#8217;s present (make sure that your web / ftp client can see hidden files as dot-prefixed files are traditionally hidden from view on the Linux / Unix platform.</p>
<p>Create a new file if there isn&#8217;t one present and then simply add in the following lines:</p>
<blockquote><p>AddType application/vnd.ms-word.document.macroEnabled.12 .docm<br />
AddType application/vnd.openxmlformats .docx .pptx .xlsx<br />
#AddType application/vnd.openxmlformats-officedocument.presentationml.presentation .pptx<br />
#AddType application/vnd.openxmlformats-officedocument.spreadsheetml.sheet .xlsx<br />
AddType application/vnd.openxmlformats-officedocument.wordprocessingml.document .docx<br />
AddType application/vnd.ms-word.template.macroEnabled.12 .dotm<br />
AddType application/vnd.openxmlformats-officedocument.wordprocessingml.template .dotx<br />
AddType application/vnd.ms-powerpoint.template.macroEnabled.12 .potm<br />
AddType application/vnd.openxmlformats-officedocument.presentationml.template .potx<br />
AddType application/vnd.ms-powerpoint.addin.macroEnabled.12 .ppam<br />
AddType application/vnd.ms-powerpoint.slideshow.macroEnabled.12 .ppsm<br />
AddType application/vnd.openxmlformats-officedocument.presentationml.slideshow .ppsx<br />
AddType application/vnd.ms-powerpoint.presentation.macroEnabled.12 .pptm<br />
AddType application/vnd.ms-excel.addin.macroEnabled.12 .xlam<br />
AddType application/vnd.ms-excel.sheet.binary.macroEnabled.12 .xlsb<br />
AddType application/vnd.ms-excel.sheet.macroEnabled.12 .xlsm<br />
AddType application/vnd.ms-excel .xlt .xla<br />
AddType application/vnd.openxmlformats-officedocument.spreadsheetml.template .xltx<br />
AddType application/vnd.ms-excel.template.macroEnabled.12 .xltm<br />
AddType application/vnd.ms-xpsdocument .xps<br />
AddType application/application/vnd.ms-powerpoint .ppt .pot .pps .ppa<br />
AddType application/msword .doc .dot</p></blockquote>
<p>save the .htaccess file and your web site should start delivering the correct file types!</p>
<div id="attachment_150" class="wp-caption alignnone" style="width: 414px"><img class="size-full wp-image-150" title="correct file format" src="http://www.chichira.com/wp-content/uploads//picture-41.png" alt="Now in pptx format" width="404" height="273" /><p class="wp-caption-text">Now in pptx format!</p></div>
]]></content:encoded>
			<wfw:commentRss>http://www.chichira.com/2009/06/10/serving-microsoft-office-2007-documents-from-a-linux-plesk-web-site/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>NamesCo Zeus server, 301 Redirects</title>
		<link>http://www.chichira.com/2009/03/30/namesco-zeus-server-301-redirects/</link>
		<comments>http://www.chichira.com/2009/03/30/namesco-zeus-server-301-redirects/#comments</comments>
		<pubDate>Mon, 30 Mar 2009 23:29:13 +0000</pubDate>
		<dc:creator>RobinLayfield</dc:creator>
				<category><![CDATA[Karyx]]></category>
		<category><![CDATA[geek stuff]]></category>
		<category><![CDATA[htaccess]]></category>
		<category><![CDATA[namesco]]></category>
		<category><![CDATA[redirects]]></category>
		<category><![CDATA[zeus]]></category>

		<guid isPermaLink="false">http://www.chichira.com/?p=127</guid>
		<description><![CDATA[Howto manage a 301 redirect on a NamesCo linux (Zeus) server
I felt I should write this up because it&#8217;s a problem that&#8217;s been puzzling me for some time and I only found out the answer today. Here&#8217;s the deal:
* it&#8217;s currently recommended that all traffic to a web site goes to one URL, to minimise [...]]]></description>
			<content:encoded><![CDATA[<p>Howto manage a 301 redirect on a <strong>NamesCo</strong> linux (<strong>Zeus</strong>) server</p>
<p>I felt I should write this up because it&#8217;s a problem that&#8217;s been puzzling me for some time and I only found out the answer today. Here&#8217;s the deal:</p>
<p>* it&#8217;s currently recommended that all traffic to a web site goes to one URL, to minimise dilution of the Google PageRank.</p>
<p>* on <strong>NamesCo </strong>servers, traffic is automatically routed to both http://www.example.com/ and http://example.com</p>
<p>* ordinarily I would use an <strong>Apache .htaccess</strong> script with a simple <strong>301 redirect</strong> in it, like so:</p>
<p>RewriteEngine On<br />
RewriteCond %{HTTP_HOST} ^example\.com<br />
RewriteRule (.*) http://www.example.com/$1 [R=301,L]</p>
<p>* But&#8230;. <strong>NamesCo</strong> servers don&#8217;t run on <strong>Apache</strong>, they run on <strong>Zeus</strong></p>
<p>So what we need is a script that will force <strong>Zeus</strong> to do the same kind of redirect.</p>
<p>There&#8217;s just one other gotcha, that is specific to NamesCo. The script is only allowed to be run from one place, in the root of your web directory, a file called rewrite.script. You can edit this manually but by far the best way to manipulate it is via the control panel on the NamesCo server. There&#8217;s a module under<em><strong> Scripts &amp; eCommerce</strong></em> called <strong><em>Rewrite Script</em></strong>.</p>
<div id="attachment_128" class="wp-caption alignnone" style="width: 182px"><img class="size-full wp-image-128" title="Screen grab of NamesCo control panel" src="http://www.chichira.com/wp-content/uploads//capture.jpg" alt="Screen grab of NamesCo control panel" width="172" height="251" /><p class="wp-caption-text">Screen grab of NamesCo control panel</p></div>
<p>This module has two key features:</p>
<p>1) it will take standard <strong>UrlRewrite</strong> code from an <strong>Apache .htaccess</strong> file and convert it to <strong>Zeus</strong> compliant code.</p>
<p>2) it will allow you to type in <strong>Zeus</strong> compliant code and validate it before writing it to the server root.</p>
<p>After much scrabbling around and an awful lot of trial and error, I found a post from a guy called <strong>Robert</strong> at <strong>www.emailmarketingsolution.co.uk</strong> that seemed to do the trick. The original post is up on the <a title="Zeus Knowledge Hub" href="http://knowledgehub.zeus.com/index.php/internal/2007/11/23/zeus_communities?blog=16&amp;c=1&amp;page=1&amp;more=1&amp;title=zeus_communities&amp;tb=1&amp;pb=1&amp;disp=single" target="_blank">zeus community knowledge hub</a>.</p>
<p><strong>Zeus </strong>uses a completely different algorithm for its server control scripts and documentation is somewhat thin on the ground &#8211; most of the examples I found on the internet were just that, examples and hacks showing different approaches to solving pretty much the same problem.</p>
<p>I&#8217;m going to repeat Robert&#8217;s script here but add in a bit of background detail to show what it is actually doing</p>
<blockquote><p>RULE_0_START:<br />
<em># begin rule, rules are separated into blocks in the Rewrite.Script</em><br />
match IN:Host into $ with ^example<strong>\.</strong>com$<br />
<em># examine the hostname to see if it doesn&#8217;t begin with www (note the backslash to escape the dot before the domain suffix)</em></p>
<p>if matched then<br />
match URL into $ with ^/(.*)$<br />
<em> # if there is a match, extract the rest of the path into a temporary variable ($1)</em></p>
<p>set OUT:Location = http://www.example.com/$1<br />
<em> # now re-construct the header location, this time prefixing it with &#8216;www&#8217;</em></p>
<p>set OUT:Content-Type = text/html<br />
set RESPONSE = 301<br />
<em># tell Google (&amp; others) that this page has been permanently moved, so they update their records</em></p>
<p>set BODY = Permanently Moved<br />
<em># human readable version of &#8216;301&#8242; message</em></p>
<p>goto END<br />
endif<em></em></p>
<p><em># end rule</em><br />
RULE_0_END:</p></blockquote>
<p>OK, so there you have it. That&#8217;s how to do some basic Zeus wrangling. There&#8217;s more documentation on the Zeus server at the <a title="Zeus Knowledge Hub" href="http://knowledgehub.zeus.com/docs" target="_blank">Zeus Knowledge Hub web site</a>. I think the key documentation is the <a title="Zeus TrafficScript Guide" href="http://knowledgehub.zeus.com/media/5.1/ZXTM_5.1_TrafficScript_Guide.pdf" target="_blank">TrafficScript Guide</a> but I&#8217;m not entirely convinced.</p>
<p>Additional: DRUPAL users<br />
There&#8217;s also a complete Rewrite.script for Drupal users. Get it from the <a title="Rewrite.Script for Drupal / Zeus" href="http://drupal.org/node/46508" target="_blank">main Drupal web site.</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.chichira.com/2009/03/30/namesco-zeus-server-301-redirects/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fun with icons in OS X</title>
		<link>http://www.chichira.com/2009/01/08/fun-with-icons-in-os-x/</link>
		<comments>http://www.chichira.com/2009/01/08/fun-with-icons-in-os-x/#comments</comments>
		<pubDate>Thu, 08 Jan 2009 22:30:20 +0000</pubDate>
		<dc:creator>RobinLayfield</dc:creator>
				<category><![CDATA[geek stuff]]></category>
		<category><![CDATA[stuff & nonsense]]></category>
		<category><![CDATA[application icons]]></category>
		<category><![CDATA[Dock]]></category>
		<category><![CDATA[hack]]></category>
		<category><![CDATA[I hate the Safari icon]]></category>
		<category><![CDATA[Mac]]></category>
		<category><![CDATA[OS X]]></category>
		<category><![CDATA[tweak]]></category>

		<guid isPermaLink="false">http://www.chichira.com/?p=78</guid>
		<description><![CDATA[OK, I&#8217;ll fess up &#8211; lately I&#8217;ve become a bit bored with the icons that appear in my OS X dock. I mean, they&#8217;re cute and all but they barely even drink. Look at the them. They&#8217;re a bit tired, eh? And I&#8217;ve always hated that Safari icon. I mean look at them


So I thought [...]]]></description>
			<content:encoded><![CDATA[<div class="mceTemp">OK, I&#8217;ll fess up &#8211; lately I&#8217;ve become a bit bored with the icons that appear in my OS X dock. I mean, they&#8217;re cute and all but they barely even drink. Look at the them. They&#8217;re a bit tired, eh? And I&#8217;ve always hated that <a title="Pimp my safari" href="http://pimpmysafari.com/" target="_blank">Safari</a> icon. I mean look at them</div>
<div class="mceTemp">
<div id="attachment_95" class="wp-caption alignleft" style="width: 748px"><img class="size-full wp-image-95" title="Leopard dock icons" src="http://www.chichira.com/wp-content/uploads//picture-4.png" alt="Leopard dock icons" width="738" height="119" /><p class="wp-caption-text">Leopard dock icons</p></div>
</div>
<div class="mceTemp">So I thought I&#8217;d have a play around and see how easy it was to change them. Turns out it&#8217;s really simple&#8230;</div>
<div class="mceTemp"><strong><br />
</strong></div>
<div class="mceTemp"><strong>Getting the image</strong></div>
<div class="mceTemp">I decided to replace my icons with pictures of letters &#8211; just so I had a clue as to what applications they represented, so I trawled through <a title="Flickr dot com" href="http://flickr.com/" target="_blank">Flickr</a>, searching for &#8216;letter a&#8217;, &#8216;letter t&#8217; and the like. When I found a suitable image, I used Command-Shift-4 to do a cheeky screen grab. Replacement icons can come from anywhere.</div>
<div class="mceTemp"><strong>Changing the application icon</strong></div>
<div class="mceTemp">This is really easy. Open <em>Applications</em> in Finder and click on the application you want to change the icon for. Hit the Command-I or right-click and choose <em>Get Info</em> on the file to view its details.</div>
<div id="attachment_97" class="wp-caption alignleft" style="width: 278px"><img class="size-full wp-image-97" title="Get Info" src="http://www.chichira.com/wp-content/uploads//picture-10.png" alt="Get Info" width="268" height="216" /><p class="wp-caption-text">Get Info</p></div>
<div class="mceTemp">double-click on your saved screen grab to open it in <em>Preview</em> then Command-A to select all and then Command-C to copy the image. Back in the <em>Get Info</em> pane, clicking on the icon itself will highlight it with a blue glow. Clicking Command-V will paste your new icon in its place. Careful though, it can be pretty addictive!</div>
<div class="mceTemp">
<div id="attachment_96" class="wp-caption alignleft" style="width: 501px"><img class="size-full wp-image-96" title="Finder" src="http://www.chichira.com/wp-content/uploads//picture-9.png" alt="Finder" width="491" height="301" /><p class="wp-caption-text">Finder</p></div>
</div>
<div class="mceTemp">And here&#8217;s the end result. My graphitti dock! OK, it&#8217;s a bit more rough and ready than Apple&#8217;s work of art, but it&#8217;s all mine and I like it!</div>
<div class="mceTemp">
<div id="attachment_98" class="wp-caption alignleft" style="width: 587px"><img class="size-full wp-image-98" title="my dock!" src="http://www.chichira.com/wp-content/uploads//picture-111.png" alt="my dock!" width="577" height="67" /><p class="wp-caption-text">my dock!</p></div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.chichira.com/2009/01/08/fun-with-icons-in-os-x/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Internet Explorer 7/Opera 9 form button gotcha</title>
		<link>http://www.chichira.com/2009/01/06/internet-explorer-7opera-9-form-button-gotcha/</link>
		<comments>http://www.chichira.com/2009/01/06/internet-explorer-7opera-9-form-button-gotcha/#comments</comments>
		<pubDate>Tue, 06 Jan 2009 13:12:17 +0000</pubDate>
		<dc:creator>RobinLayfield</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[geek stuff]]></category>
		<category><![CDATA[button behaviour]]></category>
		<category><![CDATA[Firefox]]></category>
		<category><![CDATA[forms]]></category>
		<category><![CDATA[IE]]></category>
		<category><![CDATA[non-standard]]></category>
		<category><![CDATA[Opera]]></category>
		<category><![CDATA[Safari]]></category>

		<guid isPermaLink="false">http://www.chichira.com/?p=79</guid>
		<description><![CDATA[Well I thought I'd kick off the New Year by documenting an annoying and frustrating "undocumented feature" of IE and Opera.
This one is pretty simple and I guess it's fairly obvious when you think about it but it's not consistent with other platforms or this web developer's expectations of browser behaviour.
Internet Explorer 7 and Opera [...]]]></description>
			<content:encoded><![CDATA[<p>Well I thought I'd kick off the New Year by documenting an annoying and frustrating "undocumented feature" of IE and Opera.<br />
This one is pretty simple and I guess it's fairly obvious when you think about it but it's not consistent with other platforms or this web developer's expectations of browser behaviour.</p>
<p>Internet Explorer 7 and Opera 9, as far as I can tell do not send the form element details correctly when the form is submitted. Instead of posting the input element name and value, they post the input name with the x and y co-ordinates of the mouse pointer at the time of clicking. This information is also sent by Firefox and other browsers but they do send it together with the actual element name and value as well.</p>
<p><strong>Important information e.g. the Value of the button could be missed by these browsers</strong></p>
<p>The real gotcha is if you are processing a form and performing alternate actions when a button is clicked on (eg you may have an 'Upload Image' button and a 'Finish' button). Testing that the button has been clicked by looking for a POST or GET value of the <em>button name</em> will not give you the correct result when the button was clicked in IE.</p>
<p><strong>To replicate this behaviour:</strong></p>
<p>Create a form and add a graphical submit button to it, with a name of "submit"</p>
<div id="attachment_82" class="wp-caption alignleft" style="width: 249px"><img class="size-full wp-image-82" title="Form with graphical input button" src="http://www.chichira.com/wp-content/uploads//picture-2.png" alt="Form with graphical input button" width="239" height="53" /><p class="wp-caption-text">Form with graphical input button</p></div>
<div class="igBar"><span id="lhtml-3"><a href="#" onclick="javascript:showPlainTxt('html-3'); return false;">PLAIN TEXT</a></span></div>
<div class="syntax_hilite"><span class="langName">HTML:</span>
<div id="html-3">
<div class="html">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><a href="http://december.com/html/4/element/form.html"><span style="color: #000000; font-weight: bold;">&lt;form</span></a> <span style="color: #000066;">action</span>=<span style="color: #ff0000;">"/Search/"</span> <span style="color: #000066;">method</span>=<span style="color: #ff0000;">"get"</span><span style="color: #000000; font-weight: bold;">&gt;</span></a></span> <span style="color: #009900;"><a href="http://december.com/html/4/element/input.html"><span style="color: #000000; font-weight: bold;">&lt;input</span></a> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">"search"</span> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">"text"</span> /<span style="color: #000000; font-weight: bold;">&gt;</span></a></span> <span style="color: #009900;"><a href="http://december.com/html/4/element/input.html"><span style="color: #000000; font-weight: bold;">&lt;input</span></a> <span style="color: #000066;">id</span>=<span style="color: #ff0000;">"submit"</span> <span style="color: #000066;">alt</span>=<span style="color: #ff0000;">"search"</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">"submit"</span> /<span style="color: #000000; font-weight: bold;">&gt;</span></a></span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">src=&quot;images/btn_search.gif&quot; type=&quot;image&quot; value=&quot;submit&quot; /<span style="color: #ddbb00;">&amp;gt;</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/form&gt;</span></span> </div>
</li>
</ol>
</div>
</div>
</div>
<p></p>
<p>you would expect that as it's an input source that the submit value will be transmitted as part of the form.</p>
<p>Here is the output displayed when the form is submitted to this simple script</p>
<div class="igBar"><span id="lphp-4"><a href="#" onclick="javascript:showPlainTxt('php-4'); return false;">PLAIN TEXT</a></span></div>
<div class="syntax_hilite"><span class="langName">PHP:</span>
<div id="php-4">
<div class="php">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><a href="http://www.php.net/print_r"><span style="color:#000066;">print_r</span></a><span style="color:#006600; font-weight:bold;">&#40;</span><span style="color:#0000FF;">$_GET</span><span style="color:#006600; font-weight:bold;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">?&amp;gt; </div>
</li>
</ol>
</div>
</div>
</div>
<p></p>
<p>this is what you see when you <strong>View Source</strong> in Firefox and Safari</p>
<div id="attachment_83" class="wp-caption alignleft" style="width: 206px"><img class="size-full wp-image-83" title="Output from Firefox" src="http://www.chichira.com/wp-content/uploads//picture-3.png" alt="Output from Firefox" width="196" height="109" /><p class="wp-caption-text">Output from Firefox</p></div>
<div id="attachment_84" class="wp-caption alignleft" style="width: 162px"><img class="size-full wp-image-84" title="output from Safari" src="http://www.chichira.com/wp-content/uploads//picture-5.png" alt="output from Safari" width="152" height="135" /><p class="wp-caption-text">output from Safari</p></div>
<p>see the final value - submit (the button) has a value of "submit"</p>
<p>now lets <strong>View Source</strong> in Internet Explorer 7 and Opera 9</p>
<div id="attachment_81" class="wp-caption alignleft" style="width: 206px"><img class="size-full wp-image-81" title="Windows form output" src="http://www.chichira.com/wp-content/uploads//picture-11.png" alt="output from Internet Explorer 7" width="196" height="133" /><p class="wp-caption-text">output from Internet Explorer 7</p></div>
<div id="attachment_85" class="wp-caption alignleft" style="width: 211px"><img class="size-full wp-image-85" title="output from Opera" src="http://www.chichira.com/wp-content/uploads//picture-6.png" alt="output from Opera" width="201" height="155" /><p class="wp-caption-text">output from Opera</p></div>
<p>nada - zip, zilch, nothing</p>
<p>As far as I know, when you create an input element in a form that element has to pass its value by name, eg. last_name=layfield otherwise it is not behaving correctly.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.chichira.com/2009/01/06/internet-explorer-7opera-9-form-button-gotcha/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
