Not able to set dropdown selected value on connection field from java script

Hi all,

I am trying to set value of the connection field in a dropdown which is mapped with Account Name in the following function in javascipt. But it does not work. Am I doing something wrong?

function setAccountDropDown(accountRecordValue)
{

const dropdown = $('.t-form-connection select.select2-hidden-accessible'); 


const valueToSet = accountRecordValue;

// Check if the select2 instance exists
if (dropdown.hasClass('select2-hidden-accessible')) {
    // Set the value and trigger the change event
    dropdown.val(valueToSet).trigger('change');
     console.log('Value set successfully:', valueToSet);

} else {
    console.error('The dropdown is not initialized as a select2 component.');
}

}

Thanks,
Khalid

I’m not sure if that’s possible, @Khalid!

@partners, any ideas?

Hey @Khalid, I don’t think this is possible, I have tried to do this before as well:

@SuiteUpstairs is there a work-around for that? like save it as text and then copy the value to the dropdown field?

No, I have not been able to make it work that way.

The workaround I use is a two-step form. I add the connection field that I want to set in the first step of the form and hide that field on the form, then make a rule to set the connection field, and then change the submit rules to go to step two of the form.

Typically, I won’t add any other fields to the first step and just rename the button to something like “Create new Invoice” or “Start Quote” so that it doesn’t seem like a two-step form.

Hey you can do this with the following

TB.render('your_component', function(data) {
const joinField = jQuery('#field_block_your_field select.select2', data.ele).select2();
    const values = valueToSet.includes('[') ? JSON.parse(valueToSet.replace(/'/g, '"')) : [valueToSet];
    values.forEach(value => {
        jQuery(joinField).trigger({
            type: 'select2:select',
            params: { data: { id: value } }
        });
    });
    jQuery(joinField).val(values).trigger('change.select2');
    jQuery('#field_block_your_field .select2-container', data.ele).css('width','100%');
});

replace the component Id with the id of the component containing the connection field and replace the your_field text with the field id of the connection field.

1 Like