I’m making some of our widgets customiser friendly, so they work on the customise page and support widget previews. Usually when you update a widget the save button becomes usable and changes to ‘save and publish’.
Does anyone have any ideas?
The basic form field is:
<input name="the_token_input" id="" class="the_token_input" value="This will be the token input" />
<ul class="token-input-list"> <li class="token-input-token">Choice 1</li> <li class="token-input-token">Choice 2</li> <li class="token-input-token">Choice 3</li> </ul>
Once you make a change it doesn’t affect the original input field, so I’m guessing that’s why the page doesn’t think anything’s been changed…
I was experiencing a similar problem with one of my custom widgets. It seems that dynamically inserted field values do not trigger the widget form to update. I wound up adding the following to the js that inserts the dynamic value:
where input is the field you are updating.
Not sure if there is a better way to do this, but this is working for me.
Make sure that you trigger a
change event on the
input element. Otherwise, the Customizer won’t know that it has an updated value which needs to get updated in the widget’s setting.