Select Multi values in Picklist without CTRL-Shift | Community
Skip to main content
A
Anonymous
June 10, 2013
Question

Select Multi values in Picklist without CTRL-Shift

  • June 10, 2013
  • 3 replies
  • 6022 views
Has anyone been able to code their forms to have the ability to select multi values in a mult-select picklist field on a form? I want the end user tobe able to select multiple values without having to use CTRL-Shift before hand.

Thanks!
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

A
Anonymous
June 10, 2013
The default behavior for a multi-select HTML input is to hold the CTRL key to select multiple values. Are you really trying to accomplish a click-to-toggle type action? So, for instance, if you click "blue", then "red" once they are selected, but if you click on "blue" again, it is deselected without the use of CTRL. Is that what you're trying to accomplish?

Here's an example using jQuery (via stackoverflow.com): http://jsfiddle.net/iambriansreed/BSdxE/
A
Anonymous
June 11, 2013
Bil!!!!!
: )

Yes, i think that is what I am looking for. You suggest just adding this as a custom html box on the landing page?
A
Anonymous
June 11, 2013
Hey Crissy! :)

There are two parts...

Put this in the CUSTOM HEAD HTML:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.select-toggle').each(function(){    
    var select = $(this), values = {};    
    $('option',select).each(function(i, option){
        values[option.value] = option.selected;        
    }).click(function(event){        
        values[this.value] = !values[this.value];
        $('option',select).each(function(i, option){            
            option.selected = values[option.value];        
        });    
    });
});
});
</script>

Put this in a custom HTML element (and change out 1,2,3,4 with your actual select values):
<select class="select-toggle" multiple="multiple">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>

Abdul_Hafiz
Abdul_Hafiz
Level 1
March 4, 2020

Hi, I'm facing a similar problem at the moment and have taken a look at the code. How would this be used with a Marketo embedded form though? Appreciate any help! Thank you.

Terms & ConditionsAccessibility statement

Loading footer...