1

I am trying to reset a apex:form input fields at client side using javascript. Though I am able to reset all other fields, multiselect picklist is not getting reset.

VF page;

<apex:page standardController="Contact">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <apex:form >
        <div id="formToReset">
            <apex:inputField value="{!Contact.AccountId}" />
            <apex:inputField value="{!Contact.lastName}" />
            <apex:inputField value="{!Contact.CleanStatus}" />
            <apex:inputField value="{!Contact.Multi__c}" />
            <input type="button" value="Reset" onClick="resetForm('formToReset');"/>
            <script>
            function resetForm(id) {
                $('#'+id).find(':input').each(function(){
                    console.log(this);
                    if($(this).is("select"))
                    {
                        $(this).find("option").prop("selected",function() {
                            return this.defaultSelected;
                        });
                    }
                    else
                    {
                        $(this).val(function() {
                            return this.defaultValue;
                        });
                    }
                });
            }
            </script>
        </div>
    </apex:form>
</apex:page>

Is there a way to reset the mutiselect picklist?

Note: Multi__C is a custom multiselect picklist on Contact.

1

Just use jQuery to perform the exact option you would do manually. There are more simple ways to do it, but those ways don't sort them back to their original values like this will.

// mark all options in the "Chosen" side as selected
$("select[title='Multi - Chosen'] option").each(function() {
    $(this).attr('selected','selected');
});
// click the arrow to move them to the left
$(".picklistArrowLeft").click();
2
  • Awsome! I ened up with if($(this).is("select")) { $(this).find("option").prop("selected",function() { return this.defaultSelected; }); if(undefined != $(this).attr("multiple") && "multiple" === $(this).attr("multiple") && !($(this)[0].id.match('selected$')) && !($(this)[0].id.match('unselected$'))) MultiSelectPicklist.handleMSPSelect($(this)[0].id); }. But yours looks a clean approach. – Saumya Ranjan Satapathy Dec 6 '16 at 15:44
  • Finally I added if($('#'+id).find(".picklistArrowLeft").length){$('#'+id).find(".picklistArrowLeft").click();} this at end of my resetForm() and it works like charm. – Saumya Ranjan Satapathy Dec 6 '16 at 15:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.