JQuery Lookup plugin ...

I thank myself for being a software developer as there are many things that are interesting and one such a thing is JQuery. I had posted a couple of items on JQuery in the past and here is one in that list.

Quite often, in web applications, there is a requirement to present a list of options that a user can select from and the UI for these options has evolved over a period of time. The most common UI being a dropdown list with a single column while it can be as complex as a dropdown list with a table in it.

Here in this post, I try to cover an option where the choices are presented in a table inside a popup. Selecting a row in the table and clicking submit posts the selected item back to the calling page.

I discussed this with one of my colleagues (Jwala) and we came up with a Jquery plugin that's customizable and follows the "Write less, do more" paradigm ;)

Here are a couple of screenshots that best explain the scenario as well as the implementation:

Fig 1: A simple form with three fields and two look up buttons

Fig 2: Pop up that is displayed when the lookup button is clicked

Fig 3: The calling form is populated with values from the selection in the popup.
The source code for this POC is available for download here.