我试图在我的第一个WordPress应用程序中创建一个表单,但当我使用$.ajax()
发送Post数据时,我得到错误“Bad request”。
的数据
我尝试了几种解决方案,甚至使用聊天GTP,但我不能修复这个错误。
任何帮助将非常感激。
我的JS代码:
jQuery(document).ready(function($) {
// Verificar si my_ajax_obj está definido
if (typeof my_ajax_obj !== 'undefined') {
console.log(my_ajax_obj);
// Capturamos el evento submit del formulario
$("#dhl_guias_form").on("submit", function(event) {
event.preventDefault();
// Serializamos los datos del formulario y los convertimos en JSON
var formData = $("#dhl_guias_form").serialize()
console.log(formData);
// Realizamos la solicitud POST utilizando $.ajax
jQuery.ajax({
type: "POST",
url: my_ajax_obj.ajax_url,
data: formData,
action: 'astral_save_form',
beforesend: function(){
alert("hello");
console.log("ajax");
console.log(my_ajax_obj);
console.log(my_ajax_obj.ajax_url);
},
nonce: my_ajax_obj.nonce,
success: function(response) {
// Éxito en la solicitud
console.log(response);
console.log("OK");
},
error: function(xhr, status, error) {
// Error en la solicitud
console.log(error);
console.log("error");
}
});
});
} else {
console.log("my_ajax_obj no está definido");
}
});
字符串
我的PHP代码:
<?php
/*
Plugin Name: Astral
Plugin URI: https://www.ejemplo.com
Description: Descripción del plugin.
Version: 1.0
Author: Tu Nombre
Author URI: https://www.tunombre.com
*/
// Activar el plugin
register_activation_hook(__FILE__, 'astral_plugin_activation');
function astral_plugin_activation() {
// Código para activar el plugin
global $wpdb;
$table_name = $wpdb->prefix . 'dhl_guias'; // Nombre de la tabla
$charset_collate = $wpdb->get_charset_collate();
$sql = "CREATE TABLE $table_name (
id INT NOT NULL AUTO_INCREMENT,
nombre VARCHAR(100) NOT NULL,
direccion VARCHAR(100) NOT NULL,
PRIMARY KEY (id)
) $charset_collate;";
require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
dbDelta($sql);
}
// Desactivar el plugin
register_deactivation_hook(__FILE__, 'astral_plugin_deactivation');
function astral_plugin_deactivation() {
// Código para desactivar el plugin
}
function astral_create_menu() {
add_menu_page(
'Astral', // Título de la Página
'Astral Menu', // Título del Menú
'manage_options', // Capability
'astral-menu', // Slug del Menú
'astral_menu_callback', // Callback para mostrar el contenido del menú
'dashicons-admin-generic', // Icono
1 // Posición del menú en el panel de administración
);
}
add_action('admin_menu', 'astral_create_menu'); // Crear Menú
function astral_menu_callback() {
// Código para mostrar el contenido del menú Astral
include plugin_dir_path(__FILE__) . 'astral_visual.php';
}
add_action( 'admin_enqueue_scripts', 'my_enqueue' );
function my_enqueue( $hook ) {
if ( 'toplevel_page_astral-menu' !== $hook ) {
return;
}
wp_enqueue_script(
'ajax-script',
plugins_url( 'js/astral.js', __FILE__ ),
array( 'jquery' ),
);
$title_nonce = wp_create_nonce( 'title_example' );
wp_localize_script(
'ajax-script',
'my_ajax_obj',
array(
'ajax_url' => admin_url( 'admin-ajax.php' ),
'nonce' =>wp_create_nonce( 'nonce' )
)
);
}
add_action('wp_ajax_astral_save_form', 'astral_save_form');
function astral_save_form() {
check_ajax_referer('astral_ajax_nonce', 'nonce'); // Verificar el nonce para mayor seguridad
global $wpdb;
$table_name = $wpdb->prefix . 'dhl_guias';
$field1 = sanitize_text_field($_POST['field1']);
$field2 = sanitize_text_field($_POST['field2']);
$wpdb->insert(
$table_name,
array(
'id' => NULL,
'nombre' => $field1,
'direccion' => $field2
)
);
wp_die(); // Finaliza la ejecución de la solicitud AJAX
}
型
我的表单(astral_visual.php):
<form id="dhl_guias_form" method="POST">
<input type="text" name="field1" placeholder="Campo 1" /><br>
<input type="text" name="field2" placeholder="Campo 2" /><br>
<button type="submit" id="save" name="save">GUARDAR</button>
</form>
型
1条答案
按热度按时间5cnsuln71#
你的代码中有一些错误和错误。
注意:由于Stack Overflow是一个英语社区,我几乎翻译了所有内容。
PHP主插件代码:
字符串
HTML表单(添加到astral_visual. php外部文件):
型
jQuery / JavaScript astral.js外部文件
型
经过测试,工作正常。填写表单后,将向数据库表中添加一个条目。