How to reset Enhanced dbjoin element to default value and label?

[mirceat]

Hello,

I need to reset a dbjoin element rendered as dropdown to default value and label. I can reset the value, but the label still remain like it's still selected. This snippet of code works fine only if i disable the Enhanced dropdown option for this element:

...
if (latlon == 1) {
    document.getElementById('aplicatii_pop_search___oras').selectedIndex = 0;
}

Thank you

 

[cheesegrits]

In general, never try and use "native" Javascript or jQuery functions to set Fabrik element values, always go through the Fabrik element object, and use the update() method ...

/**
  * Get the form object.  Replace X with your form ID.  Or you may already have a reference to the form object, like if
  * you  are doing this in an element JS event, it'll be in this.form.
  */
var form = Fabrik.getBlock('form_X');
// get the element object from form.formElements, and call update()
form.formElements.get('aplicatii_pop_search___oras').update('');

Note that update() doesn't use the selectedIndex for a dropdown, it takes the value of the option you want to select. In this case, it looks like you are trying to set it back to "Please Select", which would usually be an empty string (unless you've overridden that).

By doing it this way, the element object itself knows how to "do stuff" to correctly render itself for the new value. So for example, for joins with enhanced dropdowns, the join element knows it has to fire the Javascript event to tell the Chosen (enhanced dropdown library) code that the underlying (and now hidden) select has been changed, so Chosen needs to update the visible, enhanced UI.

So buried in the Fabrik join element code's update() method is ...

                            if (this.options.advanced) {
                                jQuery('#' + this.element.id).trigger('liszt:updated');
                            }

-- hugh