Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations wOOdy-Soft on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

form change color of text if null? 2

Status
Not open for further replies.
bct10

bct10

Technical User
May 3, 2004
37
US
Hi all
I have a from I like to change the color of the text at the top of form if a null is entered

here is the code the * is next to text i went red in null

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>myweather form</title>

<script language="JavaScript">
function Warnings(){

var url1="var url2="/allwarnings.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value
if (where_to == "")
{
alert("select a state")
return
}

else {window.location = url1+where_to+url2;}
}

function Watches(){
var url1="var url2="/watches.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value;

if (where_to == "")
{
alert("select a state")
return
}

else {window.location = url1+where_to+url2;}
}



function statecheck(){
var state = ""
with (document.weatherform.stateselter) {
for (var i=0;i<options.length;i++) {
if (options.getAttribute("name")==state) {
selectedIndex=i;
break;
}
}
}
}






</script>
</head>

<body onLoad="statecheck()">
<div align="center">
<br>
<p align="center"><font size="4"><font color="#0000ff">*select a state.</font></p>
<form name="weatherform">
<select size= 5 name="stateselter">
<OPTION name="" VALUE="">select
<OPTION name="AL" VALUE="al">AL
<OPTION name="AK" VALUE="ak">AK
<OPTION name="AZ" VALUE="az">AZ
<OPTION name="AR" VALUE="ar">AR
<OPTION name="CA" VALUE="ca">CA
<OPTION name="CO" VALUE="co">CO
<OPTION name="CT" VALUE="ct">CT
<OPTION name="DE" VALUE="de">DE
<OPTION name="FL" VALUE="fl">FL
<OPTION name="GA" VALUE="ga">GA
<OPTION name="HI" VALUE="hi">HI
<OPTION name="ID" VALUE="id">ID
<OPTION name="IL" VALUE="il">IL
<OPTION name="IN" VALUE="in">IN
<OPTION name="IA" VALUE="ia">IA
<OPTION name="KS" VALUE="ks">KS
<OPTION name="KY" VALUE="ky">KY
<OPTION name="LA" VALUE="la">LA
<OPTION name="ME" VALUE="me">ME
<OPTION name="MD" VALUE="md">MD
<OPTION name="MA" VALUE="ma">MA
<OPTION name="MI" VALUE="mi">MI
<OPTION name="MN" VALUE="mn">MN
<OPTION name="MS" VALUE="ms">MS
<OPTION name="MO" VALUE="mo">MO
<OPTION name="MT" VALUE="mt">MT
<OPTION name="NE" VALUE="ne">NE
<OPTION name="NV" VALUE="nv">NV
<OPTION name="NH" VALUE="nh">NH
<OPTION name="NJ" VALUE="nj">NJ
<OPTION name="NM" VALUE="nm">NM
<OPTION name="NY" VALUE="ny">NY
<OPTION name="NC" VALUE="nc">NC
<OPTION name="ND" VALUE="nd">ND
<OPTION name="OH" VALUE="oh">OH
<OPTION name="OK" VALUE="ok">OK
<OPTION name="OR" VALUE="or">OR
<OPTION name="PA" VALUE="pa">PA
<OPTION name="PR" VALUE="pr">PR
<OPTION name="RI" VALUE="ri">RI
<OPTION name="SC" VALUE="sc">SC
<OPTION name="SD" VALUE="sd">SD
<OPTION name="TN" VALUE="tn">TN
<OPTION name="TX" VALUE="tx">TX
<OPTION name="UT" VALUE="ut">UT
<OPTION name="VT" VALUE="vt">VT
<OPTION name="VA" VALUE="va">VA
<OPTION name="WA" VALUE="wa">WA
<OPTION name="WV" VALUE="wv">WV
<OPTION name="WI" VALUE="wi">WI
<OPTION name="WY" VALUE="wy">WY
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="Warnings()">
<input type="button" value="Watches" onClick="Watches()">

</form>
</div>



</body>
</html>
 
Sort by date Sort by votes
here is your code, revised to change color to red if user has not selected an option...

i cleaned it up a bit:

Code: 
<html>
<head>
<title>myweather form</title>
<script>
function buttonX(n){
url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
 if (n=='watches') {url2="/allwarnings.html";}
 if (n=='warnings') {url2="/watches.html";}
box=document.weatherform.stateselter;
where_to=box.options[box.options.selectedIndex].value;
 if (where_to == "") {
 alert("select a state");
 document.getElementById('textX').style.color="red";
 return;
 }
 else {window.location = url1+where_to+url2;}
}
function statecheck(){
state="";
 with (document.weatherform.stateselter) {
  for (var i=0;i<options.length;i++) {
   if (options[i].getAttribute("name")==state) {
   selectedIndex=i;
   break;
   }
  }
 }
}
</script>
</head>
<body onLoad="statecheck()">
<div align="center">
<br>
<p align=center><span style="font-size:20;color:0000ff;" id=textX name=textX>*select a state.</span></p>
<form name="weatherform">
<select size=5 name="stateselter">
<OPTION name="" VALUE="">select</option>
<OPTION name="AL" VALUE="al">AL</option>
<OPTION name="AK" VALUE="ak">AK</option>
<OPTION name="AZ" VALUE="az">AZ</option>
<OPTION name="AR" VALUE="ar">AR</option>
<OPTION name="CA" VALUE="ca">CA</option>
<OPTION name="CO" VALUE="co">CO</option>
<OPTION name="CT" VALUE="ct">CT</option>
<OPTION name="DE" VALUE="de">DE</option>
<OPTION name="FL" VALUE="fl">FL</option>
<OPTION name="GA" VALUE="ga">GA</option>
<OPTION name="HI" VALUE="hi">HI</option>
<OPTION name="ID" VALUE="id">ID</option>
<OPTION name="IL" VALUE="il">IL</option>
<OPTION name="IN" VALUE="in">IN</option>
<OPTION name="IA" VALUE="ia">IA</option>
<OPTION name="KS" VALUE="ks">KS</option>
<OPTION name="KY" VALUE="ky">KY</option>
<OPTION name="LA" VALUE="la">LA</option>
<OPTION name="ME" VALUE="me">ME</option>
<OPTION name="MD" VALUE="md">MD</option>
<OPTION name="MA" VALUE="ma">MA</option>
<OPTION name="MI" VALUE="mi">MI</option>
<OPTION name="MN" VALUE="mn">MN</option>
<OPTION name="MS" VALUE="ms">MS</option>
<OPTION name="MO" VALUE="mo">MO</option>
<OPTION name="MT" VALUE="mt">MT</option>
<OPTION name="NE" VALUE="ne">NE</option>
<OPTION name="NV" VALUE="nv">NV</option>
<OPTION name="NH" VALUE="nh">NH</option>
<OPTION name="NJ" VALUE="nj">NJ</option>
<OPTION name="NM" VALUE="nm">NM</option>
<OPTION name="NY" VALUE="ny">NY</option>
<OPTION name="NC" VALUE="nc">NC</option>
<OPTION name="ND" VALUE="nd">ND</option>
<OPTION name="OH" VALUE="oh">OH</option>
<OPTION name="OK" VALUE="ok">OK</option>
<OPTION name="OR" VALUE="or">OR</option>
<OPTION name="PA" VALUE="pa">PA</option>
<OPTION name="PR" VALUE="pr">PR</option>
<OPTION name="RI" VALUE="ri">RI</option>
<OPTION name="SC" VALUE="sc">SC</option>
<OPTION name="SD" VALUE="sd">SD</option>
<OPTION name="TN" VALUE="tn">TN</option>
<OPTION name="TX" VALUE="tx">TX</option>
<OPTION name="UT" VALUE="ut">UT</option>
<OPTION name="VT" VALUE="vt">VT</option>
<OPTION name="VA" VALUE="va">VA</option>
<OPTION name="WA" VALUE="wa">WA</option>
<OPTION name="WV" VALUE="wv">WV</option>
<OPTION name="WI" VALUE="wi">WI</option>
<OPTION name="WY" VALUE="wy">WY</option>
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="buttonX(value)">
<input type="button" value="Watches" onClick="buttonX(value)">
</form>
</div>
</body>
</html>

hope that helps...

- g
 
Upvote 0 Downvote

part II

you have to swap this section out for the previous one:

Code: 
 if (n=='Warnings') {url2="/allwarnings.html";}
 if (n=='Watches') {url2="/watches.html";}

- g
 
Upvote 0 Downvote
bct10,

If I can propose a scheme following more tightly your existing script, and stand-ready for elaboratng. Use class.

[1] Define two classes for the two cases in the head section.
[tt]
<style type="text/css">
.sel {text-align:center;font-size:small;color:#0000FF;}
.nosel {text-align:center;font-size:large;color:#FF0000;} /* or can still keep font-size:small */
</style>
[/tt]
[2] Then give <p> an id and assign the initial nosel class. (Or that assign to it via onload statecheck()).
[tt]
<p id="message" class="nosel">select a state</p>
[/tt]
[3] In Warnings and Watches, add the line for empty string.
[tt]
if (where_to == "") {
alert("select a state")
[blue]document.getElementById("message").className="nosel";[/blue]
return
} else {
window.location = url1+where_to+url2;
[blue]document.getElementById("message").className="sel";[/blue]
}
[/tt]
This way, you can expand the stylistic requirement by modifying at the same place.

regards - tsuji
 
Upvote 0 Downvote
Hi tsuji
i get a error with this code an it turns red null or not what did i do wrong also how wood i add this to the
statecheck()).

here is the code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>myweather form</title>

<style type="text/css">
.sel {text-align:center;font-size:small;color:#0000FF;}
.nosel {text-align:center;font-size:large;color:#FF0000;} /* or can still keep font-size:small */
</style>


<script language="JavaScript">
function Warnings(){

var url1="var url2="/allwarnings.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value
if (where_to == "")
{
alert("select a state")
document.getElementById("message").className="nosel";
return
} else {
{window.location = url1+where_to+url2;}
document.getElementById("message").className="sel";
}

function Watches(){
var url1="var url2="/watches.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value;

if (where_to == "")
{
alert("select a state")
document.getElementById("message").className="nosel";
return
}else{
{window.location = url1+where_to+url2;}
document.getElementById("message").className="sel";
}



function statecheck(){
var state = "FL"
with (document.weatherform.stateselter) {
for (var i=0;i<options.length;i++) {
if (options.getAttribute("name")==state) {
selectedIndex=i;
break;
}
}
}
}






</script>
</head>

<body onLoad="statecheck()">
<div align="center">
<br>
<p id="message" class="nosel">select a state</p>
<form name="weatherform">
<select size= 5 name="stateselter">
<OPTION name="" VALUE="">select
<OPTION name="AL" VALUE="al">AL
<OPTION name="AK" VALUE="ak">AK
<OPTION name="AZ" VALUE="az">AZ
<OPTION name="AR" VALUE="ar">AR
<OPTION name="CA" VALUE="ca">CA
<OPTION name="CO" VALUE="co">CO
<OPTION name="CT" VALUE="ct">CT
<OPTION name="DE" VALUE="de">DE
<OPTION name="FL" VALUE="fl">FL
<OPTION name="GA" VALUE="ga">GA
<OPTION name="HI" VALUE="hi">HI
<OPTION name="ID" VALUE="id">ID
<OPTION name="IL" VALUE="il">IL
<OPTION name="IN" VALUE="in">IN
<OPTION name="IA" VALUE="ia">IA
<OPTION name="KS" VALUE="ks">KS
<OPTION name="KY" VALUE="ky">KY
<OPTION name="LA" VALUE="la">LA
<OPTION name="ME" VALUE="me">ME
<OPTION name="MD" VALUE="md">MD
<OPTION name="MA" VALUE="ma">MA
<OPTION name="MI" VALUE="mi">MI
<OPTION name="MN" VALUE="mn">MN
<OPTION name="MS" VALUE="ms">MS
<OPTION name="MO" VALUE="mo">MO
<OPTION name="MT" VALUE="mt">MT
<OPTION name="NE" VALUE="ne">NE
<OPTION name="NV" VALUE="nv">NV
<OPTION name="NH" VALUE="nh">NH
<OPTION name="NJ" VALUE="nj">NJ
<OPTION name="NM" VALUE="nm">NM
<OPTION name="NY" VALUE="ny">NY
<OPTION name="NC" VALUE="nc">NC
<OPTION name="ND" VALUE="nd">ND
<OPTION name="OH" VALUE="oh">OH
<OPTION name="OK" VALUE="ok">OK
<OPTION name="OR" VALUE="or">OR
<OPTION name="PA" VALUE="pa">PA
<OPTION name="PR" VALUE="pr">PR
<OPTION name="RI" VALUE="ri">RI
<OPTION name="SC" VALUE="sc">SC
<OPTION name="SD" VALUE="sd">SD
<OPTION name="TN" VALUE="tn">TN
<OPTION name="TX" VALUE="tx">TX
<OPTION name="UT" VALUE="ut">UT
<OPTION name="VT" VALUE="vt">VT
<OPTION name="VA" VALUE="va">VA
<OPTION name="WA" VALUE="wa">WA
<OPTION name="WV" VALUE="wv">WV
<OPTION name="WI" VALUE="wi">WI
<OPTION name="WY" VALUE="wy">WY
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="Warnings()">
<input type="button" value="Watches" onClick="Watches()">

</form>
</div>



</body>
</html>
 
Upvote 0 Downvote
bct10,
Just a quick look. It seems the curly bracket positioning in the two functions is not right? Take out the {} surrounding the window.location line?
- tsuji
 
Upvote 0 Downvote
hi tsuji
the error is line 70 char 1
object expected
what should i change
 
Upvote 0 Downvote
bct10,

I don't know what line 70 is. I shouldn't have to relist long irrelevant lines, but if it helps...
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>myweather form</title>
<style type="text/css">
    .sel {text-align:center;font-size:small;color:#0000FF;}
    .nosel {text-align:center;font-size:small;color:#FF0000;}    /* I keep size same, less flickering */
</style>

<script language="JavaScript">
function Warnings(){
var url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
var url2="/allwarnings.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value
if (where_to == "") {
    alert("select a state")
    document.getElementById("message").className="nosel";
    return
} else {
    window.location = url1+where_to+url2;
    document.getElementById("message").className="sel";
}
}

function Watches(){
var url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
var url2="/watches.html"

var box = document.weatherform.stateselter;
var where_to = box.options[box.options.selectedIndex].value;

if (where_to == "") {
    alert("select a state")
    document.getElementById("message").className="nosel";
    return
} else {
    window.location = url1+where_to+url2;
    document.getElementById("message").className="sel";
}
}
function statecheck(){
var state = "FL"

    with (document.weatherform.stateselter) {
        for (var i=0;i<options.length;i++) {
            if (options[i].getAttribute("name")==state) {
                selectedIndex=i;
                break;
            }
        }
        if (selectedIndex == 0) {
            document.getElementById("message").className="nosel";
        } else {
            document.getElementById("message").className="sel";
        }
    }
}
</script>
</head>

<body onLoad="statecheck()">
<div align="center">
<br>

<p id="message">select a state</p>
<form name="weatherform">
<select size= 5 name="stateselter">
<OPTION name="" VALUE="">select
<OPTION name="AL" VALUE="al">AL
<OPTION name="AK" VALUE="ak">AK
<OPTION name="AZ" VALUE="az">AZ
<OPTION name="AR" VALUE="ar">AR
<OPTION name="CA" VALUE="ca">CA
<OPTION name="CO" VALUE="co">CO
<OPTION name="CT" VALUE="ct">CT
<OPTION name="DE" VALUE="de">DE
<OPTION name="FL" VALUE="fl">FL
<OPTION name="GA" VALUE="ga">GA
<OPTION name="HI" VALUE="hi">HI
<OPTION name="ID" VALUE="id">ID
<OPTION name="IL" VALUE="il">IL
<OPTION name="IN" VALUE="in">IN
<OPTION name="IA" VALUE="ia">IA
<OPTION name="KS" VALUE="ks">KS
<OPTION name="KY" VALUE="ky">KY
<OPTION name="LA" VALUE="la">LA
<OPTION name="ME" VALUE="me">ME
<OPTION name="MD" VALUE="md">MD
<OPTION name="MA" VALUE="ma">MA
<OPTION name="MI" VALUE="mi">MI
<OPTION name="MN" VALUE="mn">MN
<OPTION name="MS" VALUE="ms">MS
<OPTION name="MO" VALUE="mo">MO
<OPTION name="MT" VALUE="mt">MT
<OPTION name="NE" VALUE="ne">NE
<OPTION name="NV" VALUE="nv">NV
<OPTION name="NH" VALUE="nh">NH
<OPTION name="NJ" VALUE="nj">NJ
<OPTION name="NM" VALUE="nm">NM
<OPTION name="NY" VALUE="ny">NY
<OPTION name="NC" VALUE="nc">NC
<OPTION name="ND" VALUE="nd">ND
<OPTION name="OH" VALUE="oh">OH
<OPTION name="OK" VALUE="ok">OK
<OPTION name="OR" VALUE="or">OR
<OPTION name="PA" VALUE="pa">PA
<OPTION name="PR" VALUE="pr">PR
<OPTION name="RI" VALUE="ri">RI
<OPTION name="SC" VALUE="sc">SC
<OPTION name="SD" VALUE="sd">SD
<OPTION name="TN" VALUE="tn">TN
<OPTION name="TX" VALUE="tx">TX
<OPTION name="UT" VALUE="ut">UT
<OPTION name="VT" VALUE="vt">VT
<OPTION name="VA" VALUE="va">VA
<OPTION name="WA" VALUE="wa">WA
<OPTION name="WV" VALUE="wv">WV
<OPTION name="WI" VALUE="wi">WI
<OPTION name="WY" VALUE="wy">WY
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="Warnings()">
<input type="button" value="Watches" onClick="Watches()">

</form>
</div>

</body>
</html>
- tsuji
 
Upvote 0 Downvote
i don't understand...with tsuji's example, you have to preselect a state, instead of having it load on 'select'...the code i gave you above:

Code: 
<html>
<head>
<title>myweather form</title>
<script>
function buttonX(n){
url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
 if (n=='Warnings') {url2="/allwarnings.html";}
 if (n=='Watches') {url2="/watches.html";}box=document.weatherform.stateselter;
where_to=box.options[box.options.selectedIndex].value;
 if (where_to == "") {
 alert("select a state");
 document.getElementById('textX').style.color="red";
 return;
 }
 else {window.location = url1+where_to+url2;}
}
function statecheck(){
state="";
 with (document.weatherform.stateselter) {
  for (var i=0;i<options.length;i++) {
   if (options[i].getAttribute("name")==state) {
   selectedIndex=i;
   break;
   }
  }
 }
}
</script>
</head>
<body onLoad="statecheck()">
<div align="center">
<br>
<p align=center><span style="font-size:20;color:0000ff;" id=textX name=textX>*select a state.</span></p>
<form name="weatherform">
<select size=5 name="stateselter">
<OPTION name="" VALUE="">select</option>
<OPTION name="AL" VALUE="al">AL</option>
<OPTION name="AK" VALUE="ak">AK</option>
<OPTION name="AZ" VALUE="az">AZ</option>
<OPTION name="AR" VALUE="ar">AR</option>
<OPTION name="CA" VALUE="ca">CA</option>
<OPTION name="CO" VALUE="co">CO</option>
<OPTION name="CT" VALUE="ct">CT</option>
<OPTION name="DE" VALUE="de">DE</option>
<OPTION name="FL" VALUE="fl">FL</option>
<OPTION name="GA" VALUE="ga">GA</option>
<OPTION name="HI" VALUE="hi">HI</option>
<OPTION name="ID" VALUE="id">ID</option>
<OPTION name="IL" VALUE="il">IL</option>
<OPTION name="IN" VALUE="in">IN</option>
<OPTION name="IA" VALUE="ia">IA</option>
<OPTION name="KS" VALUE="ks">KS</option>
<OPTION name="KY" VALUE="ky">KY</option>
<OPTION name="LA" VALUE="la">LA</option>
<OPTION name="ME" VALUE="me">ME</option>
<OPTION name="MD" VALUE="md">MD</option>
<OPTION name="MA" VALUE="ma">MA</option>
<OPTION name="MI" VALUE="mi">MI</option>
<OPTION name="MN" VALUE="mn">MN</option>
<OPTION name="MS" VALUE="ms">MS</option>
<OPTION name="MO" VALUE="mo">MO</option>
<OPTION name="MT" VALUE="mt">MT</option>
<OPTION name="NE" VALUE="ne">NE</option>
<OPTION name="NV" VALUE="nv">NV</option>
<OPTION name="NH" VALUE="nh">NH</option>
<OPTION name="NJ" VALUE="nj">NJ</option>
<OPTION name="NM" VALUE="nm">NM</option>
<OPTION name="NY" VALUE="ny">NY</option>
<OPTION name="NC" VALUE="nc">NC</option>
<OPTION name="ND" VALUE="nd">ND</option>
<OPTION name="OH" VALUE="oh">OH</option>
<OPTION name="OK" VALUE="ok">OK</option>
<OPTION name="OR" VALUE="or">OR</option>
<OPTION name="PA" VALUE="pa">PA</option>
<OPTION name="PR" VALUE="pr">PR</option>
<OPTION name="RI" VALUE="ri">RI</option>
<OPTION name="SC" VALUE="sc">SC</option>
<OPTION name="SD" VALUE="sd">SD</option>
<OPTION name="TN" VALUE="tn">TN</option>
<OPTION name="TX" VALUE="tx">TX</option>
<OPTION name="UT" VALUE="ut">UT</option>
<OPTION name="VT" VALUE="vt">VT</option>
<OPTION name="VA" VALUE="va">VA</option>
<OPTION name="WA" VALUE="wa">WA</option>
<OPTION name="WV" VALUE="wv">WV</option>
<OPTION name="WI" VALUE="wi">WI</option>
<OPTION name="WY" VALUE="wy">WY</option>
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="buttonX(value)">
<input type="button" value="Watches" onClick="buttonX(value)">
</form>
</div>
</body>
</html>

it's your code, just cleaned up a bit. you had the two functions (Watches/Warnings) that basically had the same purpose, just the url2 changed...i combined them to work as one.

the object (error line 70 - tsuji's code) it was looking for was the function statecheck()...

does the code i supplied not do it for you?

- g
 
Upvote 0 Downvote
Hi spewn I tryed your code
wood there be a way to change your code so it wood turn red if null when the page loaded insted of wating for the user to click a button
thanks for any ideas
 
Upvote 0 Downvote

ok, that's a little different then your original post...this of course, begs the question of why not just set the color to red on the page?

but if you want to change it, just change the statecheck() function:

Code: 
function statecheck(){
document.getElementById('textX').style.color="red";
state="";
 with (document.weatherform.stateselter) {
  for (var i=0;i<options.length;i++) {
   if (options[i].getAttribute("name")==state) {
   selectedIndex=i;
   break;
   }
  }
 }
}

this will change it onload.

- g
 
Upvote 0 Downvote
hi spewn is this the way you wood write it if you went it to change if sate was naul as it loded
Code: 
function statecheck(){
state="";
 if (state== "") {
document.getElementById('textX').style.color="red";
return;
}
 with (document.weatherform.stateselter) {
  for (var i=0;i<options.length;i++) {
   if (options[i].getAttribute("name")==state) {
   selectedIndex=i;
   break;
   }
  }
 }
}
 
Upvote 0 Downvote
the code should work as i had posted it...the only reason that i put it in the statecheck() function was because you already use that onload...you don't need to put it in a conditional statement...

here's the complete code:

Code: 
<html>
<head>
<title>myweather form</title>
<script>
function buttonX(n){
url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
 if (n=='Warnings') {url2="/allwarnings.html";}
 if (n=='Watches') {url2="/watches.html";}box=document.weatherform.stateselter;
where_to=box.options[box.options.selectedIndex].value;
 if (where_to == "") {
 alert("select a state");
 return;
 }
 else {window.location = url1+where_to+url2;}
}
function statecheck(){
document.getElementById('textX').style.color="red";
state="";
 with (document.weatherform.stateselter) {
  for (var i=0;i<options.length;i++) {
   if (options[i].getAttribute("name")==state) {
   selectedIndex=i;
   break;
   }
  }
 }
}
</script>
</head>
<body onLoad="statecheck()">
<div align="center">
<br>
<p align=center><span style="font-size:20;color:0000ff;" id=textX name=textX>*select a state.</span></p>
<form name="weatherform">
<select size=5 name="stateselter">
<OPTION name="" VALUE="">select</option>
<OPTION name="AL" VALUE="al">AL</option>
<OPTION name="AK" VALUE="ak">AK</option>
<OPTION name="AZ" VALUE="az">AZ</option>
<OPTION name="AR" VALUE="ar">AR</option>
<OPTION name="CA" VALUE="ca">CA</option>
<OPTION name="CO" VALUE="co">CO</option>
<OPTION name="CT" VALUE="ct">CT</option>
<OPTION name="DE" VALUE="de">DE</option>
<OPTION name="FL" VALUE="fl">FL</option>
<OPTION name="GA" VALUE="ga">GA</option>
<OPTION name="HI" VALUE="hi">HI</option>
<OPTION name="ID" VALUE="id">ID</option>
<OPTION name="IL" VALUE="il">IL</option>
<OPTION name="IN" VALUE="in">IN</option>
<OPTION name="IA" VALUE="ia">IA</option>
<OPTION name="KS" VALUE="ks">KS</option>
<OPTION name="KY" VALUE="ky">KY</option>
<OPTION name="LA" VALUE="la">LA</option>
<OPTION name="ME" VALUE="me">ME</option>
<OPTION name="MD" VALUE="md">MD</option>
<OPTION name="MA" VALUE="ma">MA</option>
<OPTION name="MI" VALUE="mi">MI</option>
<OPTION name="MN" VALUE="mn">MN</option>
<OPTION name="MS" VALUE="ms">MS</option>
<OPTION name="MO" VALUE="mo">MO</option>
<OPTION name="MT" VALUE="mt">MT</option>
<OPTION name="NE" VALUE="ne">NE</option>
<OPTION name="NV" VALUE="nv">NV</option>
<OPTION name="NH" VALUE="nh">NH</option>
<OPTION name="NJ" VALUE="nj">NJ</option>
<OPTION name="NM" VALUE="nm">NM</option>
<OPTION name="NY" VALUE="ny">NY</option>
<OPTION name="NC" VALUE="nc">NC</option>
<OPTION name="ND" VALUE="nd">ND</option>
<OPTION name="OH" VALUE="oh">OH</option>
<OPTION name="OK" VALUE="ok">OK</option>
<OPTION name="OR" VALUE="or">OR</option>
<OPTION name="PA" VALUE="pa">PA</option>
<OPTION name="PR" VALUE="pr">PR</option>
<OPTION name="RI" VALUE="ri">RI</option>
<OPTION name="SC" VALUE="sc">SC</option>
<OPTION name="SD" VALUE="sd">SD</option>
<OPTION name="TN" VALUE="tn">TN</option>
<OPTION name="TX" VALUE="tx">TX</option>
<OPTION name="UT" VALUE="ut">UT</option>
<OPTION name="VT" VALUE="vt">VT</option>
<OPTION name="VA" VALUE="va">VA</option>
<OPTION name="WA" VALUE="wa">WA</option>
<OPTION name="WV" VALUE="wv">WV</option>
<OPTION name="WI" VALUE="wi">WI</option>
<OPTION name="WY" VALUE="wy">WY</option>
</select>
&nbsp;&nbsp;
<br><br>
<input type="button" value="Warnings" onClick="buttonX(value)">
<input type="button" value="Watches" onClick="buttonX(value)">
</form>
</div>
</body>
</html>

i don't understand why you just don't set the color to red intially, but i hope the above helps.

- g
 
Upvote 0 Downvote
Hi spewn
I been work with the script
i added a button but when the buton is clicked i need to change url1 an url2 how can i do this
can i do it in function buttonX(n)
or do i need to make another function
 
Upvote 0 Downvote

i added a button but when the buton is clicked i need to change url1 an url2
Click to expand...

can you explain a little more? it sounds like you want to change url1 with url2...what is the purpose of the new button? what is the new effect that you are trying to accomplish?

- g
 
Upvote 0 Downvote
Hi spewn
here is the the code
I know how the set url2
can you show me how to set url1 so that url wil only be used win the other button is pushed
Code: 
function buttonX(n){
url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/"[/URL]
 if (n=='Warnings'||'Advisories') {url2="/allwarnings.html";}
 if (n=='Watches') {url2="/watches.html";}
if (n=='Other') {"url2="/.html";}
 box=document.weatherform.stateselter;
where_to=box.options[box.options.selectedIndex].value;
 if (where_to == "") {
 alert("select a state");
 document.getElementById('textX').style.color="red";
 return;
 }
 else {window.location = url1+where_to+url2;}
}
thanks
 
Upvote 0 Downvote
if you are looking to change the url1 to the one you just gave, just set it in the conditional statement for "Other"...

(you also have an error, the " in from of url2...

Code: 
if (n=='Other') {
url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/textversion/state/";[/URL]
url2="/.html";
}

is that what you mean?

- g
 
Upvote 0 Downvote
thaks spewn

one ? about a if
you see some writen like this

if (n=='Other') {
url1="url2="/.html";
}
were it all spaced out
an some like this
if (n=='Watches') {url2="/watches.html";}
do they all work the same no matter how you wrie them
thanks beau
 
Upvote 0 Downvote
yes...i just prefer the other way when there is more that one statement...

this looks sloppy to me and hard to read:

Code: 
if (n=='Other') {url1="[URL unfurl="true"]http://iwin.nws.noaa.gov/iwin/textversion/state/";url2="/.html";}[/URL]

- g
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
2K
Mike Lewis
Mike Lewis
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
916
xwb
xwb
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
817
malpa
malpa
coldbohemia
  • Locked
  • Question
jquery function always returns contents of the same table cell, no matter which table cell i click
Replies
0
Views
733
coldbohemia
coldbohemia
berkshirea
  • Locked
  • Question
Change the Default Pop Up Message 2
Replies
8
Views
800
berkshirea
berkshirea

Part and Inventory Search

Sponsor

Back
Top