How to set a List (Multi Selection) custom attribute via JavaScript API (Secure Mode)

Community Support Testimonials
1

Hi there,

** Context**

  • Framework: React (Vite), vanilla JS for the Tawk API calls
  • Tawk: Secure Mode enabled; identity updates (name/email) work reliably
  • Custom attribute on the same property:
    • Name: Topics
    • Key: topics
    • Format: List (Multi Selection)
      -Options: “CCTV Systems”, “Access Control”, “Door Entry”, “Intruder Alarms”, “Fire Alarms”, “Electrical Services”, “Other”

What works
Identity with Secure Mode updates immediately:

const name='Diag', email='diag@gmail.com';
const { hash } = await fetch('/api/tawk/sign.php?scope=test', {
  method:'POST', headers:{'Content-Type':'application/json'},
  body: JSON.stringify({ email })
}).then(r=>r.json());

** What we tried for Topics**

  1. Array value (matches UI options exactly):
const topics = ['Access Control','Door Entry'];
window.Tawk_API.setAttributes({ topics, hash }, (err) => console.log('topics (array):', err || 'ok'));
  • Often returns: topics: “[JSAPI/setAttributes]: Invalid value for key topics: Access Control,Door Entry”
  1. CSV value:
const topicsCSV = 'Access Control, Door Entry';
window.Tawk_API.setAttributes({ topics: topicsCSV, hash }, (err) => console.log('topics (csv):', err || 'ok'));
  • Callback: “ok”, but the “Topics” field in the About panel still shows “Other” (no change).
  1. Split identity and custom attributes into two calls (to avoid identity being blocked by schema errors):
window.Tawk_API.setAttributes({ name, email, hash }, cb);
window.Tawk_API.setAttributes({ topics, hash }, cb); // or { topics: topicsCSV, hash }
  • Identity: ok
  • Topics: array → “Invalid value”;
    csv → “ok” but UI unchanged.

** Questions**
What is the officially supported value format for setting a List (Multi Selection) custom attribute via the JavaScript API?

  • Array of strings?
  • Comma-separated string?
  • Something else (IDs, lowercase normalized values, etc.)?
1 Like
2

yeah this one trips people up because tawk doesn’t actually use the display labels you see in the dashboard for that field type.

for “List (Multi Selection)” attributes, the API expects the option keys/values exactly as defined internally, not the UI labels, and it usually only accepts a string or array of strings that match the stored option values exactly (case + spacing included). but here’s the annoying part: in a lot of setups it still only reliably takes a single string, not an array, even though the docs make it look like arrays should work.

so in practice the only thing that tends to work consistently is something like:

window.Tawk_API.setAttributes({  topics: "Access Control",  hash});

if you need multiple selections, you often have to either:

  • store them as a single CSV string (and accept that the UI won’t “tick” multiple boxes), or
  • split it into multiple custom attributes (which is ugly but actually works reliably), or
  • use their newer attribute API (if your account has it enabled), because older JSAPI just doesn’t handle multi-select properly in UI rendering

the “Invalid value” error usually means one of the options doesn’t match exactly what’s in the attribute config (even a trailing space breaks it), while the “ok but no UI change” usually means it accepted the payload but silently ignored multi-value mapping.

honestly this isn’t you doing it wrong, it’s just a half-finished implementation on their side depending on which backend version your property is on.