在functions.php而不是JSON中返回生成的HTML是不好的做法吗?

时间:2018-06-12 15:20:53

标签: php json ajax wordpress

我使用AJAX创建了一个带有自定义痕迹的后置过滤器。所以现在从functions.php文件中返回了相当多的HTML。有人告诉我,我不应该这样做,但他们没有告诉我原因。

问题

  1. 除了让我的函数.php看起来凌乱外,还有什么其他的缺点吗?
  2. 这会被视为不良做法吗?
  3. 这会让网站变慢吗?
  4. functions.php page

    add_action('wp_ajax_soldfilter', 'sold_filter');
    add_action('wp_ajax_nopriv_soldfilter', 'sold_filter');
    
    function sold_filter(){
        $posts = array(
            'posts_per_page'    =>  -1,
            'post_type'         =>  'property',
            'orderby'           =>  'date',
            'meta_key'          => 'property_status',
            'meta_value'        => 'Sold'
        );
    
        $posts['meta_query'] = array( 'relation' => 'AND' );
        // price filtering
    
        if($_POST['min_price'] && !empty($_POST['min_price'])){
            $min_price = $_POST['min_price'];
        }else{
            $min_price = 0;
        }
    
        if($_POST['max_price'] && !empty($_POST['max_price'])){
            $max_price = $_POST['max_price'];
        }else{
            $max_price = 10000000;
        }
    
        $posts['meta_query'][] = array(
            'key'       => 'property_price',
            'type'      => 'NUMERIC',
            'value'     => array($min_price, $max_price),
            'compare'   => 'BETWEEN'
        );
    
        // bed filtering
    
        if($_POST['min_beds'] && !empty($_POST['min_beds'])){
            $min_beds = $_POST['min_beds'];
        }else{
            $min_beds = '1'; 
        }
    
        if($_POST['max_beds'] && !empty($_POST['max_beds'])){
            $max_beds = $_POST['max_beds'];
        }else{
            $max_beds = '9+'; 
        }
    
        $posts['meta_query'][] = array(
            'key'       => 'bedrooms',
            'value'     => array($min_beds, $max_beds),
            'compare'   => 'BETWEEN'
        );
    
        //location filtering
    
        if(isset( $_POST['location'] ) && $_POST['location']){
            $location = $_POST['location'];
            $location_val = stripslashes($location);
    
            $posts['meta_query'][] = array(
                'relation'  => 'OR',
                array(
                    'key'       => 'street',
                    'value'     => $location_val,
                    'compare'   => 'LIKE'
                ),
    
                array(
                    'key'       => 'town',
                    'value'     => $location_val,
                    'compare'   => 'LIKE'
                ),
    
                array(
                    'key'       => 'county',
                    'value'     => $location_val,
                    'compare'   => 'LIKE'
                ),
    
                array(
                    'key'       => 'postcode',
                    'value'     => $location_val,
                    'compare'   => 'LIKE'
                )
            );                          
        }
    
        // property type filtering
        if(isset( $_POST['type'] ) && $_POST['type']){
            $posts['meta_query'][] = array(
                'key'       => 'type_of_property',
                'value'     => $_POST['type'],
                'compare'   => 'IN'
            );
        }
    
        // secondary flash filtering
        if(isset( $_POST['flash_type'] ) && $_POST['flash_type']){
            $posts['meta_query'][] = array(
                'key'       => 'optional_category',
                'value'     => $_POST['flash_type'],
                'compare'   => 'IN'
            );
        }
    
        $query = new WP_Query( $posts );?>
    
        <div class="row">
            <div class="col-12">
                <div id="crumb">
                    <p>Now showing <span id="loop_count"></span> properties</p>
    
                    <?php 
                        // check if property type has been selected if so loop through them and display them
                        if( $_POST['type'] ){
                            $crumb_type = $_POST['type'];
    
                            foreach($crumb_type as $val) {
                                echo '<span>'.$val.', </span>';
                            }
                        }
    
                        // check if min beds / max beds has been select if so display it in the crumb
                        if( $_POST['min_beds'] ){
                            $crumb_minbeds = $_POST['min_beds'];
    
                            echo '<p>from </p><span>'.$crumb_minbeds.' bedrooms </span>';
                        }
    
                        if( $_POST['max_beds']){
                            $crumb_maxbeds = $_POST['max_beds'];
    
                            echo '<p>up to </p><span>'.$crumb_maxbeds.' bedrooms, </span>';
                        }
    
                        // check if min price / max price has been select if so display it in the crumb
                        if( $_POST['min_price'] ){
                            $crumb_minprice = $_POST['min_price'];
    
                            echo '<p>from </p><span>£'.$crumb_minprice.' </span>';
                        }
    
                        if( $_POST['max_price']){
                            $crumb_maxprice = $_POST['max_price'];
    
                            echo '<p>up to </p><span>£'.$crumb_maxprice.' </span>';
                        }
    
                        // check if location is set 
                        if( $_POST['location'] ){
                            $crumb_location = $_POST['location'];
    
                            echo '<p>properties in </p><span>'.stripslashes($crumb_location).'</span>';
                        }
    
                        // check if secondary filters are applied, if so display a clickable box
                        if( $_POST['flash_type'] ): ?>
                            <div id="flash_crumbs">
                                <?php 
                                if( in_array('Ideal First Time Buy', $_POST['flash_type']) ): ?>
                                    <a href="javascript:;">Ideal First Time Buy <span data-id="first_time" >&times;</span></a>
                                <?php endif; 
    
                                if( in_array('Ideal Investment', $_POST['flash_type']) ): ?>
                                    <a href="javascript:;">Ideal Investment <span data-id="investment" >&times;</span></a>
                                <?php endif; 
    
                                if( in_array('Under Offer', $_POST['flash_type']) ): ?>
                                    <a href="javascript:;">Under Offer <span data-id="under_offer" >&times;</span></a>
                                <?php endif; ?>
                            </div>
                        <?php endif; 
                    ?>
                </div>
            </div>
        </div>
    
        <?php if( $query->have_posts() ): ?>    
            <div class="row">
                <?php while( $query->have_posts() ): $query->the_post() ?>
                    <div class="col-sm-6 col-md-4 col-lg-3 post">
                        <div class="shadowwrapper2">
                            <a href="<?php the_permalink(); ?>">
                                <?php  
                                    $main_field = get_field('images');
                                    $first_row = $main_field[0];
                                    $img = $first_row['image'];
                                    $img_med = $img['sizes']['medium'];
                                ?>
    
                                <div class="propertywrapper">
                                    <img class="img-fluid gal_imgs" src="<?php echo $img_med ?>" alt="<?php $img['alt']; ?>"/>
    
                                    <?php $secondary_flash = get_field('optional_category'); ?>
    
                                    <?php if($secondary_flash == "Ideal First Time Buy"): ?>
                                        <span class="second_flash">Ideal First Time Buy</span>
                                    <?php elseif($secondary_flash == "Ideal Investment"): ?>
                                        <span class="second_flash">Ideal Investment</span>
                                    <?php elseif($secondary_flash == "Under offer"): ?>
                                        <span class="second_flash">Under offer</span>
                                    <?php endif; ?>
                                </div>
    
                                <div class="cornerflash">
                                    <img src="<?php bloginfo('template_directory'); ?>/imgs/forsale.svg" alt="corner flash">
                                </div> 
    
                                <div class="propertyinfo">
                                    <div class="row m-0">
                                        <div class="col-6 p-0 mt-2"><?php the_field('type_of_property'); ?></div>
                                        <div class="col-6 p-0 mt-2"><?php the_field('bedrooms'); ?> bedrooms</div>
                                    </div>
                                </div>
    
                                <div class="streetpricewrapper">
                                    <p class="streetname">
                                        <?php the_field('street'); ?>, <?php the_field('town'); ?>
                                    </p>
                                    <p class="price">
                                        £<?php the_field('property_price'); ?>
                                    </p>    
                                </div>                              
                            </a>
                        </div>
                    </div>
                <?php endwhile; ?>
            </div>
        <?php
        wp_reset_postdata(); 
        endif; 
        wp_die();
    }
    

1 个答案:

答案 0 :(得分:2)

您使用HTML传输更多数据,可能会增加延迟。

HTML有时会重复,这会大大增加您转移的金额。 AJAX请求通常用于大量项目列表,在这种情况下,仅从列表中传输唯一数据并在前端创建带有循环的HTML可能更有意义。

此外,有时您可能希望使用相同的数据创建不同类型的标记,在这种情况下,JSON更通用。

对于较小的内容,没有多少重复,只是以一种方式使用,转移HTML并不一定有很大的缺点。它不是最性感的解决方案,但并非所有东西都需要优雅地设计。