I am trying to work out an example from another post that I do not have enough reputation to comment on (which would have probably have been better than asking a new question)
I've included the following snippit in my login.js
code as in the linked example.
function send_stuff_to_server(){
var data = {
'action': 'handle_login', // missed this same as your action hook wp_ajax_{handle_login}
'security': MyAjax.security // We can access it this way
}
$.post(MyAjax.ajax_url, data, function (callBack) {
console.log(callBack); // Will return nonce
});
}
HTML/PHP front end
Following another example as a guide, I'm just making a simple button that will allow me to test the send_stuff_to_server
function defined in the external script.
<!--Creating Nonce Here as example-->
<input type="hidden" name="login_nonce" value="<?= wp_create_nonce('login_nonce'); ?>"/>
<input id="clickMe" type="button" value="clickme">
<script>
//- Using a function pointer:
document.getElementById("clickMe").onclick = send_stuff_to_server;
//- Using an anonymous function:
//document.getElementById("clickMe").onclick = function () { alert('hello!'); };
</script>
When I click the button and check the console, I get an error that suggests $ is a problem.
I have tried passing in this jQuery related 'thing' using function send_stuff_to_server($)
and it still isn't happy.
I don't want to use an anonymous function and then define the button onclick action in the external script (such as this). I just want to resolve the JQuery namespace issue with $ and then be able to define the on click method in the the font end code as I am doing.