Question

我正在获取表单输入，并进行AJAX调用以获取两种单独的自定义帖子类型。该页面的主要功能是获取课程列表，可以按部门（自定义分类法）和年级进行过滤，还具有搜索功能。这些课程是自定义帖子类型。第二部分还获取与部门关联的工作人员，并将其显示在页面上的单独区域中。工作人员也是自定义帖子类型。

目前，我总是从AJAX呼叫中获得对课程的响应，该响应显示在课程区域和人员区域。

AJAX通话

    function course_filter() {
        var filter = $('#course-filter');
        $.ajax({
            url: filter.attr('action'),
            data: filter.serialize(),
            type: filter.attr('method'),
            success: function(data) {
                $('#course-response').html(data);
            }
        });
        return false;
    }

    $( document ).ready(function() {
        course_filter();
    });

    $('#apply-course-filter').on('click', function(e) {
        e.preventDefault();
        course_filter();
        course_staff_filter();
    });

    // Prevent Enter Submit on Course Search
    $('#course-search').keypress(function(event) {
        if( event.keyCode == 13 ) {
            event.preventDefault();
        }
    });

    function course_staff_filter() {
        var filter = $('#course-filter');
        $.ajax({
            url: filter.attr('action'),
            data: filter.serialize('department-filter'),
            type: filter.attr('method'),
            success: function(data) {
                $('#course-staff-response').html(data);
            }
        });
        return false;
    }

课程结果

function filter_courses() {
    $args = array(
        'post_type' => 'course',
        'posts_per_page' => -1,
        'orderby' => 'slug',
        'order' => 'DESC',
    );

    if( isset( $_GET['grade-filter'] ) && ( $_GET['grade-filter'] != " " ) ) :
        $grade = sanitize_text_field( $_GET['grade-filter']);
        $args['meta_query'] = array(
            array(
                'key' => 'grade',
                'value' => $grade,
                'compare' => 'LIKE',
            )
        );
    endif;

    if( isset( $_GET['department-filter'] ) && ( $_GET['department-filter'] != " " ) ) :
        $args['tax_query'] = array(
            array(
                'taxonomy' => 'department',
                'field'    => 'id',
                'terms'    => $_GET['department-filter'],
            )
        );
    endif;

    if( isset( $_GET['search'] ) ) :
        $search = sanitize_text_field( $_GET['search']);
        $query = new WP_Query( array(
            'post_type'  => 'course',
            'posts_per_page' => -1,
            'orderby'    => 'title',
            'order'      => 'ASC',
            'tax_query'  => $args['tax_query'],
            'meta_query' => $args['meta_query'],
            's'          => $search,
        ) );

    else :

        $query = new WP_Query( $args );

    endif;


    if( $query->have_posts() ) :

        while( $query->have_posts() ) : $query->the_post(); ?>

        <div class="course-card">
            <!-- <?php echo get_post_type(); ?> -->
            <h4><?php echo $query->post->post_title; ?></h4>
            <div class="course-content">
                <?php the_content(); ?>
                <p class="grade"><strong>Grade Level:</strong> <?php the_field('grade'); ?></p>
                <?php   ?>
            </div>
        </div>

        <?php endwhile;

        wp_reset_postdata();

    else :

        echo '<p>Sorry, we could not locate what you were searching for.</p>';

    endif;

    die();
}
add_action( 'wp_ajax_coursefilter', 'filter_courses' );
add_action( 'wp_ajax_nopriv_coursefilter', 'filter_courses' );

我想从表单中的数据中获得两个单独的AJAX调用。

Answer 1

第一如果想获得两个单独的AJAX 那么您需要两个用于ajax的调用函数

$( document ).ready(function() {
    course_filter();
course_staff_filter();
});

或根据您的情况

$('#apply-course-filter').on('click', function(e) {
    e.preventDefault();
    course_filter();
    course_staff_filter();
});

之后您需要单独的ajax和处理程序功能

function course_filter() {
....
        url: filter.attr('action'),// separate course handler AJAX
...
}

function course_staff_filter() {
....
        url: filter.attr('action'),// separate staff handler AJAX
....
}

人员结果

add_action( 'wp_ajax_stafffilter', 'filter_staff' );
add_action( 'wp_ajax_nopriv_stafffilter', 'filter_staff' );
function filter_staf() {
$args = array(
    'post_type' => 'your_staff_posttype',
    'posts_per_page' => -1,
    'orderby' => 'slug',
    'order' => 'DESC',
);
//do your filter
//.....



    $query = new WP_Query( $args );




if( $query->have_posts() ) :

    while( $query->have_posts() ) : $query->the_post(); ?>

    <div class="staff-card">
        <!-- <?php echo get_post_type(); ?> -->
        <h4><?php echo $query->post->post_title; ?></h4>
        <div class="staff-content">
            <?php the_content(); ?>
            <?php //do as you want  ?>
        </div>
    </div>

    <?php endwhile;

    wp_reset_postdata();

else :

    echo '<p>Sorry, we could not locate what you were searching for.</p>';

endif;
die();
}

和您一样

add_action( 'wp_ajax_coursefilter', 'filter_courses' );
add_action( 'wp_ajax_nopriv_coursefilter', 'filter_courses' );

Wordpress-将Ajax响应与单个表单方法分开

1 个答案: