0

The below code produces an error:

Notice: wp_enqueue_script was called incorrectly. Scripts and styles should not be registered or enqueued until the wp_enqueue_scripts, admin_enqueue_scripts, or login_enqueue_scripts hooks. This notice was triggered by the waitlist_update_call handle. Please see Debugging in WordPress for more information. (This message was added in version 3.3.0.) in /home/food/domains/xyz.com/public_html/wp-includes/functions.php on line 5225"

It also shows an error in the console of:
POST https://theste.com/wp-admin/admin-ajax.php 400 (Bad Request)

PHP code in my functions file

wp_enqueue_script( 'update_call', 
                    get_theme_file_uri( '/assets/js/update_call.js' ), 
                    array('jquery'), null, true );
wp_localize_script('update_call', 'my_ajax', 
                   array('ajax_url' => admin_url('admin-ajax.php')));

//calls Waitinglist data and creates table
add_action('wp_ajax_function_1', 'update_function'); // logged in user can make a call
add_action('wp_ajax_nopriv_function_1', 'update'); // non logged in user can make a call

function update_function() {
    global $wpdb;
    $results = $wpdb->query( $wpdb->prepare("UPDATE 'my_table_name' SET `currentstatus` =
    'myupdate1' WHERE ID = '1'"));
    die($results);
}

EDIT 1:

I was trying to call it directly. Please excuse my newness.Ok the fist below solved Enqueue issue but POST 400 error remains. The error is

POST https://x.com/wp-admin/admin-ajax.php 400 (Bad Request)

When clicking my button that is supposed to trigger I get -

Uncaught ReferenceError: update_functionis not defined
    at HTMLButtonElement.onclick

I have changed my PHP in the functions file to:

function my_scripts() {   
wp_enqueue_script( 'update_call', get_theme_file_uri( '/assets/js/update_call.js' ), array('jquery'), null, true );
wp_localize_script('update_call', 'my_ajax', array('ajax_url' => admin_url('admin-ajax.php')));
//calls Waitinglist data and creates table
}
add_action('wp_enqueue_scripts', 'my_scripts');

add_action('wp_ajax_function_1', 'waitlist_update'); // logged in user can make a call

function waitlist_update() {
    global $wpdb;
    $results = $wpdb->query( $wpdb->prepare("UPDATE 'wp_wpdatatable_4' SET `currentstatus` = 
    'myupdate1' WHERE wdt_ID = '1'"));
    die($results);

}

Seperate JS file is :

// JavaScript Document
jQuery.ajax({
    type: 'post',
    url: my_ajax.ajax_url,
    action: 'waitlist_update',
    success: function(data){
        // callback function
    }
});

and HTML is:

<button class="seat-btn" ID="update" onclick="update_function()">Go!</button>

1 Answers1

0

WordPress provides hooks to enqueue scripts properly.

You might have called the enqueue method directly. It should be in action callback of wp_enqueue_scripts hook.

function my_scripts() {    
wp_enqueue_script('update-call', get_template_directory_uri() . '/assets/js/update_call.js', array('jquery'), false, true);
wp_localize_script('update-call', 'my_ajax', array(
        'ajax_url' => admin_url('admin-ajax.php')
    ));
}
add_action('wp_enqueue_scripts', 'my_scripts');

Also,

//calls Waitinglist data and creates table
add_action('wp_ajax_function_1', 'update_function'); // logged in user can make a call
add_action('wp_ajax_nopriv_function_1', 'update_function'); // non logged in user can make a call

If you check my previous answer in old question. The function_1 is an action requested from AJAX call and update_function is the function name that we should call when the action is triggered. Users who are not logged in upon triggering the action will call to the function update according to your code above which is incorrect.

If you only want to allow the logged in users to make this request, you can remove the second action attached for non logged in users.

add_action('wp_ajax_nopriv_function_1', 'update_function'); // notice the nopriv?

Note: The ajax action name should match the action hook.

jQuery.ajax({
//...
data: {
  action: 'action_name'
}
});
// The action name should be same wp_ajax_{action_name} from whatever defined in jQuery action 
add_action('wp_ajax_action_name', 'update_function')
Ashish Yadav
  • 1,901
  • 2
  • 17
  • 23
  • thanks so much again for the detailed answer. I am really new at this but trying my hardest. I am stil missing something. I got the enqueue errors fixed but am left with the two above in my edits including a bad 400 POST –  Sep 18 '20 at 02:53
  • @Theodore The issue regarding 400 is, due to issue on the ajax action `wp_ajax_{action_name}`. `{action_name}` should be replace with whatever name you will use in `action: action_name` inside `jQuery.ajax`. Regarding the update_function is not defined, when button is clicked it is calling `update_function` which is not defined in the fine. You need to create a function name `update_function` and then add `ajax` code inside it. – Ashish Yadav Sep 18 '20 at 03:04
  • Please check the note section. I have updated the answer. – Ashish Yadav Sep 18 '20 at 03:09
  • Thanks. I have a new problem now that I corrected the above. Here is the issue I posted. I don't know why I seem to be having so much trouble with this. https://stackoverflow.com/questions/63980652/directory-structure-issue-when-calling-a-js-file-and-ajax –  Sep 20 '20 at 16:30