Title: WP Customizer. How to set a value using javascript.
Last modified: September 2, 2016

---

# WP Customizer. How to set a value using javascript.

 *  [Liddika](https://wordpress.org/support/users/liddika/)
 * (@liddika)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/wp-customizer-how-to-set-a-value-using-javascript/)
 * I am trying to find a way to send a value between 2 setting fields inside of 
   the wordpress customizer.
 * My further goal is to create a preset button. I click a button inside of the 
   customizer, and it applies pre-created values to all the other fields.
 * To make it easier, here is a basic example:
 * I have 2 option fields inside of WP customizer.
    When I change the value of field
   1, I would like that field 2, automatically updates to that value as well.
 *     ```
       theme-customizer.js
   
           // Field 1
           	wp.customize( 'field1', function( value ) {
           		value.bind( function( newval ) {
           				//no need to make any css changes with this field.
           		} );
           	} );	
   
       	// Field 2
           	wp.customize( 'field2', function( value ) {
           		value.bind( function( newval ) {
           			$('.site-container').css('border-style', newval +'px' );
           		} );
           	} );
       ```
   
 * Is there away that I could update the value of field2 when field1 is clicked?
 * For example:
 *     ```
           // Field 1
           	wp.customize( 'field1', function( value ) {
           		value.bind( function( newval ) {
           				wp.customize.value( 'field2 )(newval);//Setting the new value.
           		} );
           	} );	
       ```
   
 * This does work on the live preview, but the new value of field2 is not being 
   saved when I click save.
    It seems the value is not being put through to PHP 
   when using
 *  `wp.customize.value( 'field2 )(newval);`
    -  This topic was modified 9 years, 9 months ago by [Liddika](https://wordpress.org/support/users/liddika/).
    -  This topic was modified 9 years, 9 months ago by [Liddika](https://wordpress.org/support/users/liddika/).

Viewing 1 replies (of 1 total)

 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/wp-customizer-how-to-set-a-value-using-javascript/#post-7723158)
 * I don’t have a lot of knowledge of the inner workings of the Customizer, but 
   I believe the `value.bind()` method is strictly for affecting the preview, it
   does not affect the actual customizer fields. I think to affect other customizer
   fields you need to fall back to basic JavaScript and jQuery. In the `wp.customize()`
   callback function for ‘field1’, either before or after `value.bind()`, add something
   like this:
    `$('#customize-control-field2 input').val( value.val());`
 * My example is probably wrong in many ways, the selector might be wrong, and `
   value.val()` is a wild guess, I’ve no idea what the structure of `value` is. 
   The idea is to simply set the field2 input value to that of field1 using normal
   jQuery.
 * You could even get farther removed from customizer JS if need be. Bind an onchange
   event handler to field1 that sets the same value to field2 using normal jQuery.
   Approach the problem as a normal HTML form where one value is reflected in another
   field. Forget that it’s a customizer form.
    -  This reply was modified 9 years, 9 months ago by [bcworkz](https://wordpress.org/support/users/bcworkz/).

Viewing 1 replies (of 1 total)

The topic ‘WP Customizer. How to set a value using javascript.’ is closed to new
replies.

 * In: [Hacks](https://wordpress.org/support/forum/plugins-and-hacks/hacks/)
 * 1 reply
 * 2 participants
 * Last reply from: [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * Last activity: [9 years, 9 months ago](https://wordpress.org/support/topic/wp-customizer-how-to-set-a-value-using-javascript/#post-7723158)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics