Re: Make a dropdown a multiple select with javascript and select all options in
"John M. Hann" <[email protected]> Wed, 10 May 2006 19:03:49 -0000
| Newsgroups | gmane.comp.web.dom.wdf |
|---|---|
| Message-ID | <[email protected]> |
Hey Rob,
Rather than fight with IE's overly-repressed select element, you may
want to try modifying your code a bit to avoid switching to multi-select
and back:
1. Modify the selYorkshireRegion function to accept a new boolean
parameter which indicates whether to grab all option values or just the
selected ones.
2. Call the selYorkshireRegion function (with the new param set to
grab all values) from the AutoFillYorkshireRegion function (and remove
all code to switch to multi-select and back.
3. I assume you are reusing the selYorkshireRegion function from a
different (user-invoked) event. If so, just call it with the new
parameter set to grab the values from just the selected options (or just
default to this behavior if the parameter is missing).
Example with an additional enhancement:
function selYorkshireRegion(getAll){
... // snipped
var elYR = document.getElementById('lstYorkshireRegion');
if(getAll || elYR.options)[x].selected==true){
catID += elYR.options[x].value + ',' ;
... // snipped
}
Just a suggestion.
-- John
http://e-numera.com/
http://ajax-web2.com/
--- In [email protected], "dirtbox2006" <rreid@...> wrote:
>
> I have two linked drop down select boxes on a home page of one of our
> websites. On loading the page I call a jscript function
> getYorkshireRegions that tries to make the top select box a
> multiple select, select all options and then call a function that
> takes those selected options calls an ajax function and populates the
> second select box.
> However it only works in Firefox. In IE I just end up with the last
> option of the first select box selected. How can I make this work
> cross browser?
>
> function AutoFillYorkshireRegion(){
> alert('lets auto fill all options')
> document.getElementById('lstYorkshireRegion').multiple = true;
> for(var x=0;x<document.getElementById
> ('lstYorkshireRegion').options.length;x++){
> document.getElementById('lstYorkshireRegion').options
> [x].selected=true;
> }
> selYorkshireRegion();
> document.getElementById('lstYorkshireRegion').multiple = false;
> }
>
> function selYorkshireRegion(){
> if(bAllowAjax==true){
> alert('in selYorkshireRegion');
> var catID = ''
> if(document.getElementById('lstYorkshireRegion').multiple == true){
> for(var x=0;x<document.getElementById
> ('lstYorkshireRegion').options.length;x++){
> if(document.getElementById('lstYorkshireRegion').options
> [x].selected==true){
> catID += document.getElementById('lstYorkshireRegion').options
> [x].value + ',' ;
> }
> }
> }else{
> catID = document.getElementById('lstYorkshireRegion').value;
> }
> gstrList='lstCity';
> alert('it is "' + catID + '"');
> if(catID=='' || catID==','){
> catID = 0;
> }else{
> if(catID.substring(catID.length-1,catID.length)==',')
> catID = catID.substring(0,catID.length-1);
> if(catID.substring(0,1)==',')
> catID = catID.substring(1,catID.length);
> }
> var qry = 'cat=' + escape(catID);
> alert(qry)
> xmlhttpPost
> ('/jobboard/scripts/ajax/categories.asp',qry,'displayListResult');
> }
> setTimeout('doChain(1)', 500);
> }
>
> As I said it works fine in firefox but not IE.
> The select in question is drawn out when the page is rendered as such:
>
> <dt><label for="lstYorkshireRegion">Region:</label></dt><dd><select
> id="lstYorkshireRegion" name="lstYorkshireRegion" size="1"
> <option value="" selected="selected">Any</option><option value="1393"
> >South Yorkshire</option>
> <option value="1394" >North Yorkshire</option>
> <option value="1395" >West Yorkshire</option>
> <option value="1396" >East Yorkshire</option>
> <option value="1453" >Outskirts of Yorkshire</option>
> </select>
> </dd>
>
>
> <script type="text/javascript">
> <!--
> var myelem1 = document.getElementById('lstYorkshireRegion');
> if(myelem1.attachEvent)
> myelem1.attachEvent('onchange', selYorkshireRegion);
> else
> myelem1.addEventListener('change', selYorkshireRegion, false);
> //-->
> </script>
>
> Can anyone help me pls. Thanks in advance.
> Rob
>
[Non-text portions of this message have been removed]
------------------------ Yahoo! Groups Sponsor --------------------~-->
Everything you need is one click away. Make Yahoo! your home page now.
http://us.click.yahoo.com/AHchtC/4FxNAA/yQLSAA/9rHolB/TM
--------------------------------------------------------------------~->
Unsubscribe
[email protected]
List info
http://www.quirksmode.org/dom/list.html
Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/wdf-dom/
<*> To unsubscribe from this group, send an email to:
[email protected]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/