在文档就绪时调用自动完成功能

时间:2017-03-30 11:23:15

标签: javascript jquery json ajax autocomplete

经过长时间的搜索后,当文档准备好传递特定变量时,我无法找到调用自动完成功能的方法。

所以当我从自动完成中选择元素时,我的这个功能正常工作:

var option_row = <?php echo $option_row; ?>;

    $('input[name=\'option\']').autocomplete({
        'source': function(request, response) {
            $.ajax({
                url: 'index.php?route=catalog/option/autocomplete&token=<?php echo $token; ?>&filter_name=' +  encodeURIComponent(request),
                dataType: 'json',
                success: function(json) {
                    response($.map(json, function(item) {
                        return {
                            category: item['category'],
                            label: item['name'],
                            value: item['option_id'],
                            type: item['type'],
                            option_value: item['option_value']
                        }
                    }));
                }
            });
        },
        'select': function(item) {

            html  = '<div class="tab-pane" id="tab-option' + option_row + '">';
            html += '   <input type="hidden" name="product_option[' + option_row + '][product_option_id]" value="" />';
            html += '   <input type="hidden" name="product_option[' + option_row + '][name]" value="' + item['label'] + '" />';

    etc etc......
经过多次研究后,我正在考虑转向另一种可能的解决方案......

我想直接调用它而不选择项目,但是将变量传递给函数...

我正在尝试这样做:

    $(document).ready(function(e){

    var option_row = <?php echo $option_row; ?>;
    var req = 'item';
    setOptions(req);

    });

    function setOptions(req){

                $.ajax({
                    url: 'index.php?route=catalog/option/autocomplete&token=<?php echo $token; ?>&filter_name=' +  encodeURIComponent(req),
                    dataType: 'json',
                    success: function(json) {
                        response($.map(json, function(item) {
                            return {
                                category: item['category'],
                                label: item['name'],
                                value: item['option_id'],
                                type: item['type'],
                                option_value: item['option_value']
                            }
                        }));
                    }
                });

           'select': function(item) {

                html  = '<div class="tab-pane" id="tab-option' + option_row + '">';
                html += '   <input type="hidden" name="product_option[' + option_row + '][product_option_id]" value="" />';
                html += '   <input type="hidden" name="product_option[' + option_row + '][name]" value="' + item['label'] + '" />';

           etc, etc...


    }

现在,我不知道我应该使用什么而不是'select': function(item) {来使其有效。

在此先感谢,感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

好吧,我终于成功了...它比我想象的更简单

这是代码:

$(document).ready(function(e) {
    var data = 'Adulti';
    addOptions(data);

});

var option_row = <?php echo $option_row; ?>;


function addOptions(data){

var base_url = 'index.php?route=catalog/option/autocomplete&token=<?php echo $token; ?>&filter_name=' +  encodeURIComponent(data);
var n='';
    $.ajax({

        url: base_url, 

        dataType: 'json',   
        success: function(json) {               

                $.map(json, function(item) {     

                     category = item['category'];
                        label = item['name'];
                        value = item['option_id'];
                         type = item['type'];
                 option_value = item['option_value']; 

        html  = '<div class="tab-pane" id="tab-option' + option_row + '">';
        html += '   <input type="hidden" name="product_option[' + option_row + '][product_option_id]" value="" />';
        html += '   <input type="hidden" name="product_option[' + option_row + '][name]" value="' + item['name'] + '" />';
        html += '   <input type="hidden" name="product_option[' + option_row + '][option_id]" value="' + item['value'] + '" />';
        html += '   <input type="hidden" name="product_option[' + option_row + '][type]" value="' + item['type'] + '" />';

etc, etc....