How to pass results from jQuery function to PHP

Question

I have a list of dropdown options for a survey, and am counting their choices using jquery. The counting code works fine and has been confirmed. The trouble comes with passing the variable to PHP (from what I've read, I'll need to use the POST function but am having trouble) in order to modify the user's meta data based on the survey responses.

Here's the jquery / counting code which works fine:

$('select').change(function() {
    // get all selects
    var eSelects = $('select.e');

    // set values count by type
    var eyes = 0;

    // for each select increase count
    $.each(eSelects, function(i, s) {
        // increase count
        if($(s).val() == '1') { eyes++; }
    });

    // update count values summary
    $('.cnteyes').text(eyes);
});

And here's the PHP which is not working (don't understand how to use the POST function, so left that out):

<?php
$response = 'cnteyes';
if ( ! add_user_meta( get_current_user_id(), 'survey', $response, true )) {
   update_user_meta ( get_current_user_id(), 'survey', $response );
}

echo get_user_meta( get_current_user_id(), 'survey', true );
?>

Any help would be greatly appreciated! I'm completely stuck and do not understand how to pass jquery to PHP. Thanks for your time.

Use jquery ajax . you can refer this link http://api.jquery.com/jquery.ajax/ — Domain, Mar 02 '16 at 04:26
Possible duplicate of [How to pass JavaScript variables to PHP?](http://stackoverflow.com/questions/1917576/how-to-pass-javascript-variables-to-php) — Dave, Mar 02 '16 at 04:31

score 0 · Answer 1 · answered Mar 02 '16 at 04:34

You can pass data through POST using jQuery.ajax

**JS File**
 $.ajax({
    url: "path/to/php/file.php",
    type: "POST",
    data: {
    'someData': 'someData' //you pass your results here
    },
    datatype: "json",
    success: function (result) {
    }
});

**PHP File**

<?php

$someDate = $_POST['someData']; // you access your results here

?>

score 0 · Answer 2 · answered Mar 02 '16 at 04:35

// update count values summary
    $('.cnteyes').text(eyes);

Above Code should be changed to

// update count values summary
    $('.cnteyes').val(eyes);

text() function just fills the input with the text provided but not the value. But Val() function will set the value of the input object to the provided one.

Also on the php snippet the $response should be set to $_POST['cnteyes']

<?php
$response = $_POST['cnteyes'];
if ( ! add_user_meta( get_current_user_id(), 'survey', $response, true )) {
   update_user_meta ( get_current_user_id(), 'survey', $response );
}

echo get_user_meta( get_current_user_id(), 'survey', true );
?>

I guess you are using the form post. else you may need to post the data via ajax. — Shyam Achuthan, Mar 02 '16 at 04:38

score 0 · Answer 3 · edited May 23 '17 at 12:23

What you want is AJAX, which is asynchronous JavaScript and XML. The answer by @marcus-ekwall here should point you in the right direction, but the short of it is that POST and GET are ancient pre-JavaScript methods that (among other things) result in page refreshes.

Tutorials Point introduces AJAX as follows:

Conventional web application transmit information to and from the sever using synchronous requests. This means you fill out a form, hit submit, and get directed to a new page with new information from the server. With AJAX when submit is pressed, JavaScript will make a request to the server, interpret the results and update the current screen. In the purest sense, the user would never know that anything was even transmitted to the server.

You may want to begin by looking at their PHP and AJAX Example.

score 0 · Answer 4 · answered Mar 02 '16 at 04:42

You can try this.

js code

$('select').change(function() {
    // get all selects
    var eSelects = $('select.e');

    // set values count by type
    var eyes = 0;

    // for each select increase count
    $.each(eSelects, function(i, s) {
        // increase count
        if($(s).val() == '1') { eyes++; }
    });
     $.post( 
                  "result.php",
                  { eye: eyes },
                  function(data) {
                      $('.cnteyes').val(eyes);
                  }
               );   
});

result.php

<?php
if( $_REQUEST["eye"] ) {

   $response = $_REQUEST['eye'];
  //write your code here.
}

How to pass results from jQuery function to PHP

4 Answers4