ScrabbleKing
Programmer
I am trying to get the list of options to the cooresponding engine centered below the text box. Then, center the list of engines below that. What should happen is that the options change whenever the engine selection is changed (without having to do an actual search). When a search is executed, it will execute according to the selected option and engine.
Could someone please help with displaying the options and engines properly and the search execution?
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Search Example</title>
<script language="Javascript" type="text/javascript">
function add_radio_buttons()
{
var google_options = new Array( "Web" , "Images" , "Video" , "News");
var google_actions = new Array( " , " , " , "
var google_variants = new Array(google_options , google_actions);
var yahoo_options = new Array( "Web" , "Images" , "Video" , "Shopping");
var yahoo_actions = new Array( " , " , " , "
var yahoo_variants = new Array(yahoo_options , yahoo_actions);
var metacrawler_options = new Array( "Web" , "Images" , "Audio" , "Video" , "Shopping");
var metacrawler_actions = new Array( " , " , " , " , "
var metacrawler_variants = new Array(metacrawler_options , metacrawler_actions);
var google = new Array("Google" , google_variants);
var yahoo = new Array("Yahoo" , yahoo_variants);
var metacrawler = new Array("Metacrawler" , metacrawler_variants);
var engines = new Array(google , yahoo , metacrawler);// A naming array.
var buttons = new Array();//An array for the three radio buttons of each search engine.
for(var button_index = 0; button_index < 3; button_index++)// Add the type, name, and value attributes.
{
buttons[button_index] = document.createElement('input');// Make a new input element
buttons[button_index].setAttribute('value' , engines[button_index][0].charAt(0).toLowerCase());// Then give it a value.
buttons[button_index].setAttribute('id' , engines[button_index][0].charAt(0).toLowerCase());// Then give it an ID.
buttons[button_index].setAttribute('name' , 'engine');// Then give it a name.
buttons[button_index].setAttribute('type' , 'radio');// Then set the type.
}
var queryform = document.getElementById('qform');// A handy pointer to the form.
var engines_division = queryform.appendChild(document.createElement('div'));// Make a division to stick the radio buttons for each engine into.
engines_division.setAttribute('id' , 'engines');// Then give it an ID.
var i = 0;
while(i < 3)
{// Add the radio buttons to the bottom part of the form.
var current_label = document.createElement('label');// Make a label for each radio button.
current_label.appendChild(buttons);// Then add the button to the label.
current_label.appendChild(document.createTextNode(engines[0] + ' '));// Then add descriptions for the buttons.
engines_division.appendChild(current_label);// Then add the label to the form.
i++;
}
var engine_specific_options_division = queryform.insertBefore(document.createElement('div') , queryform.firstChild);// Add a place to chuck in the engine specific options.
engine_specific_options_division.setAttribute('id' , 'esod');// Then give it an id.
queryform.g.checked = true;// Check the Google option by default.
}
function change_variant()
{
}
</script>
</head>
<body onload="add_radio_buttons()">
<div style="text-align:center">
<form method="get" action=" name="qform" id="qform">
<input name="hl" type="hidden" value="en">
<input maxlength="2048" name="q" size="55" title="Search string" value="">
<input name="btnG" type="submit" value="Search">
</form>
</div>
</body>
</html>
Could someone please help with displaying the options and engines properly and the search execution?
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Search Example</title>
<script language="Javascript" type="text/javascript">
function add_radio_buttons()
{
var google_options = new Array( "Web" , "Images" , "Video" , "News");
var google_actions = new Array( " , " , " , "
var google_variants = new Array(google_options , google_actions);
var yahoo_options = new Array( "Web" , "Images" , "Video" , "Shopping");
var yahoo_actions = new Array( " , " , " , "
var yahoo_variants = new Array(yahoo_options , yahoo_actions);
var metacrawler_options = new Array( "Web" , "Images" , "Audio" , "Video" , "Shopping");
var metacrawler_actions = new Array( " , " , " , " , "
var metacrawler_variants = new Array(metacrawler_options , metacrawler_actions);
var google = new Array("Google" , google_variants);
var yahoo = new Array("Yahoo" , yahoo_variants);
var metacrawler = new Array("Metacrawler" , metacrawler_variants);
var engines = new Array(google , yahoo , metacrawler);// A naming array.
var buttons = new Array();//An array for the three radio buttons of each search engine.
for(var button_index = 0; button_index < 3; button_index++)// Add the type, name, and value attributes.
{
buttons[button_index] = document.createElement('input');// Make a new input element
buttons[button_index].setAttribute('value' , engines[button_index][0].charAt(0).toLowerCase());// Then give it a value.
buttons[button_index].setAttribute('id' , engines[button_index][0].charAt(0).toLowerCase());// Then give it an ID.
buttons[button_index].setAttribute('name' , 'engine');// Then give it a name.
buttons[button_index].setAttribute('type' , 'radio');// Then set the type.
}
var queryform = document.getElementById('qform');// A handy pointer to the form.
var engines_division = queryform.appendChild(document.createElement('div'));// Make a division to stick the radio buttons for each engine into.
engines_division.setAttribute('id' , 'engines');// Then give it an ID.
var i = 0;
while(i < 3)
{// Add the radio buttons to the bottom part of the form.
var current_label = document.createElement('label');// Make a label for each radio button.
current_label.appendChild(buttons);// Then add the button to the label.
current_label.appendChild(document.createTextNode(engines[0] + ' '));// Then add descriptions for the buttons.
engines_division.appendChild(current_label);// Then add the label to the form.
i++;
}
var engine_specific_options_division = queryform.insertBefore(document.createElement('div') , queryform.firstChild);// Add a place to chuck in the engine specific options.
engine_specific_options_division.setAttribute('id' , 'esod');// Then give it an id.
queryform.g.checked = true;// Check the Google option by default.
}
function change_variant()
{
}
</script>
</head>
<body onload="add_radio_buttons()">
<div style="text-align:center">
<form method="get" action=" name="qform" id="qform">
<input name="hl" type="hidden" value="en">
<input maxlength="2048" name="q" size="55" title="Search string" value="">
<input name="btnG" type="submit" value="Search">
</form>
</div>
</body>
</html>
