• An input field that has attached a wpColorPicker instance.
  • An external event that changes the input value color.


  • On value change the color shown by the colorpicker doesn't get automatically updated, neither the selection when user open up the colorpicker dialog box.

  • wpColorPicker doesn't have neitherremove, destroy nor update methods, so there is no simple way to do this.

  • And lastly, they wrap the input field in a bunch of other tags to do the styling, so no simple manual removal can be done.


  • How can I update the color on the widget and its selection when user initiates interaction upon field value change?

1 Answer 1


I was able to solve this by looking into the inner .iris() and check that it has a .('color') method that allows to set a color at runtime.

Thankfully, this .('color') method is supported too by .wpColorPicker(), so one can do:

var new_color = $the_related_field.val();
$the_colorpicker.wpColorpicker('color', new_color);

to overcome the annoyance of not having an update() method.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.