I’ve been handed what appeared at first glance to be a trivial job. One of the management wants to have a text entry box on the home page into which he can type a model number – e.g., SSO-742-4P – hit return, and go to that page, with no intervening or additional steps required.
1.
This has to be done in JavaScript plus CSS plus HTML.
Note that the model #’s have no necessary resemblance to the webpage filenames. Imagine an array of about 600 items, in which every other entry is either a model# or a filename.
Fortunately, I already have the data in the form of such an array, altho the entries are in reverse order – filename1, model#1, … filenamen, model#n.
The data exists in an external JavaScript file and is used for a drop-down selector. Most of the pages depend heavily on JavaScript document.write, as there is a consistent set of large display html chunks shared by dozens or hundreds of pages. Using the existing array will reduce bandwidth load significantly.
So, imagine a little text-entry box, probably a form, into which you type in a model # and immediately go to the page corresponding to it. No PHP, server-side, etc., allowed.
Oh, and in the SAME window!!!
I’m pretty good at hacking, so if I can see a working example that does more than this, I can probably pare and slice down to what I need. Like I said, this seemed like a trivial job until I tried to do it. I was handed examples or partially coded sections that opened new windows or required a check-off on an alert, or wanted the data to be stuck into the html as DIVs with IDs, which would be the search key. None of which ultimately worked.
Thanks for any help.
<i>
</i><script link="file.js" type="text/javascript">
function find_page()
{
var i=0;
for (i; i<myarray.length(); i+2)
{
if (document.getElementById('search_text').value == myarray[i])
{
window.location = myarray[i+1];
}
}
alert('There is no such file. Please try again.');
}
</script>
[code=php]<script type="text/javascript">
<!--
myarray=new Array()
myarray[0]=["file1.htm","#1"]
myarray[1]=["file2.htm","#2"]
myarray[2]=["file3.htm","#3"]
myarray[3]=["file4.htm","#4"]
function find_page(){
found=0
for (i=0; i<myarray.length; i++){
if (document.getElementById('search_text').value == myarray[i][1]){
found=1
window.location = myarray[i][0]
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
}
//-->
</script>
<input type="text" name="search_text" id="search_text">
<input type="button" value="Click" onclick="find_page()">[/code]
I think you need it this way
[code=php]<script type="text/javascript">
[/QUOTE]
<!--
myarray=new Array()
myarray[0]=["file1.htm","#1"]
myarray[1]=["file2.htm","#2"]
myarray[2]=["file3.htm","#3"]
myarray[3]=["file4.htm","#4"]
function find_page(){
found=0
for (i=0; i<myarray.length; i++){
if (document.getElementById('search_text').value == myarray[i][1]){
found=1
window.location = myarray[i][0]
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
}
//-->
</script>
<input type="text" name="search_text" id="search_text">
<input type="button" value="Click" onclick="find_page()">[/code]
3. Fortunately, I already have the data in the form of such an array, altho the entries are in reverse order - filename1, model#1, ... filenamen, model#n.[/QUOTE]
<body>
<form onsubmit="find_page(model.value);" action="#">
<label for="model">Model #:</label>
<input type="text" id="model">
<input type="submit" value="Go" >
</form>
</body>
[code=php]
<HTML>
<HEAD>
<TITLE>Document Title</TITLE>
</HEAD>
<BODY>
<script type="text/javascript">
<!--
var Models = new Array("page1.htm", "Model1", "page2.htm", "Model2", "page3.htm", "Model3", "page4.htm", "Model4")
function find_page(){
found=0
for (i=0; i<Models.length; i++){
if(document.getElementById('search_text').value.toLowerCase() == Models[i].toLowerCase()){
found=1
//window.location = Models[i-1]
alert(Models[i-1] ) // for testing purposes
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
}
//-->
</script>
<input type="text" name="search_text" id="search_text">
<input type="button" value="Click" onclick="find_page()">
</BODY>
</HTML>
[/code]
<i>
</i><HTML>
<HEAD>
<TITLE>Document Title</TITLE>
</HEAD>
<BODY>
<script type="text/javascript">
<!--
var Models = new Array("page1.htm", "Model1", "page2.htm", "Model2", "page3.htm", "Model3", "page4.htm", "Model4")
function valid_array() //Checks to see if every even element is a valid webpage extension.
{
var mystring = "";
for (i=0; i<Models.length; i+2){
mystring = Models[i].charAt(Models[i].length()-4) + Models[i].charAt(Models[i].length()-3) + Models[i].charAt(Models[i].length()-2) + Models[i].charAt(Models[i].length()-1);
if ((mystring!= "html") || (mystring != ".asp") || (mystring != ".php") || (mystring != ".htm"))
{ return false;}
}
return true;
}
function find_page(){
if (valid_array() == "false")
{
alert('Your array does not fully comply with your desired format.");
}
else
{
found=0
for (i=1; i<Models.length; i+2){
if(document.getElementById('search_text').value.toLowerCase() == Models[i].toLowerCase()){
found=1
//window.location = Models[i-1]
alert(Models[i-1] ) // for testing purposes
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
}
}
//-->
</script>
<input type="text" name="search_text" id="search_text">
<input type="button" value="Click" onclick="find_page()">
</BODY>
</HTML>
Loops normally go like this
for(var i; i<;myarray.length; i++)
not
var i=0
for(i; i<myarray.length; i++)
[/QUOTE]
<i>
</i><script link="file.js" type="text/javascript">
function find_page()
{
var i=0;
for (i; i<myarray.length; i+2)
{
if (document.getElementById('search_text').value == myarray[i])
{
window.location = myarray[i+1];
}
else{
alert('There is no such file. Please try again.');
}
}
}
</script>
<i>
</i>var here = ar[i-1];
alert(here + " is the new address.");
window.location.href = here;
alert("But " + window.location+" is the actual location.");
<i>
</i><html>
<head>
<title>JS Search</title>
<script type="text/javascript">
var ar = new Array("page1.htm", "Model1", "page2.htm", "Model2", "page3.htm", "Model3");
function find_page()
{
var i;
for (i=0; i<ar.length; i++)
{
if (document.getElementById('model').value == ar[i])
{
var here = ar[i-1];
window.location.href=here;
}
else if (i == (ar.length-1))
{
alert('No such file found');
}
}
}
</script>
</head>
<body>
<form>
<input type="text" name="model" id="model" value="">
<input type="button" name="go" id="go" value="Go" onClick="find_page()">
</form>
</body>
</html>
<i>
</i><HTML>
<HEAD>
<TITLE>Document Title</TITLE>
<script type="text/javascript">
<!--
var Models = new Array("Page1.htm", "Model1", "Page2.htm", "Model2", "Page3.htm", "Model3");
function find_page(){
var found=0;
var i;
for (i=0; i<Models.length; i++){
if(document.getElementById('search_text').value == Models[i]){
found=1;
window.location = Models[i-1];
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
}
//-->
</script>
</head>
<body>
<form>
<input type="text" name="search_text" id="search_text">
<input type="button" value="Go" onclick="find_page()">
</form>
</BODY>
</HTML>
[code=php]
<HTML>
<HEAD>
<TITLE>Document Title</TITLE>
<script type="text/javascript">
<!--
var Models = new Array("Page1.htm", "Model1", "Page2.htm", "Model2", "Page3.htm", "Model3");
function find_page(){
var found=0;
for (var i=0; i<Models.length; i++){
if(document.getElementById('model').value.toLowerCase() == Models[i].toLowerCase()){
found=1;
window.location = Models[i-1];
}
}
if(found==0){
alert('There is no such file. Please try again.');
}
return false
}
//-->
</script>
</head>
<body>
<form onsubmit="return find_page()">
<label for="model">Model #:</label>
<input type="text" id="model">
<input type="submit" value="Go" >
</form>
</BODY>
</HTML>
[/code]
0.1.9 — BETA 5.17