lulu50
asked on
A problem with my drop down list
Hi,
this is my site:
http://www.churchesbulletin.com/post.cfm?s=CT&CHID=11
I am working with the
Search by city menu
the problem that I am having is when I click on the "Search by city" menu
-Have the option "Select a State" selected
-you will see the drop down box for "Select a city" empty
when I select a state from the list the select a city drop list will get populated.
if you look at the list it will automatically select the first city that is on the list.
what I want is to add a new option that says "select a city" then display the rest of list.
this is my site:
http://www.churchesbulletin.com/post.cfm?s=CT&CHID=11
I am working with the
Search by city menu
the problem that I am having is when I click on the "Search by city" menu
-Have the option "Select a State" selected
-you will see the drop down box for "Select a city" empty
when I select a state from the list the select a city drop list will get populated.
if you look at the list it will automatically select the first city that is on the list.
what I want is to add a new option that says "select a city" then display the rest of list.
Or
In the query itself, fetch in such a way that it contains the value 'select a city' and index value as 0
Something like this
Then no need to do the first suggestion.
Raj
In the query itself, fetch in such a way that it contains the value 'select a city' and index value as 0
Something like this
SELECT 0, 'Select a City'
UNION
SELECT CityID, CityName FROM City
Then no need to do the first suggestion.
Raj
ASKER
RajkumarGS:
no, it didn't work
I have to add this option somewhere in the javascript code but I don't know where or how
no, it didn't work
I have to add this option somewhere in the javascript code but I don't know where or how
Can you post relevant code ?
Raj
Raj
ASKER
function setCityOptionsCT(theSel,fldNameFilter,fldNameTarget){
var theForm = theSel.form;
theForm[fldNameTarget].options.length=0;
var theFilter = escape(theForm[fldNameFilter].value.replace(/(^\s*|\s*$)/g,""));
var theRequest = 'getOptCityName.cfm?selval='+theSel.value+'&filter='+theFilter;
getSelOptions(theRequest,theForm[fldNameTarget]);
}
getOptCityName.cfm
has this code to populate the city
<cfsetting showDebugOutput="No">
<cfif isDefined("URL.selval") >
<CFQUERY DATASOURCE="xx" NAME="GetCities" cachedwithin="#createTimeSpan(0,0,0,-1)#">
SELECT distinct CityID, CityName FROM CityTbl
WHERE StateID = #URL.selval#
<cfif isDefined("URL.filter") AND URL.filter GT "" >
AND LCASE(CityName) LIKE '#LCase(URL.filter)#%'
</cfif>
order by CityName ASC
</CFQUERY>
<cfset arrSep="">
[<cfoutput query="GetCities" >
#arrSep#["#CityID#","#CityName#"]
<cfset arrSep=",">
</cfoutput>]
</cfif>
_____________________________________________
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;
if(theTarget.name == "GetCityCT") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetCity") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetChurch") {
opt[0] = new Option("Select a church","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]);
}
}
}
ASKER
I think in this function is where I have to add the option when the list is populated
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;
if(theTarget.name == "GetCityCT") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetCity") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetChurch") {
opt[0] = new Option("Select a church","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]);
}
}
}
ASKER
this will add new option when the list is not populated I need to do the same thing when the list is populated
if(theTarget.name == "GetCityCT") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetCity") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetChurch") {
opt[0] = new Option("Select a church","0");
}
if(theTarget.name == "GetCityCT") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetCity") {
opt[0] = new Option("Select a City","0");
}
else if(theTarget.name == "GetChurch") {
opt[0] = new Option("Select a church","0");
}
Try change query like this ?
SELECT distinct CityID, CityName FROM (SELECT 0 AS CityID, 'Select a City' AS CityName UNION SELECT CityID, CityName FROM CityTbl)
WHERE StateID = #URL.selval#
<cfif isDefined("URL.filter") AND URL.filter GT "" >
AND LCASE(CityName) LIKE '#LCase(URL.filter)#%'
</cfif>
order by CityName ASC
SELECT distinct CityID, CityName FROM (SELECT 0 AS CityID, 'Select a City' AS CityName UNION SELECT CityID, CityName FROM CityTbl)
WHERE StateID = #URL.selval#
<cfif isDefined("URL.filter") AND URL.filter GT "" >
AND LCASE(CityName) LIKE '#LCase(URL.filter)#%'
</cfif>
order by CityName ASC
ASKER
RajkumarGS:
I made the changes now it's not populating the city based on the selected state
I made the changes now it's not populating the city based on the selected state
Please clarify - Can you see 'Select a City' in the dropdown now at top ?
ASKER
RajkumarGS:
I do see the 'Select a City' on top but the rest of my list disappeared
I do see the 'Select a City' on top but the rest of my list disappeared
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
It works !!!!
thank you RajkumarGS:
thank you RajkumarGS:
ASKER
Thank you
Welcome :)
Raj