创建要搜索的列

时间:2019-02-07 10:32:31

标签: javascript jquery wordpress datatables

我创建了自定义帖子类型的简码,但最后我试图在表中添加“个人”列搜索,但我无法访问..这是我的post_type_shortcode.php

<?php

function list_staff() {

    wp_reset_query();

    // Only staff members
    $args = array(
        'post_type' => 'staff_member',
        'posts_per_page' => 9999 // Set to high number to override default posts limit
    );

    $query = new WP_Query( $args );

        if ($query->have_posts()) :
            // Specify this table is a dataTable and assign an ID
            echo '<table class="tablepress dataTable" id="staff_table">';
            echo '<thead>';
            echo '<tr>';

            echo '<th>First Name</th>';
            echo '<th>Blood Group</th>';
            echo '<th>Phone</th>';
            echo '<th>Address</th>';
             echo '<th>Edit</th>';
            echo '</tr>';
            echo '</thead>';
            while( $query->have_posts() ) : $query->the_post();

                // Get meta if exists

                $first_name = get_post_meta( get_the_ID(), '_first_name', true);
                $blood_group = get_post_meta( get_the_ID(), '_blood_group', true);
                $phone = get_post_meta( get_the_ID(), '_phone', true);
                $address = get_post_meta( get_the_ID(), '_address', true);

                ?>
                <tr>

                    <td><?php echo $first_name; ?></td>
                    <td><?php echo $blood_group; ?></td>
                    <td><?php echo $phone; ?></td>
                    <td><?php echo $address; ?></td>
                       <td> <?php if ( current_user_can('edit_post', get_the_ID()) ) {
                            // Edit button if current user can edit staff members
                            echo '<span class="edit-link"><a class="post-edit-link" href=" http://localhost/project/custom/wp-admin/post.php?post='.get_the_ID().'&action=edit">EDIT</a></span>';
                        } ?>
                    </td>
                </tr>


                <?php
            endwhile;
            echo '</table>';
            ?>
            <script type="text/javascript">
               jQuery(document).ready(function(){
                    // Init dataTable
                    jQuery('#staff_table').dataTable({
                        "aaSorting":[],
                        "bSortClasses":false,
                        "asStripeClasses":['even','odd'],
                        "bSort":true,
                        aoColumnDefs: [
                            {
                                bSortable: false,
                                aTargets: [ 0,4 ]
                            }

                        ]
                    });
               });
            </script>

           <script type="text/javascript">
 $(document).ready(function() {
    // Setup - add a text input to each footer cell
    $('#staff_table tfoot th').each( function () {
        var title = $(this).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );

    // DataTable
    var table = $('#staff_table').DataTable();

    // Apply the search
    table.columns().every( function () {
        var that = this;

        $( 'input', this.footer() ).on( 'keyup change', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );
    } );
} );
</script>

            <?php
        endif;

}



function list_staff_obj($atts, $content=null) {
    ob_start();
    list_staff($atts, $content=null);
    $output=ob_get_contents();
    ob_end_clean();
    return $output;
}
add_shortcode( 'list-staff', 'list_staff_obj' );


?>

在此编码中,我使用的是“单个列”搜索的示例(文本输入),但此示例对我不起作用。...我无法理解我该怎么办,请回答我

0 个答案:

没有答案