DIV content from document.getElement call DISAPPEARS
Hi everyone, newbie here.
I'm really close to finishing my zip code search filter thingy to return a specific message (ultimately a unique phone number for sales contact) after a form query (of sorts) submission.
I can get a unique result, but I want that result to write into a specific <div> tag.
I can now get the unique result to write into the <div> tag area, but the resulting content immediately disappears, and the original <div> tag content, or status, returns.
I'm pulling my hair out over this. How can I keep my new content that has been written by:
document.getElementById("resultshere").innerHTML = output;
to stay visible with the targeted <div>?
Or... maybe there is a better way of doing what I'm trying,
See the code below for the final working code I'm stuck at. Currently most if statements are using a document.write, but I ultimately want to call, use, the document.getElementById("resultshere").innerHTML to return the results I envision for each if occurence.
*Note, use the zip codes listed in the code below to test the functions, if you enter any zip code not listed then the document.getElementById("resultshere").innerHTML is called and you'll be able to see my problem.
Thanks for any and all help, best regards
Geoff
-------------------------------------code below-----------------------------------
<style type="text/css">
.demo {
color:#000033;
layer-background-color:#cccccc;
position:absolute;
top:90px;
left:40px;
width:350;
height:150;
z-index:80;
visibility:visible;
background-color: #FFCC99;
font-size: 13px; line-height: 17px; text-decoration: none; color: #003399;
font-family: Arial, Helvetica, sans-serif; font-weight: bold; padding-left:20; padding-top:20
}
.demo2 {color:#000033; background-color:#eeeeee; layer-background-color:#cccccc;
position:absolute; top:210; left:1px; width:832px; height:280px;
z-index:81; visibility:hidden;}
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function checkZip()
{
var north = new String("92617,90620,90621,90623,90630,90631,90638,90680,90 720,90740,90742,90743,92602,92603,92604,92606,9261 0,92612,92614,92618,92620,92624,92625,92626,92629, 92630,92637,92646,92647,92648,92649,92651,92653,92 655,92656,92657,92660,92661,92662,92663,92672,9267 3,92675,92676,92677,92679,92683,92688,92691,92692, 92694,92701,92703,92704,92705,92706,92707,92708,92 627,92780,92782,92801,92802,92804,92805,92806,9280 7,92808,92821,92821,92823,92831,92832,92833,92835, 92840,92841,92842,92843,92844,92845,92861,92865,92 866,92867,92868,92869,92870,92886,92887");
var south = new String("90603,90604,90703,90803,91709,91765,92879,92880,92 881,92882,92883,90815,91709,91710,92505");
var central = new String("90701,90705,90712,90713,90716,90755,90802,90804,90 805,90806,90807,90808,90813,90814,90815,90840,9171 0,91761,91766,91789,92503,92505,92860");
var coastal = new String("80701,80705");
var zipcode = document.zipform.zip.value;
var resultshere = document.getElementById("resultshere");
if(zipcode == "")
{
alert("You must enter a zip code.");
return false;
}
if(north.search(zipcode) != -1)
{
document.write ("You searched for " + "" + zipcode +", "+"HEY NORTH RESULTS!");
return true;
}
if(south.search(zipcode) != -1)
{
document.write ("You searched for " + "" + zipcode +", "+"HEY SOUTH RESULTS!");
return true;
}
if(central.search(zipcode) != -1)
{
document.write ("You searched for " + "" + zipcode +", "+"HEY CENTRAL RESULTS!");
return true;
}
if(coastal.search(zipcode) != -1)
{
document.write ("You searched for " + "" + zipcode +", "+"HEY COASTAL RESULTS!");
return true;
}
var Output = "No phone numbers are located for the zip code ";
Output += zipcode;
document.getElementById("resultshere").innerHTML = Output;
}
//-->
<!--this function below is to test that the idea is workable some what-->
function GetLucky()
{
var TheDate = new Date();
var LuckyNumber = Math.floor((99999 - 11111 + 1) * Math.random() + 11111);
var Output2 = "Your lucky number for ";
Output2 += TheDate.toLocaleDateString();
Output2 += " is <b>" + LuckyNumber + "</b>.";
document.getElementById("resultshere").innerHTML = Output2;
}
</script>
<input type="button" value="Lucky Number" onclick="GetLucky()"/>
<form method="get" name="zipform" >
<input name="zip" type="text" size="10" maxlength="5">
<input type="submit" name="Submit" value="Submit" onclick="checkZip()">
</form>
<div id="resultshere" class="demo">Here go the results</div>
CSS Codes
Reply With Quote
Bookmarks