INDEX
1. Creating Toolbars
2. Distributing Toolbars
3. Reference
4. Tutorial
First Button
Search Box
Dropdown Menu
Search Navigation
Functions
Popup Blocker
Advanced Navigation
Search History
Importing Data
Links
Browser Control
Timers
 
INDEX
1. Creating Toolbars
2. Distributing Toolbars
3. Reference
4. Tutorial
First Button
Search Box
Dropdown Menu
Search Navigation
Functions
Popup Blocker
Advanced Navigation
Search History
Importing Data
Links
Browser Control
Timers

Toolbar Tutorial - Adding a Search Box

Next we will add a dropdown combo box, and a search button. This will provide basic functionality to search the download.com site from our toolbar.

You can test the new functionality by typing in some text and clicking the Search button.
  Next >


Source:

<XML id="toolbar">
<TOOLBAR caption="Toolbar Tutorial">
<control type="toolbar">
<button id="home"

    caption="Download.com: "
    action="http://www.download.com"
    tooltip="Download.com Home Page">

</button>
</control>

<control type="combo" id="query" action="Command(search)" width=120>
</control>

<control type="toolbar">
<button caption="Search" tooltip="Search Download.com" image="http://www.toolbarbrowser.com/img/magnify.ico" action="Command(search)"></button>
</control>


<MENUDEFINITIONS>
</MENUDEFINITIONS>

<COMMANDS>
    <command id="search" action="http://www.download.com/3120-20-0.html?qt=%QUERY%&tg=dl-2001&search.x=17&search.y=2"></command>

</COMMANDS>

</TOOLBAR>
</XML>





Remarks:

  • To simplify the code, we have used the command tag. This enables us to call the search command from both the combo box control (when the returned key is pressed), or when the Search button is clicked.
    To execute the command, we use the Command() function.

  • Note the %_QUERY% variable in the search command URL. The variable is used to reference the current value of the query control, in this case the search box.