jquery – trouble while deploying ‘appendTo’



Hello friends,

Kindly see if you can figure out the issue here-

While using the below stated code, after click on `'.list_name p a'` to `appendTo` is more than a few result. Why is that so ??

Engaging jQuery 1.6.2 here.

Eg :

all result is:salsh، salasi، salaso، salal
 when click on- salshh -> displaying(.appendTo) ->  salsh، salasi، salaso، salal
 when click on- salasi -> displaying(.appendTo)> ->salasi، salaso، sala
 when click on- salaso -> displaying(.appendTo) ->salaso، salal
 when click on - salal -> displaying(.appendTo) -salal

Now I desire to add to simply that value which is clicked and no several value.

        $('.auto_complete').keyup(function () {
                var id = '#' + this.id;
                var alt = $(id).attr('alt'); var id = $(this).attr('id'); var name = $(this).attr('name');
                var url = alt + id + '/' + name;
            var dataObj = $(this).closest('form').serialize();
            $.ajax({
                type: "POST",
                url: url,
                data: dataObj,
                cache: false,
                dataType: 'json',
                success: function (data) {
                    $(".list_name").show().html('');            
                    $.each(data.name, function(a,b){
                        $(".list_name").append('<p><a href="" id="result">' + b + '</a></p>');
 
    ////////////////////here///////////////////                        
    $('.list_name p a').click( function(event) {
                                event.preventDefault();
                                $('<b>' + b + '، </b><input type="text" name="hotel[]" value="' + b + '" style="border: none; display: none;" />').appendTo('.auto_box span');
                            })
    ///////////////////////////////////////////
 
                    });
                    if($('.auto_complete').val()==''){
                        $(".list_name p").hide().remove()
                    }
                    $('body').click(function(){
                            $(".list_name p").hide().remove();
                            $('.auto_complete').val('');
                        });
                },
                "error": function (x, y, z) {
                    // callback to run if an error occurs
                    alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
                }
                });    
            });

Please post n provide some solution.

Thanks all.

40 weeks 3 days ago   Tags: