php - AJAX request and append to list after press enter -

php - AJAX request and append to list after press enter -

i'm trying send , input text value php page via ajax when user press enter key.

the thought is:

user write code on input text user press enter ajax calls action.php , passes value of input text action.php returns , html content (via database) html content added on page called action.php via ajax.

other issue add together 1 or more items on list , not overwrite it...

i have code:

<script type="text/javascript"> $(document).ready(function() { $(".code").bind("enterkey",function(e){ $.ajax({ //create ajax request load_page.php type: "get", url: "action.php", datatype: "html", //expect html returned success: function(response){ $("#responsecontainer").html(response); //alert(response); } }); }); }); </script> <input name="code" class="code" type="text" name="code" /> <div id="responsecontainer"></div>

and action php this:

<?php /* connection database code here.. remove because isn't necessary */ /* query code here */ echo $line['nome']; ?>

as can see, $(".code").bind("enterkey",function(e){ isn't working , don't know how alter div #responsecontainer list <ul><li></li></ul> , add together new <li> each request.

bind keydown event, , test keycode see if it's enter key. need pass this.value php script using data: option.

$(function() { $(".code").keydown(function(e) { if (e.keycode == 13) { $.ajax({ type: "get", url: "action.php", data: { code: this.value }, datatype: "html", success: function(response) { $("#responsecontainer ul").append($("<li>", { html: response })); }); } }); });

you shold alter html to:

<div id="responsecontainer"> <ul></ul> </div>

then ajax code above able append <li> elements list.

php ajax