tag a is to $.each(). see my js code:
$('.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').live('click', function(e) {
e.preventDefault();
$('<b>' + b + '، </b><input type="text" name="hotel[]" value="' + b + '" style="border: none; display: none;" />').appendTo('.auto_box span');
$(this).remove();
return false;
});
/////////////////////////////////////////////
});
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:
" + x + "
" + y + "
" + z);
}
});
});
php:(i use of codeigniter)
function search_hotel(){
$search_term = $this->input->post('search_hotel');
$query = $this->db->order_by("id", "desc")->like('name', $search_term)->get('hotel_submits');
$data = array();
foreach ($query->result() as $row)
{
$data[] = $row->name;
}
echo json_encode(array('name' => $data));
// echo: {"name":["333333","\u0633\u0644","\u0633\u0644\u0627\u0633\u06cc","\u0633\u0644\u0627\u0633\u0633","\u0633\u0644\u0627\u0645"]}
}
How you approach the solution might depend on whatever else you have attached to your link in terms of events. I would try it like this instead:
$('.list_name p a').live('click', function() {
$('<b>' + b + '، </b><input type="text" name="hotel[]" value="' + b + '" />').appendTo('.auto_box span');
$('.list_name p a').remove();
return false;
});
I created a jsFiddle for an example, which seems to be working just fine. If you're still getting a form submission then there might be other syntax errors in your code or other events tied to your elements that are interfering or preventing the desired behavior from occurring.
Because the event was not attached. Why? You must debug it... do you have errors in your browser Javascript console? Maybe stopped parsing due of some error.
Maybe you are not selecting the right a element (list_name or list-name)... etc.
UPDATE
What version of jQuery are you using?
You can place the binding of the event outside of the AJAX call to test. It should work that way too.
You can try also to attach it to the parent .list_name , the events bubble up, so it's more efficient doing it like this. Are you having any errors in the console log?
Try this
$('.list_name p a').live('click', function(e) {
e.preventDefault();
var b = "defineIt"; $('' + b + '، ').appendTo('.auto_box span'); $(this).remove(); return false; });