lulu50
asked on
Select box
Hi,
How can I in coldfusion if I select from the select box then populate the data
so, I don't want the select to get populated when I open the page
what should I say here
<cfif isdefined('form.?) can I do form.GetState GetSate is a dropdown box.
<select name="GetCity" style="width: 180px;height:200px;" size="8" multiple="multiple"/>
<cfoutput>
<cfloop from="1" to="#listlen(myCitiesList) #" index="i" step="3">
<option value="#listgetat(myCities List,i+1)# ">#listget at(myCitie sList,i+2) #</option>
</cfloop>
</cfoutput>
</select>
http://www.churchesbulletin.com/
what I want to do is when the user open this site the page should not populate the city data unless the user select the state.
How can I in coldfusion if I select from the select box then populate the data
so, I don't want the select to get populated when I open the page
what should I say here
<cfif isdefined('form.?) can I do form.GetState GetSate is a dropdown box.
<select name="GetCity" style="width: 180px;height:200px;" size="8" multiple="multiple"/>
<cfoutput>
<cfloop from="1" to="#listlen(myCitiesList)
<option value="#listgetat(myCities
</cfloop>
</cfoutput>
</select>
http://www.churchesbulletin.com/
what I want to do is when the user open this site the page should not populate the city data unless the user select the state.
Ravi covered two options, a third could be using bind on the CFSELECT tags.
so all three options..
1) select the state, submit the form, show the cities (easiest approach for coding, worst for user)
2) use custom tag TWOSELECTSRELATED to fetch and populate two dependant select statements (good use experience, harder to code)
3) use cfc and CFSELECT with Binding (good user experience, harder to code, need to setup a cfc, not bad if you've done it before)
The caveat to gdemaria's addition would be the version of ColdFusion you are using... are you using CF8 or CF9 at least? If so I'd definitely recommend the binding option. Either that or if not you could do the same thing with an earlier CF version (i.e. MX,7) by utilizing jQuery or extJS ajax frameworks - although if all you're doing is this that might be overkill.
Ben Forta has a nice example at his blog for CF8 (same works for CF9).
There's also an example for earlier versions with pure javascript and a custom tag (although I haven't tried it because I still prefer gdemaria's third suggestion). Just wanted to give you some referrences.
Ben Forta has a nice example at his blog for CF8 (same works for CF9).
There's also an example for earlier versions with pure javascript and a custom tag (although I haven't tried it because I still prefer gdemaria's third suggestion). Just wanted to give you some referrences.
Yes, you can use CFIF like this:
<form name="FRMAcc" action="" method="post" enctype="multipart/form-data">
<select name="DispStateBox" style="width: 180px;height:200px;" size="8" onChange="this.form.submit()" >
<option value="22">Michigan (MI)</option>
<option value="35">Ohio (OH)</option>
</select>
<cfif isdefined("form.DispStateBox")>
<select name="GetCity" style="width: 180px;height:200px;" size="8" multiple="multiple"/>
<cfoutput>
<cfloop from="1" to="#listlen(myCitiesList)#" index="i" step="3">
<cfif listgetat(myCitiesList,i) EQ form.DispStateBox >
<option value="#listgetat(myCitiesList,i+1)#">#listgetat(myCitiesList,i+2)#</option>
</cfif>
</cfloop>
</cfoutput>
</select>
</cfif>
Please note two changes on your FORM:
1.) You do not have a SUBMIT button on your form and therefore I changed your State select onChange to do the submit();
2.) You cannot select multiple State from the Cities list and therefore I removed that attribute from the <select>
1.) You do not have a SUBMIT button on your form and therefore I changed your State select onChange to do the submit();
2.) You cannot select multiple State from the Cities list and therefore I removed that attribute from the <select>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Zvonko
by having this at the end
setOptionCity();
it means it is going to execute the function without the onclick event but I want it to only execute the function if the user selected a state.
I want the city to be hidden when the user come to the site and when they select a state it will become available for them to select.
Thank you
by having this at the end
setOptionCity();
it means it is going to execute the function without the onclick event but I want it to only execute the function if the user selected a state.
I want the city to be hidden when the user come to the site and when they select a state it will become available for them to select.
Thank you
ASKER
I don't want it to populate data to the city unless the user selected a state.
I have a lots of data it will take for ever to upload.
I have a lots of data it will take for ever to upload.
ASKER
I looked at the view source and I see the data got populated
how can I have it not to populate the data and be hidden unless the user select from the state?
how can I have it not to populate the data and be hidden unless the user select from the state?
ASKER
Great!!!!
I did this
<cfif isdefined("form.DispStateB ox")>
now I don't have the data populated unless the user select from the state.
now the only issue is that I needed the city to be hidden unless the user select on the state.
I did this
<cfif isdefined("form.DispStateB
now I don't have the data populated unless the user select from the state.
now the only issue is that I needed the city to be hidden unless the user select on the state.
Simply do this:
setOptionCity();
ASKER
Zvonko
I don't understand?
I don't understand?
ASKER
do you mean just to call the function
ASKER
Zvonko
Great!!
it works!!!!
Thank you and Thank you for your help
Great!!
it works!!!!
Thank you and Thank you for your help
ASKER
Thank you
You are velcome, but you did it by the "visibility" trick <|:-)
1. on form submission i.e when you select the state generate the city drop down.
2. on Using of Custom Tag with all the city and generated but when state is selected fire the event to the custom tag which pulls the data for the City.
Thanks
Ravi