Arnaud3124
Arnaud3124

Reputation: 23

Slate Foundry : Modify parameter of a Dropdown programmatically

In Slate foundry, I would modify parameter of a Dropdown programmatically. Change the display value or disable value. But it doesn't work.

My code

const select ={{w_selectEndMonthYear}}
select.selectedValue = "202201"
select.selectedDisplayValue = "January 2022"
select.disabled = true
console.log({{w_selectEndMonthYear}})
return {{w_selectEndMonthYear.selectedDisplayValue}}

in my console, I have

{selectedDisplayValue: 'January 2022', selectedValue: '202201', disabled: 'true'}

It seems good, but neither the return nor the display of the widget changed

Thanks for your help

Upvotes: 1

Views: 528

Answers (2)

Marco
Marco

Reputation: 83

The easiest way i via Functions, also to deliver the the content of dropdown. Just a hint, to sort the content you need 'transformColumnSchemaToRowSchema' and 'transformRowSchemaToColumnSchema'

Here is a Slate JavaScript snippet for enabling/disabling a button: Similar you could do this for drop-downs i think.

// Collect Inputs for Validation
// -----------------------------
var inputs = {
    UserID: _.trim(_.toUpper({{w_pD_AdmUserAdd_UserID.text}})),
    Foundry: _.trim({{w_pD_AdmUserAdd_Foundry.placeholder}}),
    NameFirst: _.trim(_.toUpper({{w_pD_AdmUserAdd_NameFirst.text}})),
    NameLast: _.trim(_.toUpper({{w_pD_AdmUserAdd_NameLast.text}})),
    Email: _.trim(_.toUpper({{w_pD_AdmUserAdd_Email.text}})),
    Team: {{w_pD_AdmUserAdd_Team.selectedValue}},
    Company: {{w_pD_AdmUserAdd_Company.selectedValue}}
}
// Initialize Variables
// --------------------
var disable = false;
var messages = [];
// Implement Form Validation Checks
// --------------------------------
// Check if all the required fields have a value
if (!(inputs.UserID &&
     inputs.Foundry &&
 inputs.NameFirst &&
 inputs.NameLast &&
     inputs.Email &&
     inputs.Team &&
     inputs.Company
    )){
disable = true;
messages.push("Please complete all required fields.");
}
var email_regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if (inputs.Email && !email_regex.test(inputs.Email)){
messages.push('Please enter a valid email for "Email"')
disable = true;
}
var data_users = {{s_buyers.data}}
var index_email = data_users.str_email.indexOf(inputs.Email)

if (inputs.Email && index_email !== -1){
  disable = true;
  messages.push('This Email already exist')
}  
var index_userid = data_users.str_buyer_id.indexOf(inputs.UserID)
if (inputs.UserID && index_userid !== -1){
  disable = true;
  messages.push('This User ID already exist')
}
return {
inputs,
disable,
messages
}

Upvotes: 0

Logan Rhyne
Logan Rhyne

Reputation: 601

You're on the right track - to template the selected value of a dropdown list programmatically you need to change to the </> tab of the dropdown widget configuration and use Handlebars to provide a valid default selection for both the the selectedValue and selectedDisplayValue parameter.

Note that you cannot set widget properties from inside a Slate Function. You need to return the value (or a json object with multiple values to reference) and then use a Handlebar statement in the widget configuration to template the appropriate values into the widget configuration.

You can read a bit about this in the context of resetting widget selection state to default values in this section of the documentation.

You can also search your Foundry instance for some helpful Slate tutorials - find the Foundry Training and Resources project and navigate to the Reference Examples/App Building In Slate/1. Tutorials folder to find a series of interactive Slate apps demonstrating the many patterns for using Handlebars, Functions, and other Slate components.

Upvotes: 1

Related Questions