首页 > 解决方案 > jQuery自动完成minLength不起作用

问题描述

首先,我已经研究了数十个关于 SO 的“解决方案”,但是这些并没有为我相当相似的问题带来解决方案。

我将自动完成功能与 ajax 结合使用以从 API 调用中获取 JSON。这工作正常,除了正在拨打的电话数量。经过短暂的测试,我发现我的“minLength”不起作用。该功能在每次按键后触发。API 拥有大量记录,因此这是一个相当大的问题。

我的代码如下:

jQuery(document).ready(function ($) {
    $('.autocomplete-custom-append input').autocomplete({
        minLength:10,
        lookup: function(query, done){
            $.ajax({
                url:'/wp-content/themes/inf-child/apicall.php',
                type:'post',
                data:{'search_query': query},
                success:function(response){
                    console.log('call made');
                    done(JSON.parse(response));
                },
                error:function(xhr, status, error){
                    console.log(xhr.status + ':' + xhr.statusText); 
                    done({});
                },
            });
        },
        appendTo: '.autocomplete-suggestions',
    });
});

没有火箭科学,但我认为我忽略了另一个问题。

附加信息 此代码在 Wordpress 的子主题中运行。不应该是一个因素,但谁知道 WP 有时可能隐藏在垃圾中的秘密。

到目前为止我尝试了什么?除了浏览很多帖子之外,我还尝试将我的“查找”功能更改为“来源”功能,但后来我遇到了其他问题。我也在原始代码中使用了“onSelect”函数,但它只管理选择结果后的样式更改。

提前谢谢了!:)

编辑

Belore 是我从 form.php 收到的 JSON

{"suggestions":[{"value":"DEMO DATA","data":{"accountid":"12345-12345-12345","name":"DEMO DATA","emailaddress1":"email@email .com","address1_postalcode":"1234 BA"}}

$output = ['suggestions' => $array];从哪里收到来自$arrayAPI 调用的 foreach 函数。这部分工作正常。我得到数据。

表单本身是使用 Gravityforms 构建的,en de HTML 如下:

<form method="post" enctype="multipart/form-data" id="gform_1" action="/form/">
    <div class="gform_heading">
        <h3 class="gform_title">CRM form</h3>
        <span class="gform_description">Test form for crm dynamics integration</span>
    </div>
    <div class="gform_body"><ul id="gform_fields_1" class="gform_fields top_label form_sublabel_below description_below"><li id="field_1_1" class="gfield autocomplete-custom-append gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible ready"><label class="gfield_label" for="input_1_1">Zoek jouw school<span class="gfield_required">*</span></label><div class="ginput_container ginput_container_text"><input name="input_1" id="input_1_1" type="text" value="" class="medium" aria-required="true" aria-invalid="false" autocomplete="off"></div><div class="autocomplete-suggestions"><div class="autocomplete-suggestions" style="position: absolute; max-height: 300px; z-index: 9999; width: 524px; display: none;"><div class="autocomplete-suggestion" data-index="0">RK BS <strong>De Vaert</strong> || 5171 KJ</div></div></div></li><li id="field_1_2" class="gfield crm-data-input crm-emailaddress1 gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible"><label class="gfield_label" for="input_1_2">Emailadres<span class="gfield_required">*</span></label><div class="ginput_container ginput_container_text"><input name="input_2" id="input_1_2" type="text" value="" class="medium" aria-required="true" aria-invalid="false"></div></li><li id="field_1_3" class="gfield crm-data-input crm-address1_postalcode gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible"><label class="gfield_label" for="input_1_3">Adres<span class="gfield_required">*</span></label><div class="ginput_container ginput_container_text"><input name="input_3" id="input_1_3" type="text" value="" class="medium" aria-required="true" aria-invalid="false"></div></li>
                            </ul></div>
        <div class="gform_footer top_label"> <input type="submit" id="gform_submit_button_1" class="gform_button button" value="Submit" onclick="if(window[&quot;gf_submitting_1&quot;]){return false;}  window[&quot;gf_submitting_1&quot;]=true;  " onkeypress="if( event.keyCode == 13 ){ if(window[&quot;gf_submitting_1&quot;]){return false;} window[&quot;gf_submitting_1&quot;]=true;  jQuery(&quot;#gform_1&quot;).trigger(&quot;submit&quot;,[true]); }"> 
            <input type="hidden" class="gform_hidden" name="is_submit_1" value="1">
            <input type="hidden" class="gform_hidden" name="gform_submit" value="1">

            <input type="hidden" class="gform_hidden" name="gform_unique_id" value="">
            <input type="hidden" class="gform_hidden" name="state_1" value="WyJbXSIsIjJiYjc0ODA2MWQ3MmFlMDRmMDFkYjg5YTc0ZTZmMDRjIl0=">
            <input type="hidden" class="gform_hidden" name="gform_target_page_number_1" id="gform_target_page_number_1" value="0">
            <input type="hidden" class="gform_hidden" name="gform_source_page_number_1" id="gform_source_page_number_1" value="1">
            <input type="hidden" name="gform_field_values" value="">

        </div>
</form>

我认为上述内容与特定问题无关......

标签: jquerywordpressautocompletejquery-ui-autocomplete

解决方案


推荐阅读