Add get_option to jquery

Question

Add get_option to jquery

rikardo85

2015年4月16日 20:24

I have created a settings page that contains various radio button options for a custom plugin.

A radio button I've created is to 'display dots' with the values yes or no. I can get use the value any other time except in the jQuery function below.

I would like to get the value of the option to use for 'dots' in the jQuery function below.

jQuery script

script type="text/javascript"
jQuery(document).ready(function(){
  jQuery('.single-item').slick({
    arrows: true,
    dots: ***OPTION VALUE HERE (true or false)***
  });
});

To display the radio buttons I'm using:

 input type="radio" name="testimonial_bullet" id="mws_testimonial_bullet_yes" value="" checked="checked"Yes
 input type="radio" name="testimonial_bullet" id="mws_testimonial_bullet_no" value="no" ?php if (checked( get_option('testimonial_bullet'), 'no' )); ? /No

To get the get_option value, I'm using:

if (get_option('testimonial_bullet') == 'no') {
 // code here
}

Any help much appreciated

Topic radio functions jquery options plugins Wordpress

Category Web

websupporter · Accepted Answer · 2015年4月16日 20:24

Anyway, basically Hody_McGee gave the answer in his comment: You could use wp_localize_script(). As it states in the Codex:

[wp_localize_script()] can be used to make any data available to your script that you can normally only get from the server side of WordPress.

How do we do this?

<?php
add_action( 'wp_enqueue_scripts', 'register_scripts' );
function register_scripts(){
    wp_enqueue_script( 'some_handle', 'path-to-file', array( 'jquery' ) );
    $phpInfo = array(
        'testimonial_bullet' => get_option( 'testimonial_bullet' )
    );
    wp_localize_script( 'some_handle', 'phpInfo', $phpInfo );
}
?>

You extend your function, where you enqueue your script (you enqueue it, right?). After you've did this (or you've registered it), you can use wp_localize_script() to pass an object to this script. In our case, we create an array $phpInfo, which contains the information of the option.

In your script, you can now retrieve the passed content:

jQuery(document).ready(function(){
  if( phpInfo.testimonial_bullet == 'no' )
    var d = '---';
  else
    var d = '...';

  jQuery('.single-item').slick({
    arrows: true,
    dots: d
  });
});

Well, but I don't enqueue

I add this, because I see the <script>-Tag, so these information might be interesting. First of all, you should. Its easy and good practice. Have a look into wp_enqueue_script(). It you still think, it might be better to write it in the header.php or foorter.php, of course there might be reasons to do so. In this case, you can simply retrieve the information like this:

<script>
    jQuery(document).ready(function(){
      if( '<?php echo get_option( 'testimonial_bullet' ); ?>' == 'no' )
        var d = '---';
      else
        var d = '...';

      jQuery('.single-item').slick({
        arrows: true,
        dots: d
      });
    });
</script>

Add get_option to jquery

How do we do this?

Well, but I don't enqueue

About