O'Reilly logo

Mastering jQuery UI by Vijay Joshi

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a widget to search data in a table

The searchable widget will insert a new row at the beginning of the table element. Inside this row, there will be a td element that will have a label and a textbox for searching.

For the markup on the HTML page, we will only need a table with some rows.

Writing markup for the table

The entire markup will be written inside the search.html file. We will create a table with three columns. The first column will be the serial number, the second column will be the name of a place, and the third column will have comma-separated tags related to that place. To create such a table, open the search.html file and write the following code to create a regular HTML table:

<html> <head> <title>Searchable Widget</title> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required