1

I'm building ajax search plugin for wordpress. I have no output when I want to convert to result to json. Of course my plugin works without Json conversion.

(Is it okay if I don't use Json??)

my code is:

search_form.php:

add_action( 'wp_ajax_nopriv_ajax_search2', 'ajax_search2' );    
function ajax_search2() {
    $data = array();
    $val =$_POST['val'];
    echo $val;
    if(strlen($val) > 3){
        $ppp = 6;
        $post_type = 'product';
        $args = array(
            's' => $val,
            'post_type' => $post_type,
            'posts_per_page' => $ppp
        );
        $query = new WP_Query($args);
            
        if($query->have_posts()){
            while($query->have_posts()){
                $query->the_post();
                $link=get_permalink( get_the_ID() );
                $thumb = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'thumbnail'); 
                $thumb = $thumb[0];
                $data['product'] .= '<li><img src="'.$thumb.'"><span><a href="'.$link.'">'.$query->post->post_title.'</a></span></li>';
        }
            
        if($query->found_posts > 6){
            $data['product'] .= '<li class="more"><a href="'.site_url().'/?s='.$val.'&post_type='.$post_type.'">ادامه</a></li>';
            // 'the post font after 6';
        }
         wp_reset_postdata();
    }else{
        $data['product'] = "no product found2";
    }
        
    }
    $result = wp_json_encode($data);
    wp_send_json($result);// 
}

ajax.js:

jQuery(document).ready(function ($) {
    //alert('this is a test for ajax');
    $(window).click(function(){
        
        $('.box-search').css('opacity','0');
    })
    $('.box-search').click(function(event){
        event.stopPropagation();
    })
    
    var SearchReq = null;
    
    $('.search .search-field').keyup(function(){
        $('.box-search').css('opacity','1');
        var val = $('.search .search-field').val();
        ajaxSearch(val);
    })
    
    function ajaxSearch(val){
        
        if( val.length < 3){
            $('.box-search').css('opacity','0');
            return;
        }
        SearchReq = $.ajax({
            type: 'POST',
            dataType : "json",
            url:'http://ferfri.ir/wp-admin/admin-ajax.php',
            data:{
                action : 'ajax_search2',
                val : val
            },beforeSend:function(){
                $('.box-search ul').html('قبل از ارسال');
                if(SearchReq != null){
                    SearchReq.abort();
                }
            },success:function(res){
                res = JSON.parse(res);
                $('.box-search ul.product').html(res.product);
                $('.box-search ul.news').html(res);
                
            }
        })
    }
    
});
1
  • have you considered using the REST API instead of the old legacy admin-ajax.php API? The REST API is built for these kinds of requests and handles JSON directly, as well as giving you a lot of other things such as pretty URLs. You might find that your product post type already has a REST API endpoint you can query to grab data from in JS
    – Tom J Nowell
    Commented Dec 6, 2021 at 10:28

1 Answer 1

1

wp_send_json() already converts the value to JSON, so you don't need to do it again. You can remove wp_json_encode().

1
  • Hi, thank , but it still does not work
    – A Z
    Commented Dec 6, 2021 at 11:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.