jquery auto complete does not work on every field

I use codeigniter. And I have three field with the class .eghamat. I don't know why autocomplete doesn't work in the two first fields (INSERT VALUE HERE 1, INSERT VALUE HERE 2) but works in the third(INSERT VALUE HERE 3).

The problem might come from one of the following:

• The php code
• the $.each loop
• the ajax call

Does someone see what's wrong?

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-> 开发者_C百科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);
        }
    });
});

could you please rename id="tour" and id="hotel" cz html cannot have same ids multiple times

id="tour" and also

id="hotel" 

appears 3 times in the code so please look into it.

could you please try it out. and let me know.your admin.js should be like this

$(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);
                }
            });
        });

    });

Here is a simple code

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