Question

我已阅读此帖，Jquery Ajax call in wordpress plugin page not working ...

这是非常接近我的问题....我有一个非常基本的Wordpress插件，提供一个非常具体的会员表格，它将付款传递给PayPal处理，只发送输入数据的电子邮件。使用相同的按钮点击PayPal按钮，还有一个jQuery脚本来提取单击提交按钮并传递相同的数据以生成不同的电子邮件消息。

在将其移至Wordpress之前，这一切都正常工作，现在在Wordpress插件下，除了点击提交按钮上的AJAX功能外，它都能正常工作。当提交付款表单时，有jQuery脚本来提取点击提交按钮，然后它通过AJAX发送付款表单数据。

这是js文件...当我检查页面源代码时，我看到正确的Wordpress标题行包含js脚本并在源代码中选择链接我得到了正确的js文件。此外，当未注释时，警报（“帮助”）也会弹出。

jQuery(document).ready(function(){
  jQuery('#paypal').submit(function(){
       //alert("help");
       jQuery.ajax({
         url : ajax_object.ajaxurl,
         type: 'POST',
         action: 'memreg_process_request',
         //Is this the correct way to pass form data under Wordpress.
         data: $(this).serialize(),
         success: function( data ){
           //Do something with the result from server
           console.log( data );
         }
       });
  });                      
});

以下是Wordpress中myplugin中的代码.....

function myplugin_register_script() 
{
  // Register the style 
wp_register_script('jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', false, '1.10.2', false) ;
  wp_register_script('memreg_process', plugins_url( '/js/memreg.js',__FILE__), false, '1.0.0', false) ;
  // enqueing:
  wp_enqueue_script('jquery');
  wp_enqueue_script('memreg_process');
  wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin_ajax.php' ) ) );
}

function myplugin_styles()  
{ 
  // Register the style
  wp_register_style( 'memreg_style', plugins_url('style.css', __FILE__),false, '1.0.0', false );
  // enqueing:
  wp_enqueue_style( 'memreg_style' );
}
add_action('wp_enqueue_scripts', 'myplugin_register_script');
add_action('wp_enqueue_scripts', 'myplugin_styles');

add_action( 'wp_ajax_memreg_process_request', 'memreg_process_request_wp_ajax_function' );
add_action( 'wp_ajax_nopriv_memreg_process_request', 'memreg_process_request_wp_ajax_function' );

function memreg_process_request_wp_ajax_function(){
   $email_to = "oet@pacssi.com";
   $email_subject = "Testing Email Function from PHP script";
   $email_message .= "This is a test message to test AJAX result\n"; 
   $email_message .='Address:'.$_POST["Street"].', '.$_POST["City"].', '.$_POST["State"].' '.$_POST["Zip"]."\r\n";
   $email_message .='Phone:'.$_POST["Phone"].'Email:'.$_POST["Email"]."\r\n";
   $email_message .='Chapter:'.$_POST["Chapter"]."\r\n";   
   $headers = 'From: '.$email_from."\r\n".
   'Reply-To: '.$email_from."\r\n" .
   'X-Mailer: PHP/' . phpversion();
   @mail($email_to, $email_subject, $email_message, $headers);  

  //To send back a response you have to echo the result!
  //echo $_POST['Email'];
  //echo $_POST['Chapter'];
  wp_die(); // ajax call must die to avoid trailing 0 in your response
}

function myform(){
........
}

在将会员表单移入Wordpress插件之前，我再次使用了所有AJAX部分。在Wordpress之前，AJAX只是将表单数据发送到Web服务器上的单独process.php文件，以提取一些字段并生成电子邮件消息。阅读上面列出的帖子和许多其他人我无法让AJAX部分在Wordpress下工作。

Answer 1

我发现您有action: 'memreg_process_request'，但action未被识别为属性，并且未进一步传递$_POST['action'] = 'memreg_process_request'。此外，变量$(this)指的是ajax请求;因此，您需要在构建ajax请求之前缓存对表单变量的引用：

var $this = $(this);

$.ajax({....

然后在我们的data构造函数中，我们需要定义动作和表单。

实际上，它应该更像是：

data: {
    action: 'memreg_process_request',
    form: $this.serialize()
}

当然，您的表单数据现已在$_POST['form']

中提供

由于您已经注册了add_action，并且您有一个正在处理请求/响应的函数，因此没有其他内容。

Answer 2

以下是我为使这一切工作所做的更改。

我不得不更改数据：＆amp; url：行使这项工作。出于某种原因，我无法获得wp_localize_script来定义ajax_object.ajaxurl，我一直未定义对象，所以我只使用了完整路径。我使用Firebug来查看jQuery脚本生成的错误。上面的建议在尝试后会在Firebug中生成错误。我搜索了许多其他帖子以找到解决方案。

我使用“parce_str（$ _ POST [form]，$ my_POST）”将函数memreg_process_request_wp_ajax_function（）中的传递数据拉出来。

jQuery(document).ready(function(){
jQuery('#paypal').submit(function(){
       jQuery.ajax({
         url : "/wp-admin/admin-ajax.php",
         type: 'POST',
         data: {
            action: 'memreg_process_request',
            form: jQuery('#paypal').serialize()
         },
         success: function( data ){
           //Do something with the result from server
           console.log( data );
         }
       });
    });

}）;

Wordpress插件中的jQuery AJAX调用不起作用

2 个答案: