Help with advanced search form.

Busek

04-20-2005, 05:26 PM

Hi, i'm wondering how to do this:

1. Heres a form and when i press the submit button (search) it will change to another value. I've already tried onclick="document.search.submit.value='Now Searching...'"> but because of the frames i'm using the text will always remain as the new value (Seach -> Now Searching...). Is it possible that the value is reset after, lets say 2 seconds?

2. While in the new value (Now Searching...) is shown and I press it again an alert pops up that says: Now searching, please be patient. Of course after those two seconds when the value is only "search" again that alert shouldn't pop up.

3. If the option-value is selected as "code" only numbers can be entered (if letters then alert)

Heres the code I use that i want to modify..

<script language="JavaScript" type="text/javascript">

function form_validator(theForm) {

if(theForm.searchstring.value == "") {
alert("The form i empty!");
theForm.searchstring.focus();

return(false);
}
return (true);
}
</script>

<form name="search" onsubmit="return form_validator(this)" method="post" target="main" action="search_list.asp">

<select name="chose" class="select">
<option selected value="item">Search</option>
<option value="item">-------------------</option>
<option value="code">Code</option>
<option value="item">Item</option>
<option value="text">Text</option>
</select>

<input type="text" name="searchstring" value="" size="15" class="search">
<input name="submit" type="submit" value=" Search ">
</form>

I understand if this will be difficult. But thanks anyway for trying, appreciate it.

/ Matt

hemebond

04-20-2005, 10:11 PM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>57386</title>
</head>
<body>
<form name="search" method="post" action="search_list.asp" onsubmit="return formValidator(this)">
<fieldset>
<legend>Search</legend>
<select id="searchtype" name="chose">
<option selected value="item">Search</option>
<option value="code">Code</option>
<option value="item">Item</option>
<option value="text">Text</option>
</select>
<input id="searchstring" name="searchstring" type="text" size="15" value="">
<input id="submit" type="submit" value="Search">
</fieldset>
</form>

<iframe id="frame"></iframe>

<script type="text/javascript">
function formValidator(theForm)
{
if(document.getElementById('searchstring').value == '')
{
theForm.searchstring.focus();
return false;
}

if(document.getElementById('searchtype').value == 'code' && document.getElementById('searchstring').value.search(/[a-zA-Z]/gi) != -1)
{
alert('Codes must only contain numbers');
return false;
}

if(document.getElementById('submit').value != 'Search')
{
alert('Now searching, please be patient');
return false;
}

document.getElementById('submit').value = 'Now searching...';
window.setTimeout(resetSubmitText, 2000);

return true;
}

function resetSubmitText()
{
document.getElementById('submit').value = 'Search';
}
</script>
</body>
</html>

Busek

04-21-2005, 12:19 PM

thank you very much, thats exactly how I wanted it! You are seriously the best JS programmer I've ever seen. great dude.

ok I just need one more thing... if the searchstring contains 3 or less letters/numbers then alert because of short lenght. (Minimum 3)

EDIT***

Never mind, figured it out :P

if (document.getElementById('searchstring').value.length < 3)
{
alert("Please enter at least 3 characters");
theForm.searchstring.focus();
return false;
}