javascript - Wordpress ajax and extra php scripts -

i have simple form building wordpress site , cant seem figure out doing wrong. using ajax call separate php script generic function.php script(i called wpplugin.php) handle form data cant seem figure out if javascript file or url ajax not triggering.

so have 3 files, have /wpplugin.php , /upload.php /code/upload.js.

to add js file use code in wpplugin.php:

add_action( 'wp_enqueue_scripts', 'all_enqueue_scripts' ); function all_enqueue_scripts()   {      wp_enqueue_script( 'uploadjs', plugins_url( '/code/upload.js', __file__), array('jquery'), '1.0', true ); } 

and ajax js script follows:

$("#uploadform").on('submit',(function(e) {     e.preventdefault();     $.ajax({         url: "upload.php",          type: "post",                data: new formdata(this),          contenttype: false,               cache: false,                    processdata:false,               success: function(data)            {             arr = data;         }     }); })); 

i include js script in n html block in wpplugin.php so:

<script src="code/upload.js"> 

the feed wordpress limited cant tell if ajax not triggering or js not being used. have tested code in both xxamp , generic hard coded html online site, works.

any advice welcome.

the script loading issue because you're using plugins_url() in functions.php file.

from documentation on plugins_url():

retrieves absolute url plugins or mu-plugins directory (without trailing slash) or, when using $path argument, specific file under directory.

source: https://codex.wordpress.org/function_reference/plugins_url

assuming theme directory looks this:

|- style.css |- index.php |- functions.php |- code     |- upload.js 

what want edit functions.php file , replace:

wp_enqueue_script( 'uploadjs', plugins_url( '/code/upload.js', __file__), array('jquery'), '1.0', true ); 

with

wp_enqueue_script( 'uploadjs', get_template_directory() . '/code/upload.js', array('jquery'), '1.0', true ); 

edit: upload.php

wordpress has built-in system single ajax endpoint every theme , plugin use.

the endpoint address return value admin_url( 'admin-ajax.php' ), in practice typically works out mydomain.com/wp-admin/admin-ajax.php.

since every theme , plugin using same endpoint, how distinguish calls else?

there's special property send across called action. it's lets wordpress know hitting admin-ajax.php.

all info on here: https://codex.wordpress.org/ajax_in_plugins

a quick sample of this:

js

$("#uploadform").on('submit',(function(e) {     e.preventdefault();     $.ajax({         url: "wp-admin/admin-ajax.php?action=akamaozu_do_frontend_upload",          type: "post",                data: new formdata(this)     }); })); 

functions.php

add_action( 'wp_ajax_akamaozu_do_frontend_upload', 'handle_signed_in_uploads' ); add_action( 'wp_ajax_nopriv_akamaozu_do_frontend_upload', 'handle_signed_out_uploads' );