Been trying to work this out for a little while now, no luck.
jQuery("#choosenCause option:selected").removeAttr("selected","selected");
jQuery('#choosenCause option[value="'+json.causeID+'"]').attr("selected",true);
I'm using the above, it adds selected="selected" to the right element, but does not change the selected element that the user sees.
Full JS here - http://inspire.simplyfundraising.co.uk/wp-content/themes/inspire/assets/js/promojs.js
To set the selected option of a select element, use val():
jQuery('#choosenCause').val(json.causeID);
in the first string you need to correct the code - jQuery("#choosenCause option:selected").removeAttr("selected");
the second string works fine as i see
Related
I have a custom option set on an Opportunity form and one of the option (last) is hidden. I've have a ribbon button & on click of that button I need to show and select that option. It's working fine for the first time but my problem is if I click on that button for 2nd or 3rd time and so on it's duplicating/adding the same text part of that option to that option set...Option Set
You can avoid manually checking for the option by simply call ctrl.removeOption(1234) before calling ctrl.addOption(1234).
You should check to see if the option exists prior to adding the option to the option set. As there is no supported way to check the current options of an option set (Xrm.Page.getAttribute(attributeName).getOptions() gives you all available options, not the options currently on the page for the attribute).
So, your best bet would be to use Xrm.Page.getControl(attributeName).clearOptions(), to clear all the options and then re-add the ones necessary. You can get all available by interating through Xrm.Page.getAttribute(attributeName).getOptions();
Before you remove the option (to add it again without duplicates) you should first check if the value to remove is not the current value --> if the actual value is the value you want to remove a update on the option set is fired - it is like you setting the field to null.
Need to clone select box from previous one ( ie, add select box 'n' number of time from the previous one )
But when I added each time, all the previously selected options should not be available in the cloned select box list.
$('.field_select_box_list').each(function(){
$(this).find('option:selected').remove();
});
This code removes the parent select boxes selected option too.. but I want remain them to have the selected option.
any help.
Your clone code can just do something like
$('el').clone().find('option:selected').remove().end()
The .end() causes the selector to return to being $('el') rather than the filtered option:selected selector, so you can continue running things like .appendTo() etc without needing to break the chain.
I think you need use one select_box original, hidden it. Then you can remove with select_box second not hidden or add more element from select_box original.
I am trying to select a certain value in my dropdown via jquery..I tried this..
$("#membershiptype").val(1).selected;
it doesnt work..I am clearly over my head here as I am inexperience in jquery.
To select an option by index, you can do this :
$("#membershiptype").get(0).selectedIndex=1;
Demonstration
To select an option by value (the content of the option), you may use this :
$("#membershiptype").val('B');
Demonstration
You can assign the val() to the option value you want to be selected.
$('#membershiptype').val(valueToBeSelected);
I have a select that has dynamically created option option[0] always ends up being autofocused making my onchange not work if I want to choose the first option.
The index of the options matter so creating a " " option won't work.
Any ideas?
edit: The user creates an object. When the user saves the object, it creates a new option in the select tag. The user selects something from the select tag to go back to that object.
The autofocus is always on option[0] until they selected something else even if they created a new object/option so if they wanted to pick the first thing, but was on the second or third the user would have to click on another option first then click on the one they want.
What I want is that it doesn't focus on any of the options so that they could click on option[0] from the beginning regardless of whether they've selected anything from the dropdown.
Seems like a lot of work to workaround this issue, instead of changing one of your requirements. You say that the index corresponds to an index into an array of objects. Why can't you have the first option blank or "Select...", and then simply subtract one for your lookup into the array?
Or, have the values correspond to the array index, or use custom data attributes to store the array indexes? Seems like any of these would be easier than trying to force a consistent behavior for an unsupported functionality across multiple browsers.
A Select box always has one of its options selected (unless it doesn't have any options). You might need to use a different event (onclick, perhaps) and test the value to see if it has changed.
You can add a default empty selected option with:
<option selected="selected" disabled="disabled" hidden="hidden" value=""></option>
The select is empty by default, with the void option not selectable in the options list.
I have one select box with options and I am using jQuery "Chosen" on a Zend View. This plugin is working fine.
Javascript:
$('#select_type').chosen();
My problem is I need to select one of the options when the page loads depending on what the value of type_id is. I tried this:
document.getElementById('select_type').value = '<?=$this->type_id?>';
This changes its value but the option is not selected in the JQuery chosen.
Any ideas?
EDIT: The option successfully changes by doing what I have mentioned above but it does not update/change the selected element in jQuery "chosen" plugin. My question is about updating the selected value for jQuery Chosen not the HTML SELECT (which I have done successfully). Here is a link to jQuery Chosen plugin
Update list with JS
After you run:
document.getElementById('select_type').value = '<?=$this->type_id?>';
For Chosen version 1 and above (newer)
You should call:
$('#select_type').trigger('chosen:updated');
Taken from the Chosen documentation:
Updating Chosen Dynamically
If you need to update the options in your select field and want Chosen to pick up the changes, you'll need to trigger the "chosen:updated" event on the field. Chosen will re-build itself based on the updated content.
$("#form_field").trigger("chosen:updated");
See the change log for the announcement of this API change.
For Chosen versions below 1 (older)
You should call:
$('#select_type').trigger('liszt:updated');
Taken from the Chosen documentation:
Updating Chosen Dynamically
If you need to update the options in your select field and want Chosen
to pick up the changes, you'll need to trigger the "liszt:updated"
event on the field. Chosen will re-build itself based on the updated
content.
jQuery Version: $("#form_field").trigger("liszt:updated");
Prototype Version: Event.fire($("form_field"), "liszt:updated");
Set the value before calling Chosen
Instead of doing this from JS why don't you just set the selected option in the HTML before calling the Chosen plugin with JavaScript? You are setting the value from a piece of PHP so I don't see why this couldn't be done.
You can just set the correct elements with the attribute selected like so:
<select name="teams[]" data-placeholder="Chose an option:"
class="chzn-select" multiple tabindex="6">
<option value=""></option>
<option selected="selected">Dallas Cowboys</option>
<option selected="selected">New York Giants</option>
<option>Philadelphia Eagles</option>
<option>Washington Redskins</option>
</select>
Chosen will take care to initialize itself and show the two pre-selected choices.
Try this:
$("#select_type").val(<?=$this->type_id?>).trigger('change');
$('#select_type').trigger('liszt:updated');
Try this:
$('#select_type').val('<?=$this->type_id;?>'); // Select the value before .chosen();
$('#select_type').chosen();
$('#select_type').val('<?=$this->type_id?>');
try it
Try the following:
$("#choen-presentacion").val(value.id_presentacion).trigger('chosen:updated')