Search box with radio option

[dpbhatt_02]

Hi guys, I just want to add search functionality to my website with the options as w3schools forum's search facility.also check this link for the exact idea. please guide me through how to add the options/dropdown selection to the search in any language? (JS, css, jq etc)Thanks in advance!

[justsomeguy]

What exactly do you need help with? The page you linked to is for a Joomla module, are you trying to set this up with Joomla? You can download that module apparently for $30.

[jeffman]

It's hard to guide you without knowing what you know and don't know. At a basic level, you will need to create a button group in HTML. Use CSS to style it, position it, and make it appear and disappear. Any tutorial that shows you how to make a drop-down menu can get you started on this. Processing the button data can happen in the browser or on the server. In the browser, you would use JS to capture the form's submit event and filter the button data. jQuery will simplify all that if you already know jQuery, but if you don't know jQuery, it would make the learning curve more steep. So at a minimum, learn how to: make an HTML button groupstyle the appearance of your button groupuse the CSS position property to take the button group out of the flow and place it below your inputwrite an event handler in JSbind an event handler to your form's submit event Since you're already submitting this to your server, some of the JS work could be done there, assuming you are handling the search with your own code.

Edited June 25, 2013 by Deirdre's Dad

[dpbhatt_02]

What exactly do you need help with? The page you linked to is for a Joomla module, are you trying to set this up with Joomla? You can download that module apparently for $30.

Thanks for the reply and sorry for the complications.well, I am not trying to setup it with joomla, I want to provide a search bar with the options of what the user exactly want to search. For an example, User want to search for the "food" then he has to check the "Food" checkbox and then he can type whatever food he wanted to search. Same way, if user want to search "Food" and/or "Location" then he should check both checkboxes.so, I want to know how to design this functionality for the search bar? I already know the queries and code for the search result but i don't know how to implement the design of search bar with the checkbox option as here in w3schools-forum has provided the search facility with radio buttons at the top-right position. Hope this may clear the question...Thanks. Edited June 26, 2013 by dpbhatt_02

[justsomeguy]

If you look at the code for the search box here, using your browser's developer tools, it looks like is uses a span for a container, which has an input for the search text, and then another span for the topics button and a UL list for the options. I didn't look at the Javascript, but there is some Javascript code to show the styled UL list when you click on the button. The Javascript code to show the list will be similar to Javascript that would show a nav menu or something like that, I'm sure you can find several examples of things like that online. So that uses Javascript to show and hide and list, you can also do a non-Javascript form like the pirate bay or something similar, just a text field with a list of checkboxes or radio buttons. That wouldn't require Javascript. If you want to use Javascript then I would suggest looking for scripts that handle things like dropdowns or nav menus and looking into adapting it for your use.