Question

我使用codeigniter。我有三个字段.eghamat。我不知道为什么自动填充功能在前两个字段（INSERT VALUE HERE 1，INSERT VALUE HERE 2）中不起作用，但在第三个字段（INSERT VALUE HERE 3）中有效。

问题可能来自以下之一：

php代码
$.each循环
ajax call

有人看到了什么问题吗？

HTML：

<div class="bg_units bu0">
        <div class="auto_box">
                <b class="search_hotel">
                <div class="mediumCell">
                        <input type="text" name="hotel_auto" class="eghamat" placeholder="INSERT VALUE HERE 1">
                </div>
                <ul class="list_autobox_hotel">
                </ul>
                </b>
        </div>
</div>

<div class="bg_units bu1">
        <div class="auto_box">
                <b class="search_hotel">
                <div class="mediumCell">
                        <input type="text" name="hotel_auto" class="eghamat" placeholder="INSERT VALUE HERE 2">
                </div>
                <ul class="list_autobox_hotel">
                </ul>
                </b>
        </div>
</div>

<div class="bg_units bu2">
        <div class="auto_box">
                <b class="search_hotel">
                <div class="mediumCell">
                        <input type="text" name="hotel_auto" class="eghamat" placeholder="INSERT VALUE HERE 3">
                </div>
                <ul class="list_autobox_hotel">
                </ul>
                </b>
        </div>
</div>

PHP：

function auto_complete() {
    $hotel_search = $this ->input-> post('hotel_auto');

    $query = $this->db->query("SELECT * FROM hotel_submits WHERE name LIKE '%$hotel_search%' ORDER BY name asc");
    if($query->num_rows()==0){
        return '0';
    }else{
        $data = array();
        foreach ($query->result() as $row)
        {
           $units = json_decode($row->units);
           $data[] = array('name' => $row->name, 'units' =>$units );
        }
    }

    echo json_encode($data);        
}

jQuery的：

$('.auto_complete_eghamat').live('keyup',function () {
    var $this = $(this),
    $div = $this.closest('div.bg_units'),
    bu_num =  '.' + $div.attr('class').split(" ")[1];
    var dataObj = $(this).closest('form').serialize();
    $.ajax({
        type: "POST",
        dataType: 'json',
        url: 'auto_complete',
        data: dataObj,
        cache: false,
        success: function (data) {
            //alert(dataObj);
            var id_name = $(bu_num+' .list_autobox_hotel').attr('id');
            $(bu_num+' .list_autobox_hotel').show().html('');
            if (data == 0) {
                $(bu_num+' .search_hotel').show().html('<p><b>there is no</b></p>');
            } else {
                $.each(data, function (index, value) {
                    $('<p id="' + value.name + '">' + value.name + '</p>').appendTo(bu_num+' .list_autobox_hotel');
                });
                $('body').click(function () {
                    $(".list_autobox_hotel p").hide().remove();
                    $('.auto_complete').val('');
                    $('.list_autobox_hotel').show().html('');
                    $('.list_autobox_hotel').css('display', 'none');
                });
            }
        },
        "error": function (x, y, z) {
            // callback to run if an error occurs
            alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
        }
    });
});

Answer 1

是否可以重命名id="tour"和id="hotel" cz html多次无法使用相同的ID

id="tour" 还有

id="hotel"

在代码中出现3次，所以请查看。

Answer 2

你能试一试吗？让我知道。你的admin.js应该是这样的

$(document).ready(function () {
        $('.list_autobox_hotel p').click(function() {               
            $(this).parent().parent().find('.eghamat').val($(this).text());             
            }); 

        $(document).click(function() {
            if($('.list_autobox_hotel').is(':visible')){
                $('.list_autobox_hotel').hide(); 
            }
            return true;

            });


        ////////////////////////////////////////////////////////////////
        $('#loadingDiv').hide() // hide it initially
        .ajaxStart(function () {
            $(this).show();
        }).ajaxStop(function () {
            $(this).hide();
        });

        ///////auto_complete///////////////////////////////////////////////
        $('.eghamat').live('keyup', function () {
            var $this = $(this),
                $div = $this.closest('div.bg_units'),
                bu_num = '.' + $div.attr('class').split(" ")[1];
            var dataObj = $(this).closest('form').serialize();
            //alert(dataObj);
            $.ajax({
                type: "POST",
                dataType: 'json',
                //url: 'binboy.gigfa.com/admin/…',
                url: 'auto_complete',
                data: dataObj,
                cache: false,
                success: function (data) {
                    //alert(bu_num);
                    var id_name = $(bu_num + ' .list_autobox_hotel').attr('id');
                    $(bu_num + ' .list_autobox_hotel').show().html('');
                    if (data == 0) {
                        $(bu_num + ' .list_autobox_hotel').show().html('<p><b>there is no</b></p>');
                    } else {
                        $.each(data, function (index, value) {
                            $('<p >' + value.name + '</p>').appendTo(bu_num + ' .list_autobox_hotel');
                        });

                    }
                },
                "error": function (x, y, z) {
                    // callback to run if an error occurs
                    alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
                }
            });
        });

    });

Answer 3

这是一个简单的代码

$('.eghamat').click(function(){
    var id  =$(this).attr('id');
    //Here you have the id select with it and put your code in it
});

jquery auto complete不适用于每个字段

3 个答案: