Multi Step setting values in dropdown, but not selected

  • Resolved darthyoda6

    (@darthyoda6)


    5 years, 11 months ago

    In the JavaScript, when your filling in the forms from the cookie / session storage, you select the value of the drop down by field.val(val);, but any JavaScript that looks for selected values won’t be able to find the values in the filled in dropdown because your not adding selected.

    I’m not sure if it’s the most efficent way of doing it, but in your cf7msm.js I changed 

    if (field.length > 0) {
	if ( field.prop('type') == 'radio' || field.prop('type') == 'checkbox' ) {
		field.filter(function(){
				return $(this).val() == val;
		}).prop('checked', true);
	}	
	else {
		field.val(val);	
	}
}

    to

    if (field.length > 0) {
	if ( field.prop('type') == 'radio' || field.prop('type') == 'checkbox' ) {
		field.filter(function(){
				return $(this).val() == val;
		}).prop('checked', true);
	}
	else if ( field.prop('type') == 'select-one' ) {
		field.find("*[value='"+val+"']").attr('selected', 'selected');
	}
	else {
		field.val(val);	
	}
}
Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author webheadcoder

    (@webheadllc)

    I’m not sure I fully understand what you’re saying. field.val(val) is the correct way to set a dropdown as far as I know.

    https://stackoverflow.com/questions/4680075/set-selected-option-of-select-box

    Thread Starter darthyoda6

    (@darthyoda6)

    It chooses the correct dropdown item, but it doesn’t trigger a selected event. So if you have any events that rely on something being selected, it will never be fired. Also, if you need to access the dom item that was selected, you can’t without the selected being set. You can get the value of the dropdown with val being set, not the actual item that was selected.

    <select name="uni_choice_1" class="wpcf7-form-control wpcf7-select wpcf7-validates-as-required" id="uni_choice_1" aria-required="true" aria-invalid="false">
    <option value="">---</option>
    <optgroup label="Australia">
        <option value="Flinders University">Flinders University</option>
        <option value="La Trobe University">La Trobe University</option>
        <option value="University of Sydney">University of Sydney</option>
        <option disabled="disabled"></option>
    </optgroup>
    <optgroup label="United Kingdom">
        <option value="Bangor University">Bangor University</option>
        <option disabled="disabled"></option>
    </optgroup>
    <optgroup label="Ireland">
        <option value="Institute of Technology, Carlow">Institute of Technology, Carlow</option>
    </optgroup>
</select>
     $(document).ready(function() {
var selected = $("#uni_choice_1 option:selected");
var opt = selected.parent().attr('label');

    So after the form is re-populated I need to show or hide stuff depending on what was selected, and I also need the option group it’s in, cause the labels also tell me whether I need to show or hide stuff.

    So the working answer I found actually was from that article, but the second answer down with currently 144 votes.

    Plugin Author webheadcoder

    (@webheadllc)

    I see. Ok I’ll test this out.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Multi Step setting values in dropdown, but not selected’ is closed to new replies.