This quick tutorial assumes that you already have jquery.js setup. Here are the instructions:
- Create a div with a table name the identify the div with a class “ex. datatable”
<table cellspacing="0" width="100%"> <tr> <td>1234</td><td>Apple</td> </tr> <tr> <td>1111</td><td>Cat</td> </tr> <tr> <td>5555</td><td>Dog</td> </tr> </table>
- Include of course jquery.js and jquery.multicolselect.js
- Put this as javascript
$('.datatable').multicolselect({ buttonImage:"selectbutton.gif", selectedID:"test2", eqVisible:1, eqHidden:0 });
- Note you need the “selectbutton.gif”. You can get a screenshot of the original Windows dropdown and then use Photoshop to crop it and save it as selectbutton.gif
- Then your done.
Thanks to Jack for this tutorial. He found it here.
Why no links to the plugin code or a demo??
@redsquare, I haven’t found the time yet. I am still at work — I will probably come up with something when I’m at home.
But to give you an idea, it is just like a dropdown menu, but with 2 columns.
UPDATE: I have updated the jquerymulticolselect.js to link to the JS file.
Jquery Multi Column Selectbox
http://code.google.com/p/jquerymulticolumnselectbox/