如何合并两个Ajax表单

时间:2016-12-26 07:50:43

标签: jquery ajax wordpress forms

我有两个Ajax表单来过滤wordpress网站中同一页面上的帖子。这两个过滤器分别很好地过滤。

  

以下是链接Test Server

现在我试图将这两者合并为一体。之后,其显示结果为One form

如何将2个Ajax表单合并为1 ??

脚本形式:1

jQuery(document).ready(function($){
 $('#test .br').click(function(){

// declaring an array
var choices = {};

$('.contents').remove();
$('.filter-output').empty()

console.log(choices);
$.ajax({
    url: ajaxobject.ajaxurl,
    type :'POST',
    data : {
        'action' : 'call_post',
        'choices' : choices,
    },

    success: function (result) {
        $('.filter-output').append(result);

    }     
  });
  })
 });

脚本形式:2

jQuery(function($){
$('#filter').submit(function(){
    var filter = $(this);
    $.ajax({
        url:filter.attr('action'),
        data:filter.serialize(), // form data
        type:filter.attr('method'), // POST
        beforeSend:function(xhr){
            filter.find('button').text('Processing...'); // changing the button label
        },
        success:function(data){
            filter.find('button').text('Apply filter'); // changing the button label back
            $('#response').html(data); // insert data
        }
    });
    return false;
});
});

1 个答案:

答案 0 :(得分:1)

你想这样吗?

            jQuery(document).ready(function($){
                 $('#test .br,#filter').click(function(){
                var ChkClick  = $(this).attr("id");

                if(ChkClick=='filter'){
                        $('#filter').submit(function(){
                        var filter = $(this);
                        $.ajax({
                            url:filter.attr('action'),
                            data:filter.serialize(), // form data
                            type:filter.attr('method'), // POST
                            beforeSend:function(xhr){
                                filter.find('button').text('Processing...'); // changing the button label
                            },
                            success:function(data){
                                filter.find('button').text('Apply filter'); // changing the button label back
                                $('#response').html(data); // insert data
                            }
                        });
                        return false;


                }else{
                // declaring an array
                    var choices = {};
                    $('.contents').remove();
                    $('.filter-output').empty()

                    $.ajax({
                        url: ajaxobject.ajaxurl,
                        type :'POST',
                        data : {
                            'action' : 'call_post',
                            'choices' : choices,
                        },
                        success: function (result) {
                            $('.filter-output').append(result);

                        }     
                      });
                  }  
                })
             });