<td>
<select data-style="" class="selectpicker form-control" name="multipleSelected" id="multipleSelected" multiple="multiple">
<apex:repeat value="{!MedicalAllergies}" var="itm">
<option value="{!itm.label}">{!itm.label} </option>
</apex:repeat>
</select>
</td>
Hi SImmy,Use this code this will help you. Apex Class:
public class SelectList {
public List<String> MedicalAllergies {get;set;}
public String selectedItem {get;set;}
public SelectList() {
MedicalAllergies = new List<String>{'first', 'secong'};
}
public void onSelectListChange() {
SYstem.debug('selectedItem' + selectedItem);
}
}
<apex:page controller="SelectList" >
<head>
<script>
function passValue() {
var select1 = document.getElementById("multipleSelected");
var selected1 = [];
for (var i = 0; i < select1.length; i++) {
if (select1.options[i].selected) selected1.push(select1.options[i].value);
}
onSelectListChange(JSON.stringify(selected1));
console.log(selected1);
}
</script>
</head>
<apex:form >
<apex:actionFunction name="onSelectListChange" action="{!onSelectListChange}" reRender="none" >
<apex:param name="param" value="" assignTo="{!selectedItem}" />
</apex:actionFunction>
<td>
<select multiple="true" onchange="passValue(); return false;" data-style="" class="selectpicker form-control" name="multipleSelected" id="multipleSelected">
<apex:repeat value="{!MedicalAllergies}" var="itm">
<option value="{!itm}">{!itm} </option>
</apex:repeat>
</select>
</td>
</apex:form>
</apex:page>
If you found it useful please appreciate my efforts and mark it as the best answer.
LinkedIn: https://www.linkedin.com/in/soyab-hussain-b380b1194/Regards,SoyabHi soyab,
Thank you so much for your reply but could u please let me know if I want to call the JavaScript function after I've selected 2-3values, then how can I call?
Hi SImmy,Use this code this will help you. Apex Class:
public class SelectList {
public List<String> MedicalAllergies {get;set;}
public String selectedItem {get;set;}
public SelectList() {
MedicalAllergies = new List<String>{'first', 'secong'};
}
public void onSelectListChange() {
SYstem.debug('selectedItem' + selectedItem);
}
}
Visuaforce Page:
Regards,Soyab<apex:page controller="SelectList" >
<head>
<script>
function passValue() {
var e = document.getElementById("multipleSelected");
var strUser = e.options[e.selectedIndex].value;
onSelectListChange(strUser);
}
</script>
</head>
<apex:form >
<apex:actionFunction name="onSelectListChange" action="{!onSelectListChange}" reRender="none" >
<apex:param name="param" value="" assignTo="{!selectedItem}" />
</apex:actionFunction>
<td>
<select onchange="passValue(); return false;" data-style="" class="selectpicker form-control" name="multipleSelected" id="multipleSelected">
<apex:repeat value="{!MedicalAllergies}" var="itm">
<option value="{!itm}">{!itm} </option>
</apex:repeat>
</select>
</td>
</apex:form>
</apex:page>