Nothing to say much, check the image below:

I still receive a good number of hits to my first (10 jQuery Essentials) and second (jQuery Essentials - Round 2) collection of jQuery plugins. So, I have been thinking about making the next post in the series for quite some time. Time has always been the killer of ideas, along with the fact that not too many plugins found way to my list of favorites.

Now that I have some fresh essentials, this post was inevitable.

18. jQuery UI

This is the official big boss with a number of core interactions (drag, dropping, sorting, selecting, resizing) and few great widgets (accordions, date pickers, dialogs, sliders, tabs) built on top of those. Although its a great collection, I somehow haven’t been able to use it in any real projects yet. It seems small plugins always get a favor than big collections

19. Facebox

This is a cute, little plugin that shows Facebook style dialog boxes using jQuery. It supports nearly all the possible contents you might want to show in a dialog box: image, div, remote pages. It has both automatic behavior and manual invoking. Simple and fun to me.

20. Pagination

Although we generate pagination mostly from back-end and display them in our pages, sometimes AJAX paginations are needed. This plugin outputs a superb pagination display to be used in such cases. If you know the usability issues regarding pagination and can distinguish between bad and good paginations, then you’ll find that this one has all the good in it. Check out their demo to know what I mean.

21. Ingrid, the jQuery Datagrid

“Datagrids don’t have to be difficult to use anymore - say hi to Ingrid. Ingrid is an unobtrusive jQuery component that adds Data Grid behaviors (column resizing, paging, sorting, row and column styling, and more) to your tables.” - I can’t agree more on their say. It’s truly an excellent implementation of grid. And it makes conversion of normal tables to grids very easy.

22. jQuery Youtube

If you have any need to retrieve and show Youtube videos in your site, this plugin will be a life-saver. Specify a few properties and this plugin will fetch the videos utilizing the new GData API from Google. And the author makes an unique display of the thumbnails, but combining it with BlockUI - so when you click on a retrieved video, you have it in a modal for preview.

23. Coda Slider

I am a huge fan of Coda Slider. It’s a slider plugin for jQuery and is much better than many other sliders out there. It has a pile of properties and display options to play with. I have been able to customize and use it in every possible need, so there is a chance it helps you out also. Supports custom height, width, tabs on top/bottom, without tabs, custom arrows, … and a lot more.

24. jQuery Lightbox

The prototyped lightbox was very popular and I used it in a couple occasions. But since I’ve switched to jQuery, I hardly found any replacement for that. Thickbox and a couple other tried (and they were very good implementation), but couldn’t make me feel the same way. Suddenly I found this one and I knew its the one. A one-liner implementation and all the features from my previous fav is back. It has a number of customization also, if you need to modify the way it behaves.

25. Auto Completer

Auto-completes have been there and I mentioned some great ones in my previous posts, but this one has also captured my attention and I like it very much. The author has gone a few extra miles and has explained the inner workings of the plugin. But if you just want to try it out, you can check the demo.

Categorized jQuery Essentials

A lot of people have asked me to categorize the posts so that it’s easy to pick for them. I waited for this post before doing that so I will do a categorized post of the cumulative list of plugins from the 3 posts in the series.

Happy jQuery !

AJAX has become the core component of many web applications around us. And its fairly easy to handle AJAX now a days, with the help of various javascript libraries (ex: jQuery, Prototype, Mootools, YUI, etc). But there is one security issue that web browsers impose in doing AJAX calls - they don’t let you do AJAX calls in web servers different than yours. That means, if your script is in www.mydomain.com and you’re trying to do AJAX call to www.anotherdomain.com/get.php, then the browser will through error like: “Error: uncaught exception: Permission denied to call method XMLHttpRequest.open”.

Now, there are a number of solutions to this problem. Instead of explaining them all to you, lemme provide you the simplest one: using a PHP transport file. If you already know the thing and just need the script, download from here.

Others, let’s see an example implementation first.

Example use

   1: xmlHttp.onreadystatechange=function()

   2: {

   3:     if(xmlHttp.readyState==4)

   4:     {

   5:         alert(xmlHttp.responseText);

   6:     }

   7: }

   8:  

   9: xmlHttp.open(“GET”, ‘http://myserver.com/transport.php?action=’ + 

  10:                     urlencode(‘different-server.com/return_call.php’) +

  11:                     ‘&method=get&data1=101&data2=pass’, true );

  12:  

  13: xmlHttp.send(null);

Now, lets see how it works:

1. The script makes an AJAX call to the myserver.com/transport.php with a few parameters:
   • action = the target URL you need to fetch, from a different domain
   • method = the HTTP method (post/get)
   • data1, data2 = sample parameters for using as either query-string or POST fields
2. When the request is received by transport.php, it uses cURL to make a call to the page mentioned in action.
3. Based on the method, it either makes a GET request or a POST request. In both cases, it sends the extra parameters that are sent.
4. After the response is received, transport.php echoes it. So, you have what you need!

Download

transport.php Cross-Domain AJAX call transporter. Downloaded: 811 times

Comments and suggestions are most welcomed

I have been feeling the need of a business PDA for the last couple months, but couldn’t find one that would balance both my desire of functionality and the budget constraint. I wanted to keep my schedule handy, arrange my daily tasks properly, listen to music on the go, browse internet and read emails, use standard phone functionalities and take occasional photos - a lot to ask from a PDA. With all these features combined, the available PDAs in the market was hitting 50K BDT in price - something way over my budget. So, I was a bit disappointed.

Then a few weeks back, one of my junior friends Abir, knocked me in IM and asked whether I am interested in buying a PDA that has not been used much and in great condition. He mentioned that it has camera, phone, and PDA functions - so I didn’t hesitate much and asked for the model he had - it was i-mate™ PDA2k. After a quick review over the internet, i realized that its the perfect combination I was looking for! I asked for the price and for a surprising 20K BDT, i got that beautiful piece in my hand today!

For the technology lovers, here goes the spec from the manufacturer:

• Platform - Windows Mobile™ Pocket PC 2003 Phone Edition Software (GSM/GPRS).
• Display - 3.5”, Transflective TFT-LCD 240 x 320 pixels, 64K Color
• Processor - Intel XScale, 400 MHz
• Memory - 64/128 MB ROM/RAM
• Internal antenna, Quad-band, GSM/GPRS 850/900/1800/1900
• GPRS class B, multi-slot class 10; Codec - AMR/EFR/FR/HR
• Bluetooth, Integrated WLAN 802.11b
• Camera -Color CMOS VGA (640×480) camera/ flash light
• Keyboard- Integrated 39-key QWERTY keyboard
• Infrared - IrDA SIR/ USB slave 1.1
• Expansion- MMC/SDIO

I have high hope that it will be serving me with the functions i desire most !

This is a wrapper HTTP class that uses either cURL or fsockopen to harvest resources from the web. It supports a handy subset of functionalists of HTTP that are mostly needed in day to day coding. Scripts who need to communicate with other servers will find it useful. If you’re looking to invoke any RESTful API and don’t want to bother adding a bunch of libraries for that simple thing, just put this class and you’re set.

Detailed documentation can be found here. And you can download the source from here.

UPDATE: Class added in Orchid - “PHP framwork for the rest of us”

Features

• Can use both cURL and fsockopen.
• Degrades to fsockopen if cURL not enabled.
• Supports HTTP Basic authentication.
• Supports defining custom request headers.
• Supports defining connection timeout values.
• Supports defining user agent and referral values.
• Supports both user-defined and persistent cookies.
• Supports secure connections (HTTPS) with and without cURL.
• Supports adding requests parameters for both GET and POST.
• Supports automatic redirection (maximum redirect can be defined).
• Returns HTTP response headers and response body data separately.

Example 1 - Simple Get (Facebook Application List)

   1: <?php

   2:  

   3: include_once(‘class.http.php’);

   4:  

   5: $http = new Http();

   6:  

   7: $http->execute(‘http://www.facebook.com/apps/index.php?sort=6′);

   8: echo ($http->error) ? $http->error : $http->result;

   9:  

  10: ?>

Example 2 - Invoking Yahoo Term Extraction API

   1: <?php

   2:  

   3: include_once(‘class.http.php’);

   4:  

   5: $http = new Http();

   6:  

   7: $http->addParam(‘appid’   , ‘a_really_random_yahoo_app_id’);

   8: $http->addParam(‘context’ , ‘I am happy because I bought a new car’);

   9: $http->addParam(‘output’  , ‘xml’);

  10:                         

  11: $http->execute(‘http://search.yahooapis.com/ContentAnalysisService/V1/termExtraction’);

  12: echo ($http->error) ? $http->error : $http->result;

  13:  

  14: ?>

Example 3 - Logging into Basecamp (without using cURL!)

   1: <?php

   2:  

   3: include_once(‘class.http.php’);

   4:  

   5: $http = new Http();

   6:  

   7: $http->useCurl(false);

   8: $http->setMethod(‘POST’);

   9:  

  10: $http->addParam(‘user_name’, ‘emran’);

  11: $http->addParam(‘password’, ‘hasan’);

  12:  

  13: $http->setReferrer(‘https://someproject.projectpath.com/login’);

  14: $http->execute(‘https://someproject.projectpath.com/login/authenticate’);

  15:  

  16: echo ($http->error) ? $http->error : $http->result;

  17:  

  18: ?>

Example 4 - Getting a protected feed

   1: <?php

   2:  

   3: include_once(‘class.http.php’);

   4:  

   5: $http = new Http();

   6: $http->setAuth(‘emran’, ‘hasan’);

   7:  

   8: $http->execute(‘http://www.someblog.com/protected/feed.xml’);

   9: echo ($http->error) ? $http->error : $http->result;

  10:  

  11: ?>

Download

class.http.php HTTP Class for PHP (supports both cURL and fsockopen) Downloaded: 992 times