Last active
June 20, 2019 06:18
-
-
Save neilgee/9bb8d424b4a0a7f2e325 to your computer and use it in GitHub Desktop.
wp_localize_script using Booleans & Integers
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
//wp_localize_script by default passes everything in as strings so for booleans and integers when being referenced in your javascript you need to do some trickery | |
//Example 1 - passing in booleans as strings | |
$options = get_option('ng_slicknavmenu'); | |
// Add PHP plugin variables to the $params[] array to pass to jQuery | |
$data = array ( | |
'ng_slicknav_menu' => $options['ng_slicknav_menu'], | |
'ng_slicknav_position' => $options['ng_slicknav_position'], | |
'ng_slicknav_parent_links' => $options['ng_slicknav_parent_links'],//boolean | |
'ng_slicknav_child_links' => $options['ng_slicknav_child_links'],//boolean | |
'ng_slicknav_speed' => $options['ng_slicknav_speed'] ,//integer | |
'ng_slicknav_label' => $options['ng_slicknav_label'], | |
); | |
// Pass PHP variables to jQuery script | |
wp_localize_script( 'slickinit', 'phpVars', $data ); | |
wp_enqueue_script( 'slickinit' ); | |
//Example 2 - passing in booleans and integers as the correct type by nesting the array in another for protection | |
//And by casting the data type such as (bool) and (int) | |
$options = get_option('ng_slicknavmenu'); | |
$data = array ( | |
'ng_slicknav' => array(//array nested to protect boolean and integer values | |
'ng_slicknav_menu' => $options['ng_slicknav_menu'], | |
'ng_slicknav_position' => $options['ng_slicknav_position'], | |
'ng_slicknav_parent_links' => (bool) $options['ng_slicknav_parent_links'], // this is a boolean true/false | |
'ng_slicknav_child_links' => (bool) $options['ng_slicknav_child_links'], // this is a boolean true/false | |
'ng_slicknav_speed' => (int) $options['ng_slicknav_speed'],//this is an integer | |
'ng_slicknav_label' => $options['ng_slicknav_label'], | |
), | |
); | |
// Pass PHP variables to jQuery script | |
wp_localize_script( 'slickinit', 'phpVars', $data ); | |
wp_enqueue_script( 'slickinit' ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
//Our Plugin Function Registering and Enqueing our needed scripts | |
function wpb_scripts_styles() { | |
//Our main JQuery init script | |
wp_register_script ( 'jsinit' , plugins_url( '/js/js-init.js', __FILE__ ), array( 'jquery' ), '1.0.0', false ); | |
//Calling our stored db wp_options field | |
$options = get_option( 'wpb_stored_options_test' ); | |
//Wrapping our values in an array = $data | |
$data = array ( | |
//Wrapping our values in an inner array to protect boolean and integers = wpb_stored | |
'wpb_stored_inner' => array( | |
//Assigning our required values from the db | |
'wpb_stored_name' => esc_html( $options['wpb_stored_name'] ), //this is a string | |
'wpb_stored_string' => esc_html( $options['wpb_stored_string'] ), //this is a string | |
'wpb_stored_truth' => (bool)$options['wpb_stored_truth'], // this is a boolean true/false | |
'wpb_stored_number' => (int)$options['wpb_stored_number'], // this is an integer | |
), | |
); | |
// Pass PHP variables to jQuery init script 'jsinit' | |
wp_localize_script( 'jsinit', 'phpVars', $data ); | |
// Enqueing our init script after wp_localise_script | |
wp_enqueue_script( 'jsinit' ); | |
} | |
add_action( 'wp_enqueue_scripts', 'wpb_scripts_styles' ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Example 1 - Javascipt init file - using variables for Boolean and parseInt for Integer | |
//deal with the boolean | |
if( phpVars.ng_slicknav_parent_links === "true" ) | |
$links = true; | |
else | |
$links = false; | |
if( phpVars.ng_slicknav_child_links === "true" ) | |
$child = true; | |
else | |
$child = false; | |
jQuery(document).ready(function($){ | |
ng_slicknav_speedInt = parseInt(phpVars.ng_slicknav_speed, 10); //deal with the integer | |
jQuery(document).ready(function($) { | |
$(phpVars.ng_slicknav_menu).slicknav({ | |
prependTo:phpVars.ng_slicknav_position, | |
label:phpVars.ng_slicknav_label, | |
allowParentLinks:$links, | |
duration: ng_slicknav_speedInt, | |
showChildren: $child, | |
}); | |
}); | |
}); | |
//results in | |
/* <![CDATA[ */ | |
var phpVars = {"ng_slicknav_menu":"#menu-primary-navigation-1","ng_slicknav_position":"body","ng_slicknav_parent_links":"true","ng_slicknav_child_links":"false","ng_slicknav_speed":"400","ng_slicknav_label":"MENUGEDD0N"}; | |
/* ]]> */ | |
//Example 2 - Javascipt init file - values are being referenced using the nested array | |
jQuery(document).ready(function($) { | |
$(phpVars.ng_slicknav.ng_slicknav_menu).slicknav({ | |
prependTo:phpVars.ng_slicknav.ng_slicknav_position, | |
label:phpVars.ng_slicknav.ng_slicknav_label, | |
allowParentLinks:phpVars.ng_slicknav.ng_slicknav_parent_links, | |
duration: phpVars.phpVars.ng_slicknav.ng_slicknav_speed, | |
showChildren:phpVars.ng_slicknav.ng_slicknav_child_links, | |
}); | |
}); | |
//results in | |
<script type="text/javascript"> | |
/* <![CDATA[ */ | |
var phpVars = {"ng_slicknav":{"ng_slicknav_menu":"#menu-primary-navigation","ng_slicknav_position":".navicon","ng_slicknav_parent_links":true,"ng_slicknav_child_links":true,"ng_slicknav_speed":600,"ng_slicknav_label":"ohhellomrmagoo"}}; | |
/* ]]> */ | |
</script> | |
//this returns proper formed boolean and integer values |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery(document).ready(function($) { | |
$(phpVars.wpb_stored_inner.wpb_stored_options_test).jquerysomething({ | |
prependTo: phpVars.wpb_stored_inner.wpb_stored_name, | |
label: phpVars.wpb_stored_inner.wpb_stored_string, | |
duration: phpVars.wpb_stored_inner.wpb_stored_number, | |
showChildren: phpVars.wpb_stored_inner.wpb_stored_truth, | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
//Our Plugin Function Registering and Enqueing our needed scripts | |
function wpb_scripts_styles() { | |
//Our main JQuery init script | |
wp_register_script ( 'jsinit' , plugins_url( '/js/js-init.js', __FILE__ ), array( 'jquery' ), '1.0.0', false ); | |
//Calling our stored db wp_options field | |
$options = get_option( 'wpb_stored_options_test' ); | |
//Wrapping our values in an array = $data | |
$data = array ( | |
//Wrapping our values in an inner array to protect boolean and integers = wpb_stored | |
'wpb_stored_name' => esc_html( $options['wpb_stored_name'] ), //this is a string | |
'wpb_stored_string' => esc_html( $options['wpb_stored_string'] ), //this is a string | |
'wpb_stored_truth' => $options['wpb_stored_truth'], // this is a boolean true/false | |
'wpb_stored_number' => $options['wpb_stored_number'], // this is an integer | |
); | |
// Pass PHP variables to jQuery init script 'jsinit' | |
wp_localize_script( 'jsinit', 'phpVars', $data ); | |
// Enqueing our init script after wp_localise_script | |
wp_enqueue_script( 'jsinit' ); | |
} | |
add_action( 'wp_enqueue_scripts', 'wpb_scripts_styles' ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery(document).ready(function($) { | |
$(phpVars.wpb_stored_options_test).jquerysomething({ | |
prependTo: phpVars.wpb_stored_name, | |
label: phpVars.wpb_stored_string, | |
duration: phpVars.wpb_stored_number, | |
showChildren: phpVars.wpb_stored_truth, | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The easiest way is actually using json_encode...Ex:
$array = array(
'key' => json_encode( false ),
);