jQuery: The Write Less, Do More, JavaScript Library. jQuery Table Manipulation. Exclusive offer: get 50% off this eBook here jQuery 1.4 Reference Guide — Save 50% This book and eBook is a comprehensive exploration of the popular JavaScript library by Jonathan Chaffer Karl Swedberg | August 2007 | AJAX Open Source Web Development In this article by Karl Swedberg and Jonathan Chaffer, we will use an online bookstore as our model website, but the techniques we cook up can be applied to a wide variety of other sites as well, from weblogs to portfolios, from market-facing business sites to corporate intranets.
In this article, we will use jQuery to apply techniques for increasing the readability, usability, and visual appeal of tables, though we are not dealing with tables used for layout and design. But this is not the place for an extended discussion on the proper role of tables. Some of the techniques we apply to tables in this article can be found in plug‑ins such as Christian Bach's Table Sorter. One of the most common tasks performed with tabular data is sorting. Live Preview jQuery Plugin. Many web applications (such as this blog) allow users to enter HTML as a comment.
For security reasons, the set of allowed tags is tightly constrained by logic running on the server. Because of this, it’s helpful to provide a preview of what the comment will look like as the user is typing the comment. sneak peek - by ArminH on sxc.huThat’s exactly what my live preview jQuery plugin does. See it in action This is the first jQuery Plugin I’ve written, so I welcome feedback.
All you need for the HTML is an input, typically a TEXTAREA and an element to use as the preview, typically a DIV <textarea class="source"></textarea><label>Preview Area</label><div class="preview"></div> And the following script demonstrates one way to hook up the preview to the textarea. One thing that’s different between this implementation and others I’ve seen is you can specify a set of allowed tags.
Keep in mind that this plugin is for previewing what comments will look like and should not be used as validation! Contact form for your website. In this tutorial we show how-to create a modern contact form using a lightbox and jQuery.
The form is linked by a simple text link and opens in the Lightbox where all form handling, including reCAPTCHA validations, are processed by PHP and the jQuery Ajax function. After the form submission was successful we are using the PHP Class script PHPMailer to send the message via SMTP. There are many people having problems using the “lightbox” together with jQuery. We’re using the thickbox instead, a jQuery plugin which works perfect for most websites. These days it’s very hard to prevent your e-mail box against spam if you like to get in touch with your website’s visitors. Previous Tutorials we have used for this application Create custom reCAPTCHA images using their API We use the reCAPTCHA API to create a user validation image to protect the form against spam attacks.
Next we use the Ajax function from jQuery to send the form variables to our PHP e-mail script. Thickbox jQuery (lightbox) Plugin.