get row from mysql when box filled with jquery .post()

Question

i want to get data from mysql db, first user select db, then enters id #

select db<select id="db" name="db_name">
                <option value="">-choose-</option>
                <option value="ekoloji_db">ekoloji</option>
                <option value="ejobios_db">ejobios</option>
                <option value="ejen_db">ejen</option>
    </select><br/>
        <table>
            <tr><td> article id:  <input id="articleID" type="text" name="Article_ID" size="3"/></td>
            <td><div id="showarticle">

            </div></td>
            </tr></table>

i want to show article title after article id has been input, but with no page refresh. since i am newbie with jquery, i found .post() and implemented in a naive way,

$(document).ready(function(){
            $("#db").change(onSelectChange);
    });
        function onSelectChange(){
            var selected = $("#db option:selected");
            var output = "";
            output = selected.text() ;
        $.post('db_connect.php', {db: "selected"}, function(show){
            $("#showarticle").html(show);
        });}

when db is selected from dropdown, it shows article title within showarticle div, but what i want is, make it visible after article id entered into textbox.

what comes from php is string, and i must post both dropdown value and aricle id, then show it. but i am stuck.

event sequence should be :

1. user selects db from dropdown
2. user input article ID
3. just after article ID is entered, i want to show from selected db, selected article's name..

any help is deeply appreciated..

Answer 1

Try this :

$(document).ready(function(){
   $("#articleID").blur(function() {
       var articleid = $(this).val();
       var selected = $('#db').val();
       $.post('db_connect.php', {"db": selected, "articleid" : articleid},           
           function(show){
               $("#showarticle").html(show);
           }
       )
   });
});

Docs for .blur() are here You can use the blur listener and implement a function at the same time.

I get the value from this which is the input and then the current selection (value) from db which is your select list. The post that data to the server.

Answer 2

I would write this...

$(document).ready(function(){
    $("#db").change(onSelectChange);
});

function onSelectChange(){
    $.post('db_connect.php', {db: $(this).val()}, function(data){
            $("#articleID").val(data);
});}

Where $(elt).val(newVal) refers to input value