State select box

Hi,

this is my site.
http://www.churchesbulletin.com/home.cfm?chid=11

when I open the page I will get list of states populated what I would like to add to the list is a new option that says "Select a state"

so, where the visitor come to my site they should see in the select state list

Select a state
Michigan (MI)
Ohio (OH)

right now it shows only the states
Michigan (MI)
Ohio (OH)

I need to add something like this but not sure how!

 if(theTarget.name == "DispStateBox") {
  opt[0] = new Option("Select a State","");
}


function getSelOptions(theRequest,theTarget){
  var xmlhttp;
  if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  theRequest=theRequest+"&t="+(new Date()).getTime();
  xmlhttp.open("GET",theRequest,false);
  xmlhttp.send();
  newOpt=[];
  var respOpt=xmlhttp.responseText.split('<!-- " --->')[0].replace(/^\s*[\n\r]*$/gm,"");
  if(respOpt){
    newOpt=eval(respOpt);
  }
  var opt = theTarget.options;
  opt.length=0;
  var selPar = window[fldMap[theTarget.name]];
  for(var i=0;i<newOpt.length;i++){
    if(newOpt[i][0]==selPar){
      window[fldMap[theTarget.name]]="";
      opt[i] = new Option(newOpt[i][1],newOpt[i][0],true,true);
    } else {
      opt[i] = new Option(newOpt[i][1],newOpt[i][0]);
    }
  }
}

Open in new window

lulu50Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

chaitu chaituCommented:
	var oSelect=document.createElement("select");
			oSelect.id = 'needsby1' 

			var oOption = document.createElement("OPTION");
			var t = document.createTextNode("Please Select One22");
			oOption.setAttribute("value", 'Please Select One2222222');
			oOption.appendChild(t);
			oSelect.appendChild(oOption);
document.getElementById("div1").appendChild(oSelect);

<div id='div1'></div>

Open in new window

0
lulu50Author Commented:
how would I use it in my code
0
chaitu chaituCommented:
for(var i=1;i<newOpt.length;i++){
opt[0] = new Option("select a state","select a state");
    if(newOpt[i][0]==selPar){
      window[fldMap[theTarget.name]]="";
      opt[i] = new Option(newOpt[i][1],newOpt[i][0],true,true);
    } else {
      opt[i] = new Option(newOpt[i][1],newOpt[i][0]);
    }
  }

Open in new window


0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

chaitu chaituCommented:
sorry u put out side of for loop;start int i =1;

opt[0] = new Option("select a state","");

for(var i=1;i<newOpt.length;i++){
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Rajkumar GsSoftware EngineerCommented:
@lulu50 -
Is this the same requirement that you posted in the question - http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27406762.html ?

If yes, did you try that solution ?

Raj
0
lulu50Author Commented:
RajkumarGS:

the one that you helped me with it was the post.cfm page but the one I am talking about is
in the home.cfm

it's on a different page and the code are similar but not the same.

http://www.churchesbulletin.com/home.cfm?chid=11

-----------------------------------------------------------------------------------------
the post.cfm has this.
function getSelOptions(theRequest,theTarget){
  var xmlhttp;
  if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  theRequest=theRequest+"&t="+(new Date()).getTime();
  xmlhttp.open("GET",theRequest,false);
  xmlhttp.send();
  newOpt=eval(xmlhttp.responseText);
  var opt = theTarget.options;
  opt.length=0;

if(theTarget.name == "GetCityCT") {
  opt[0] = new Option("Select a City","");
}
else if(theTarget.name == "GetCity") {
  opt[0] = new Option("Select a City","");
}
else {
  opt[0] = new Option("Select a church","");
}

  for(var i=0;i<newOpt.length;i++){
    opt[opt.length] = new Option(newOpt[i][1],newOpt[i][0]);
  }
} 

_______________________________________________

this question has to do with this page 
home.cfm

function getSelOptions(theRequest,theTarget){
  var xmlhttp;
  if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  } else {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  theRequest=theRequest+"&t="+(new Date()).getTime();
  xmlhttp.open("GET",theRequest,false);
  xmlhttp.send();
  newOpt=[];
  var respOpt=xmlhttp.responseText.split('<!-- " --->')[0].replace(/^\s*[\n\r]*$/gm,"");
  if(respOpt){
    newOpt=eval(respOpt);
  }
  var opt = theTarget.options;
  opt.length=0;
  var selPar = window[fldMap[theTarget.name]];
  for(var i=0;i<newOpt.length;i++){
    if(newOpt[i][0]==selPar){
      window[fldMap[theTarget.name]]="";
      opt[i] = new Option(newOpt[i][1],newOpt[i][0],true,true);
    } else {
      opt[i] = new Option(newOpt[i][1],newOpt[i][0]);
    }
  }
}

see it's a little bit different

Open in new window

0
lulu50Author Commented:
chaituu:

I tried it.  It's not working

can I do it somewhere here when the state get populated?
<select name="DispStateBox" style="width: 218px;" size="4" 
			   onChange="setCityOptions(this,'TxtCity','GetCity','GetChurch');"
			   onFocus="this.form.TxtCity.value='';this.form.TxtChurch.value='';" >
			 </select>
			 
			 <cfset strStateList="" >
			 <cfloop query="DispState">
			   <cfset strStateList=strStateList&",['#StateID#','#StateName#']" >
			 </cfloop>

Open in new window

0
lulu50Author Commented:
I added to this function and it worked!!!
function setStateOptions(theFilter,fldNameTarget){
  var theForm = theFilter.form;
  var opt = theForm[fldNameTarget].options;
  var rxFilter = new RegExp("^"+theFilter.value,"i");
  opt.length = 0;
  opt[0] = new Option("Select a State","");
  for(var i=0;i<arrStates.length;i++){
    if(arrStates[i][1].match(rxFilter)){
       if(arrStates[i][0]==window.stid){ 
         window.stid="";
         opt[opt.length] = new Option(arrStates[i][1],arrStates[i][0],true,true);
       } else {
         opt[opt.length] = new Option(arrStates[i][1],arrStates[i][0]);
       }
    }
  }
}

Open in new window

0
lulu50Author Commented:
Thank you
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.