Changing data-attribute on select2

418 views Asked by At

I working on an older legacy system using select2 3.5.2.

It's using the older hidden field method, and it currently passes data like so:

<input class="select2" data-url="/mapscrSearch/filterdata" data-parent="3" data-model="VMapscreenCategories" data-tags="1" data-searchterm="name" data-showitem="name" data-hiddenfield=".opcode_filters" data-allowuserinput="" data-enabled="1" type="text" value="" name="opcode_id" id="opcode_id" tabindex="-1" style="display: none;">

Right now, I have a small jquery function that changes the data-parent on the fly, and pulls in the correct data depending on the parent id; This works if I set data-parent manually, but when changing the data-parent via jquery it doesn't update the select2 component.

For example, I currently have:

$(document).ready(function(){
   var opCodeFamily = $('#category_parent');
   var opCodeParentId = $('#opcode_parent_id');
   var opCodeDataUrl = $('#opcode_id');

   // Set default
  $(opCodeParentId).val($(opCodeFamily).val());
  $(opCodeDataUrl).attr('data-parent', opCodeParentId.val());

  // Change the value from parent select
  $(opCodeFamily).change(function(){
  $(opCodeParentId).val($(opCodeFamily).val());
  $(opCodeDataUrl).attr('data-parent', opCodeParentId.val()).trigger("change");
       console.log('data-parent set to: ' + opCodeParentId.val() + ', select2 passing: ' + opCodeDataUrl.data('parent')); 
  }).trigger("change")

});

I can see it changing the data-parent in the console and inspector, but select2 is still passing the original value. I've looked at trigger, but this doesn't seem to do anything. Is there something I'm missing?

0

There are 0 answers