jameswsparker
11-03-2012, 09:14 PM
I've been working on a code where users can search from a dropdown list and select content which would then open a URL in a new window. All is working, EXCEPT I want to be able to manually set the URL for each item in the dropdown list (rather than it just loading from a specific domain).
Below is the code I'd introduced where I was hoping it would allow me to manually set URLs in the dropdown list. Sadly it's not working.
// array of arrays
var functionList = [
[ "name1", "http://url1" ],
[ "name2", "http://url2" ],
];
Can anybody correct my page to run from manually listed URLs please? :confused:
Here is the page code:
<html>
<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Grabber</title>
</head>
<body OnLoad=" document.form.functioninput.focus()" oncontextmenu="return false;" link="#000000" vlink="#000000" alink="#808080" style="font-family: Arial; color: #000000; font-size: 10pt" bgcolor="#CCCCCC" topmargin="5" leftmargin="5" rightmargin="5" bottommargin="5">
<form name="form" onSubmit="handleSelectClick();return false;" action="#">
<p>
<input onKeyUp="handleKeyUp(500);" type="text" name="functioninput" autocomplete=off placeholder="Search for a track" VALUE="" style="font-size:10pt;width:34ex; font-family:Arial; color:#000000; font-weight:bold" size="40"><br>
<select onClick="handleSelectClick();" name="functionselect" id="functionselect" size="20" style="font-size:10pt;width:590;height:384"></select></p>
<table border="0" width="100%">
<tr>
<td align="left" width="150">
<table border="0">
<tr>
<td align="center" width="125">
<p align="left"><label for="contains"><font size="3"><input type="radio" name="functionradio" checked id="contains" onchange="handleKeyUp(20);"></font><font size="2">Containing</font></label></td>
<td align="center" width="125">
<p align="left"><label for="starts"><font size="3"><input type="radio" name="functionradio" id="starts" onchange="handleKeyUp(20);"></font><font size="2">Starting With</font></label></td>
<td align="center" width="125">
<input type="button" onClick="handleKeyUp(5000);" value="List all pages" style="font-family: Arial; "></td>
</tr>
</table>
</div>
</tr>
</table>
</form>
<!-- Contents -->
<!-- When listing files, be sure to remove main directory from title/name -->
<!-- Also assure all files are listed alphabetically from A-Z -->
<script type="text/javascript">
// array of arrays
var functionList = [
[ "name1", "http://url1" ],
[ "name2", "http://url2" ],
];
// This is the function that refreshes the list after a keypress.
// The maximum number to show can be limited to improve performance with
// huge lists (1000s of entries).
// The function clears the list, and then does a linear search through the
// globally defined array and adds the matches back to the list.
function handleKeyUp(maxNumToShow)
{
selectObj = document.forms[0].functionselect;
textObj = document.forms[0].functioninput;
if(document.forms[0].functionradio[1].checked == true)
{
strText = "^"+textObj.value;
}
else
{
strText = textObj.value;
}
var numShown;
re = new RegExp(strText,"gi");
ClearOptionsFast('functionselect');
selectObj = document.forms[0].functionselect;
numShown = 0;
for(i = 0; i < functionList.length; i++)
{
var listEntry = functionList[i];
// for first version above, array of arrays:
if ( listEntry[0].search(re) != -1)
{
selectObj[numShown++] = new Option( listEntry[0], listEntry[1] );
}
if(numShown == maxNumToShow)
{
break;
}
}
if(selectObj.length == 1)
{
selectObj.options[0].selected = true;
}
}
function ClearOptionsFast(id)
{
var selectObj = document.getElementById(id);
var selectParentNode = selectObj.parentNode;
var newSelectObj = selectObj.cloneNode(false); // Make a shallow copy
selectParentNode.replaceChild(newSelectObj, selectObj);
return newSelectObj;
}
// this function gets the selected value and loads the appropriate
// php reference page in the display frame
// it can be modified to perform whatever action is needed, or nothing
function handleSelectClick()
{
selectObj = document.forms[0].functionselect;
textObj = document.forms[0].functioninput;
if(selectObj.selectedIndex == -1) {
return;
}
selectedValue = selectObj.options[selectObj.selectedIndex].text;
selectedValue = selectedValue.replace(/_/g, '-') ;
window.open("http://www.google.co.uk/search?sourceid=chrome&ie=UTF-8&q="+selectedValue, "_blank");
}
function initpage() {
handleKeyUp(18);
document.forms[0].functioninput.focus();
}
</script>
</body>
</html>
Below is the code I'd introduced where I was hoping it would allow me to manually set URLs in the dropdown list. Sadly it's not working.
// array of arrays
var functionList = [
[ "name1", "http://url1" ],
[ "name2", "http://url2" ],
];
Can anybody correct my page to run from manually listed URLs please? :confused:
Here is the page code:
<html>
<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Grabber</title>
</head>
<body OnLoad=" document.form.functioninput.focus()" oncontextmenu="return false;" link="#000000" vlink="#000000" alink="#808080" style="font-family: Arial; color: #000000; font-size: 10pt" bgcolor="#CCCCCC" topmargin="5" leftmargin="5" rightmargin="5" bottommargin="5">
<form name="form" onSubmit="handleSelectClick();return false;" action="#">
<p>
<input onKeyUp="handleKeyUp(500);" type="text" name="functioninput" autocomplete=off placeholder="Search for a track" VALUE="" style="font-size:10pt;width:34ex; font-family:Arial; color:#000000; font-weight:bold" size="40"><br>
<select onClick="handleSelectClick();" name="functionselect" id="functionselect" size="20" style="font-size:10pt;width:590;height:384"></select></p>
<table border="0" width="100%">
<tr>
<td align="left" width="150">
<table border="0">
<tr>
<td align="center" width="125">
<p align="left"><label for="contains"><font size="3"><input type="radio" name="functionradio" checked id="contains" onchange="handleKeyUp(20);"></font><font size="2">Containing</font></label></td>
<td align="center" width="125">
<p align="left"><label for="starts"><font size="3"><input type="radio" name="functionradio" id="starts" onchange="handleKeyUp(20);"></font><font size="2">Starting With</font></label></td>
<td align="center" width="125">
<input type="button" onClick="handleKeyUp(5000);" value="List all pages" style="font-family: Arial; "></td>
</tr>
</table>
</div>
</tr>
</table>
</form>
<!-- Contents -->
<!-- When listing files, be sure to remove main directory from title/name -->
<!-- Also assure all files are listed alphabetically from A-Z -->
<script type="text/javascript">
// array of arrays
var functionList = [
[ "name1", "http://url1" ],
[ "name2", "http://url2" ],
];
// This is the function that refreshes the list after a keypress.
// The maximum number to show can be limited to improve performance with
// huge lists (1000s of entries).
// The function clears the list, and then does a linear search through the
// globally defined array and adds the matches back to the list.
function handleKeyUp(maxNumToShow)
{
selectObj = document.forms[0].functionselect;
textObj = document.forms[0].functioninput;
if(document.forms[0].functionradio[1].checked == true)
{
strText = "^"+textObj.value;
}
else
{
strText = textObj.value;
}
var numShown;
re = new RegExp(strText,"gi");
ClearOptionsFast('functionselect');
selectObj = document.forms[0].functionselect;
numShown = 0;
for(i = 0; i < functionList.length; i++)
{
var listEntry = functionList[i];
// for first version above, array of arrays:
if ( listEntry[0].search(re) != -1)
{
selectObj[numShown++] = new Option( listEntry[0], listEntry[1] );
}
if(numShown == maxNumToShow)
{
break;
}
}
if(selectObj.length == 1)
{
selectObj.options[0].selected = true;
}
}
function ClearOptionsFast(id)
{
var selectObj = document.getElementById(id);
var selectParentNode = selectObj.parentNode;
var newSelectObj = selectObj.cloneNode(false); // Make a shallow copy
selectParentNode.replaceChild(newSelectObj, selectObj);
return newSelectObj;
}
// this function gets the selected value and loads the appropriate
// php reference page in the display frame
// it can be modified to perform whatever action is needed, or nothing
function handleSelectClick()
{
selectObj = document.forms[0].functionselect;
textObj = document.forms[0].functioninput;
if(selectObj.selectedIndex == -1) {
return;
}
selectedValue = selectObj.options[selectObj.selectedIndex].text;
selectedValue = selectedValue.replace(/_/g, '-') ;
window.open("http://www.google.co.uk/search?sourceid=chrome&ie=UTF-8&q="+selectedValue, "_blank");
}
function initpage() {
handleKeyUp(18);
document.forms[0].functioninput.focus();
}
</script>
</body>
</html>