从所有字段或仅一个字段搜索结果

时间:2018-02-20 21:30:37

标签: jquery ajax wordpress forms search

我在我的wordpress博客中尝试制作表单并搜索自定义类型时遇到问题,我在functions.php文件中有以下表单......

add_action('init', 'create_post_type');
function create_post_type() {
    register_post_type( 'terapeutas',
        array(
            'labels'=>array(
                'name'=> __('Terapeutas' ),
                'singular_name'=> __('Terapeuta' )
            ),
            'public'=>true,
            'has_archive'=>true,
        )
    );
}


function terapeuta_search_scripts(){
wp_enqueue_script('terapeutas', get_stylesheet_directory_uri() . '/js/terapeutas.js', array(), '1.0.0', true);
wp_localize_script('terapeutas', 'ajax_url', admin_url('admin-ajax.php'));
}

function terapeuta_search(){
terapeuta_search_scripts();

ob_start();
?>
<div id="bed-search">
    <form action="" method="get">
        <input placeholder="Pesquise um nome..." id="terapeuta-nome" type="text" name="terapeuta-nome" />
        <select id="terapeuta-estado" name="terapeuta-estado">
            <option value="" selected="selected">Estados</option>
            <option value="AL">AL</option>
            <option value="BA">BA</option>
            <option value="CE">CE</option>
            <option value="DF">DF</option>
            <option value="GO">GO</option>
            <option value="MG">MG</option>
            <option value="MS">MS</option>
            <option value="MT">MT</option>
            <option value="RJ">RJ</option>
            <option value="RN">RN</option>
            <option value="RS">RS</option>
            <option value="SP">SP</option>
            <option value="SC">SC</option>
            <option value="PR">PR</option>
        </select>
        <select id="terapeuta-cidade" name="terapeuta-cidade">
            <option value="" selected="selected">Cidades</option>
            <option value="Armação dos Búzios">Armação dos Búzios</option>
            <option value="Atibaia">Atibaia</option>
            <option value="Belo Horizonte">Belo Horizonte</option>
            <option value="Brasília">Brasília</option>
            <option value="Bueno Brandão">Bueno Brandão</option>
            <option value="Campinas">Campinas</option>
            <option value="Campos do Jordão">Campos do Jordão</option>
            <option value="Cianorte">Cianorte</option>
            <option value="Curitiba">Curitiba</option>
            <option value="Chapecó">Chapecó</option>
            <option value="Delfim Moreira">Delfim Moreira</option>
            <option value="Florianópolis">Florianópolis</option>
            <option value="Foz do Iguaçu">Foz do Iguaçu</option>
            <option value="Garça">Garça</option>
            <option value="Guarantã do Norte">Guarantã do Norte</option>
            <option value="Ilhabela">Ilhabela</option>
            <option value="Maceió">Maceió</option>
            <option value="Maracaju">Maracaju</option>
            <option value="Miguel Pereira">Miguel Pereira</option>
            <option value="Morungaba">Morungaba</option>
            <option value="Natal">Natal</option>
            <option value="Piratininga">Piratininga</option>
            <option value="Porto Alegre">Porto Alegre</option>
            <option value="Rio de Janeiro">Rio de Janeiro</option>
            <option value="Santana de Parnaíba">Santana de Parnaíba</option>
            <option value="São Paulo">São Paulo</option>
            <option value="Santo André">Santo André</option>
            <option value="Sinop">Sinop</option>
            <option value="Sorocaba">Sorocaba</option>
            <option value="Ubatuba">Ubatuba</option>
            <option value="Uruçuca">Uruçuca</option>
            <option value="Uberlândia">Uberlândia</option>
            <option value="Volta Redonda">Volta Redonda</option>
        </select>
        <button type="submit">Buscar Terapeuta</button>
    </form>

    <ul style="list-style-type:none;"></ul>

</div>
<?php
return ob_get_clean();
}

我的js文件内容是:

$ = jQuery;

var bedSearch = $("#bed-search");
var searchForm = bedSearch.find("form");

searchForm.submit(function(e){
e.preventDefault();

    var data = {
        action : "terapeuta_search",
        nome : bedSearch.find("#terapeuta-nome").val(),
        estado : bedSearch.find("#terapeuta-estado").val(),
        cidade : bedSearch.find("#terapeuta-cidade").val()
    };
    $.ajax({
        url : ajax_url,
        data : data,
        success : function(response){
            bedSearch.find("ul").empty();
            for(var i = 0; i < response.length; i++){
                console.log(response[i]);
                var html = "<li id='terapeuta-" + response[i].id + "'><a style='color:orange;' href='" + response[i].permalink + "'>" + response[i].nome + "</a></li>";
                bedSearch.find("ul").append(html);
            }
        }
    });
});

目前我的搜索仅在我填写所有游戏[名称+城市+州]时才有效,但我需要能够搜索只填充其中一个字段。

例如:如果我只想按城市搜索,我只想展示这个城市的Tearapeutas ...... http://assttic.org/wp-admin/admin-ajax.php?action=terapeuta_search&nome=&estado=DF&cidade= 在这种情况下,我有一个类似的查询字符串:

action: terapeuta_search
cidade: 
estado: DF
nome:

但是json响应是空的

Ex2:如果我想按国家和城市搜索,那就向我展示了来自这个州和城市的所有治疗师......

PS:我没有触摸我的db文件,因为wordpress中的新手我只是按照互联网上的教程,那些代码行是我唯一想到的...

1 个答案:

答案 0 :(得分:0)

这个问题需要更多信息。我们不知道你的后端代码是如何工作的。

您是否尝试过使用邮递员并仅使用一部分参数发送请求?网络请求是什么样的?您是否在chrome dev工具中设置了断点并在发送请求之前检查了数据对象?