Is it possible to send jQuery variable to function.php, and use it in some php function? Via AJAX or probably.
Theme related, not using a plugin.
Eg. I have some post CSS classes added on 'client side' via jQuery on click.
Can I use this classes on 'server side' so I can pass them in any page of my theme?
WordPress environment
First of all, in order to achieve this task, it's recommended to register then enqueue a jQuery script that will push the request to the server. These operations will be hooked in wp_enqueue_scripts action hook. In the same hook you should put wp_localize_script that it's used to include arbitrary Javascript. By this way there will be a JS object available in front end. This object carries on the correct url to be used by the jQuery handle.
Please take a look to:
File: functions.php 1/2
add_action( 'wp_enqueue_scripts', 'so18550905_enqueue_scripts' );
function so18550905_enqueue_scripts(){
wp_register_script( 'ajaxHandle', get_template_directory() . 'PATH TO YOUR SCRIPT FILE', array(), false, true );
wp_enqueue_script( 'ajaxHandle' );
wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin_ajax.php' ) ) );
}
File: jquery.ajax.js
This file makes the ajax call.
jQuery(document).ready( function($){
//Some event will trigger the ajax call, you can push whatever data to the server, simply passing it to the "data" object in ajax call
$.ajax({
url: ajax_object.ajaxurl, // this is the object instantiated in wp_localize_script function
type: 'POST',
data:{
action: 'myaction', // this is the function in your functions.php that will be triggered
name: 'John',
age: '38'
},
success: function( data ){
//Do something with the result from server
console.log( data );
}
});
});
File: functions.php 2/2
Finally on your functions.php file there should be the function triggered by your ajax call. Remember the suffixes:
These suffixes plus the action compose the name of your action:
wp_ajax_myaction or wp_ajax_nopriv_myaction
add_action( 'wp_ajax_myaction', 'so18550905_wp_ajax_function' );
add_action( 'wp_ajax_nopriv_myaction', 'so18550905_wp_ajax_function' );
function so18550905_wp_ajax_function(){
//DO whatever you want with data posted
//To send back a response you have to echo the result!
echo $_POST['name'];
echo $_POST['age'];
wp_die(); // ajax call must die to avoid trailing 0 in your response
}
Hope it helps!
Let me know if something is not clear.
Yes you can use AJAX to send your jQuery variable. (or any Javascript Variable)
Simply do a JSON.stringify(any-Variable-Here) then you get a corresponding string.
Send the value via AJAX to any php file like:
var toBeSent = JSON.stringify($($('#selector')[0]).attr('class'));
$.ajax({
type: "POST",
url: 'function.php',
data: toBeSent,
success: function(data){ // any action to be performed after function.php returns a value.
},
dataType: 'text'
});
NOTE: I've stringified the items here so that you can access the variables on the server side by doing simple splits.
Sure you can
$('element').click(function(e){
e.preventDefault();
var el = $(this);
//do stuff on click
//send this elements class to the server
$.ajax({
url: "some.php",
data: {
class: el.attr('class')
},
success: function(r){
alert("class name sent successfully to some.php");
}
});
});
another option for you could be $.post()
$(document).ready( function() {
$('#myDiv').click(function(){
var myClass = $(this).attr('class');
var url = 'page.php';
$.post(url, { class: myClass })
.done( function() {
alert('class sent to ' + url);
});
});
});
