Wordpress ajax e extra scripts php - javascript, php, jquery, ajax, wordpress

Eu tenho um formulário simples que estou construindo para o meusite wordpress e eu não consigo descobrir o que estou fazendo de errado. Estou usando o ajax para chamar um script php separado do script function.php genérico (chamei-o de wpplugin.php) para lidar com todos os dados do meu formulário, mas não consigo descobrir se meu arquivo javascript ou a url para o ajax não é desencadeando.

Portanto, tenho 3 arquivos, tenho /wpplugin.php e /upload.php com /code/upload.js.

Para adicionar o arquivo js, ​​uso este código em 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 );
}

e meu ajax do script js é o seguinte:

$("#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;
}
});
}));

Incluo o script js no bloco n html com wpplugin.php assim:

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

O feedback do wordpress é tão limitado que não posso dizer se meu ajax não está acionando ou se js não está sendo usado. Eu testei todo o código no xxamp e em um site online html codificado genérico, ele funciona.

Qualquer conselho é bem-vindo.

Respostas:

1 para resposta № 1

O problema de carregamento do script é porque você está usando plugins_url() na tua functions.php Arquivo.

Da documentação em plugins_url():

Recupera o URL absoluto para o diretório de plug-ins ou mu-plug-ins (sem a barra final) ou, ao usar o argumento $ path, para um arquivo específico naquele diretório.

Fonte: https://codex.wordpress.org/Function_Reference/plugins_url

Supondo que o diretório do seu tema seja assim:

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

O que você quer fazer é editar o seu functions.php arquivo e substitua:

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

com

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

EDIT: Sobre upload.php

O WordPress já possui um sistema embutido para um único endpoint ajax para cada tema e plugin a ser usado.

O endereço do endpoint é o valor de retorno de admin_url( "admin-ajax.php" ), que na prática normalmente funciona para ser mydomain.com/wp-admin/admin-ajax.php.

Visto que cada tema e plugin estão usando o mesmo endpoint, como você distingue suas chamadas de todas as outras?

Há uma propriedade especial que você envia, chamada action. É o que permite ao WordPress saber quem está atingindo o admin-ajax.php.

Todas as informações estão aqui: https://codex.wordpress.org/AJAX_in_Plugins

Um rápido exemplo de como será a aparência é:

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" );

---