Behaviour, Return of Clean HTML
March 9, 2006 | 1 Comment
As we’ve begun adopting Ajax, JSON, and similar JavaScript heavy technologies a problem quickly arose. Suddenly our clean HTML was being cluttered with tons of script tags, onclicks, and other various event handling functions. Trying to extract this logic back out of the HTML was a definite desire for us.
Enter Behaviour.
Behaviour uses CSS selectors to specify what elements to apply JS handlers to.
Check out these demos. View the source and you’ll see clean markup that is free of logic. This allows us to step back and once again fully separate the presentation layer from the application layer.
Tags: AJAX, behavior, behaviour, css, functions, html, javascript, js, JSON, programming, web, web 2.0, web development, web20, xhtml
S5, A Good Start
January 18, 2006 | 2 Comments
I really like the idea of having all my office applications replaced by web based versions. I want to be able to manage any document from where ever I’m sitting on whoevers computer. I then also want to be able to collaborate and share viewing and/or authoring with whomever I like.
Writely does this very well as relates to Microsoft Word. For three months now I have used Writely exclusively for my word processing needs. I no longer have any use for Word.
S5 is billed as “A Simple Standards-Based Slide Show System.” Check out this example slideshow. I love what they are accomplishing with their standard, and it is purely XHTML, CSS, and JavaScript in the background.
If someone can take this concept one step further and build a nice WYSIWYG tool to create slideshows and make it web based, PowerPoint may be the next Office application I stop using.
Maybe the Writely developers could add a simple tab to their app that allows creation of presentations on the S5 standard… Whoever does it, I’ll be in line for the beta, as I’m sure thousands of other will be as well.
Tags: collaboration, excel, html, javascript, presentation, presentations, s5, standard, web 2.0, web20, word, word processing, writely, xhtml
Firefox Form Difficulty
November 4, 2005 | 17 Comments
I had this form that I kept getting reports about it not working. I knew the form had not changed in over a year, so was confused by the report. I fired up Internet Explorer, tested it, it worked perfect. However, the form didn’t work at all in Firefox. Looking at it, it seemed pretty simple, so what was the issue?
So, I took the form and started some known array debugging techniques, mainly a simple print_r($_POST) which showed all the array elements with proper values in IE, but with Firefox they all had the default form values. Strange.
So, I copied the form out of the overall application, dropping included functions, libraries, and global variables. Just taking the standalone form and posting it to a PHP script that only print_r()’d the $POST array. Still did it.
It then dawned on me that I should try just a simple hand coded form unrelated to this example to make sure I didn’t have a flawed Firefox install, and in turn be certain it could process forms. Of course it could, this was good. Something was wrong with my form specifically.
I then boiled the form down to be extremely simple, removing various elements one at a time until the form functioned properly, which it eventually did. I had then narrowed it down to be related to the <input type=”reset” name=”reset” value=”reset” /> button. At this point I jumped to the conclusion that maybe Firefox had messed up the reset button implementation, so made a simple form using it, and it worked fine…
Now I knew the reset was related, but not the sole cause, so what was different? For some reason, the reset and submit buttons had a <label> tag around them. I know, this doesn’t make any sense, but it also shouldn’t cause this level of difficulty.
Anyway, here’s a simplified version of a troubling form:
<form method=”post” action=”show_post.php”>
<input name=”example” type=”text” size=”40″ value=”{something default}” />
<label>
<input type=”reset” name=”reset” value=”Reset” />
<input type=”submit” name=”Submit” value=”Submit” />
</label>
</form>
Test it out here and you’ll see what I mean (hopefully).
Tags: firefox, form, html, internet explorer, php, xhtml
A Useful Attribute, Clear Left
September 14, 2005 | 1 Comment
Often I write articles that I want an image on the left with text around it. This is as simple as putting align="left" in the img tag. However, sometimes you want a portion of the text to not be wrapped, or you have only a small amount of text and don’t want your technorati tags or next story to get wrapped up next to the image.
In either of these cases, simply use: <br clear="left" />
Another quick tip for <div style="height:100px"></div> to make some empty space in a post. An exaple place where I needed this was in writing quizzes.
Update 5/8/2006: Jon tells me I’m a big jerk for not additionally mentioning you can use “right” or “both” in place of “left” to clear other things you may want to do.
Tags: clear left, html, wordpress, xhtml