0

So I'm having a bit of difficulty getting user input to post to my database.

Whenever I try to update the table, I am able to do it successfully on the front end, but on refresh, the data change does not stick. Checking the database further verifies that the data has not been changed... It seems like the "success" is passing in the AJAX, but for some reason, it's not updating the database.

In fact, for my HTTP request, Chrome tells me that my POST request is being processed as a GET request for some reason and I'm not sure why...

JS:

    jQuery(document).ready(function($){
  $(".edit_tr").click(function () {
    var commitID = $(this).attr('id');
    // on click, hide the text
    $("#name_"+commitID).hide();
    $("#created_"+commitID).hide();
    $("#status_"+commitID).hide();
    $("#disbanded_"+commitID).hide();

    // on click, show the input fields for editing
    $("#name_input_"+commitID).show();
    $("#created_input_"+commitID).show();
    $("#status_input_"+commitID).show();
    $("#disbanded_input_"+commitID).show();
  }).change(function() {
    var commitID = $(this).attr('id');
    var name = $("#name_input_"+commitID).val();
    var date_created = $("#created_input_"+commitID).val();
    var status = $("#status_input_"+commitID).val();
    var disbanded = $("#disbanded_input_"+commitID).val();
    var dataString = {
     id: commitID,
     name: name,
     date_created: date_created,
     status: status,
     disbanded: disbanded
    };

    console.log(dataString);
    // can place loading image here

    jQuery.post({
      url: "/wp-admin/admin-ajax.php",
      data: dataString,
      action: 'editCommittee',
      error: function(xhr, status, error) {
        var err = eval("(" + xhr.responseText + ")");
        alert(err.Message);
      },
      success: function (response) {
        $("#name_"+commitID).html(name);
        $("#created_"+commitID).html(date_created);
        $("#status_"+commitID).html(status);
        $("#disbanded_"+commitID).html(disbanded);
        console.log("Got this from server: " + response);
        console.log("This is what happened to data: ");
        console.dir(dataString);
      }
    });
});

functions.php:

add_action('wp_ajax_editCommittee', 'editCommittee');

add_action('wp_ajax_nopriv_editCommittee', 'editCommittee');

function editCommittee() {
  global $wpdb;

    if($_POST['id']) {
      $id = esc_sql($_POST['id']);
      $name = esc_sql($_POST['name']);
      $created = esc_sql($_POST['date_created']);
      $status = esc_sql($_POST['status']);
      $disbanded = esc_sql($_POST['disbanded']);

      $wpdb->update('wp_committees',
                    array(
                        'name' => $name
                    ),

                    array(
                        'committee_id' => $id
                    ),

                    array(
                      '%s'
                    )
      );
      exit;
    }
}

My data on the front end is being printed out into a table, so I don't have a form... Any insight on this would be helpful!

Edit:

var_dump($_REQUEST); on the page that is outputting the data in the table gives array(0){}twelve times-- the same number of items that I'm printing in the table.

var_dump($_REQUEST); on functions.php doesn't print anything

console.log(response) on JS file prints 0.

Regardless if I put var_dump($_REQUEST) in the if statement (before $wpdb->update) or before the if statement, nothing gets printed.

Edit 2:

function getAjax() {
  wp_register_script('ajax_url_script', get_template_directory_uri() . '/js/edit.js', array('jQuery'));
  wp_localize_script( 'ajax_url_script', 'postAjax', array('ajaxurl' => admin_url( 'admin-ajax.php' )));
  wp_enqueue_script( 'ajax_url_script');
}
add_action( 'wp_enqueue_scripts', 'getAjax' );
  • Can you var_dump($_REQUEST); then console.log(response); in your JS? – jgraup Nov 12 '16 at 17:13
  • var_dump($_REQUEST); on the page that is outputting data gives me array(0) { } twelve times-- the exact number of items I'm printing in the table. var_dump($_REQUEST) on functions.php doesn't print anything. console.log(response) on JS file prints 0. – sleepy_daze Nov 12 '16 at 17:20
  • No, I would throw that in before you $wpdb->update to see the data that is trying to into the DB. And log it in JS. You can post in your question because it's hard to read as a comment. Thanks – jgraup Nov 12 '16 at 17:22
  • Sorry about that! I've updated my post with the information I mentioned before and with what happens if I put var_dump($_REQUEST) before $wpdb->update. Thank you so much for helping! – sleepy_daze Nov 12 '16 at 17:33
  • The exit is in the if statement. Put the exit at the bottom of the function and put the var dump there. It looks like id isn't coming through. 0 usually shows up when you haven't handled the function properly. – jgraup Nov 12 '16 at 17:38
0

To test your AJAX is working

add_action( 'wp_ajax_editCommittee', 'test_ajax_request' );
add_action( 'wp_ajax_nopriv_editCommittee', 'test_ajax_request' );
function test_ajax_request() {

    echo "Request: " . PHP_EOL;

    var_dump( $_REQUEST );

    exit;
}

And update your request to move the action into the data sent:

jQuery (document).ready (function($) {


    $ (".edit_tr").click (function() {


        var commitID = $ (this).attr ('id');

        // on click, hide the text
        $ ("#name_" + commitID).hide ();
        $ ("#created_" + commitID).hide ();
        $ ("#status_" + commitID).hide ();
        $ ("#disbanded_" + commitID).hide ();

        // on click, show the input fields for editing
        $ ("#name_input_" + commitID).show ();
        $ ("#created_input_" + commitID).show ();
        $ ("#status_input_" + commitID).show ();
        $ ("#disbanded_input_" + commitID).show ();

    }).change (function() {

        var commitID = $ (this).attr ('id');
        var name = $ ("#name_input_" + commitID).val ();
        var date_created = $ ("#created_input_" + commitID).val ();
        var status = $ ("#status_input_" + commitID).val ();
        var disbanded = $ ("#disbanded_input_" + commitID).val ();
        var dataString = {
            action: 'editCommittee',
            id: commitID,
            name: name,
            date_created: date_created,
            status: status,
            disbanded: disbanded
        };

        console.log (dataString);
        // can place loading image here

        $.ajax({
            type : "post", 
            url: "/wp-admin/admin-ajax.php",
            data: dataString, 
            error: function(xhr, status, error) {
                var err = eval ("(" + xhr.responseText + ")");
                alert (err.Message);
            },
            success: function(response) {
                $ ("#name_" + commitID).html (name);
                $ ("#created_" + commitID).html (date_created);
                $ ("#status_" + commitID).html (status);
                $ ("#disbanded_" + commitID).html (disbanded);
                console.log ("Got this from server: " + response);
                console.log ("This is what happened to data: ");
                console.dir (dataString);
            }
        });
    });

I you still don't get anything it's probably your URL. You can try to localize the admin-ajax.php URL like this answer shows: https://stackoverflow.com/a/22007593/5623301

  • Yep, still nothing. So localize admin-ajax.php like Edit 2: above and place in functions.php? – sleepy_daze Nov 12 '16 at 17:59
  • It keeps says postAjax is undefined... any ideas? – sleepy_daze Nov 12 '16 at 18:22
  • You didn't do it correctly. If you localize the script, which mean just printing the variables before the JS script, then you should have access to it. Perhaps you need to use an admin hook like - codex.wordpress.org/Plugin_API/Action_Reference/… – jgraup Nov 12 '16 at 18:33
  • I just fixed it! It turns out that it wasn't processing it because I used jQuery instead of jquery – sleepy_daze Nov 12 '16 at 18:33
  • Nice! glad you fixed it. – jgraup Nov 12 '16 at 18:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.