Php and javascript insert a line and give a hint

Question

I want to give a hint to each line, and now I have a problem

How to put the line number in this one div id="txtHint"will become txthint1 * txthint2 * txthint3

onchange="showUser(this.value,i)which is the number of rows. so i can use showuser function

JS:

function addRow(tableID) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var colCount = table.rows[0].cells.length;

    for(var i=0; i<colCount; i++) {

        var newcell = row.insertCell(i);

        newcell.innerHTML = table.rows[0].cells[i].innerHTML;
        //alert(newcell.childNodes);
        switch(newcell.childNodes[0].type) {
            case "text":
                newcell.childNodes[0].value = "";
                break;
            case "checkbox":
                newcell.childNodes[0].checked = false;
                break;
            case "select-one":
                newcell.childNodes[0].selectedIndex = 0;
                break;
        }
    }
}

function deleteRow(tableID) {
    try {
        var table = document.getElementById(tableID);
        var rowCount = table.rows.length;

        for(var i=0; i<rowCount; i++) {
            var row = table.rows[i];
            var chkbox = row.cells[0].childNodes[0];
            if(null != chkbox && true == chkbox.checked) {
                if(rowCount <= 1) {
                    alert("Cannot delete all the rows.");
                    break;
                }
                table.deleteRow(i);
                rowCount--;
                i--;
            }


        }
    }catch(e) {
        alert(e);
    }
}
function showUser(str)
{
    if (str=="")
    {
        document.getElementById("txtHint").innerHTML="";
        return;
    } 
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
}

HTML:

<INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />

<INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
<form action="http://localhost/tes/index.php/form/prints" method="post">
<TABLE id="dataTable" width="350px" border="1">
    <TR>
        <TD><INPUT type="checkbox" name="chk[]"/></TD>
        <TD><select name="a[]" id="a" onchange="showUser(this.value)">
        <option value="">select</option>
      <?php
    $sql="select * FROM user";

    $result = mysql_query($sql);        

    while($row = mysql_fetch_array($result))
      {

      ?>
        <option value="<?=$row['username']?>"><?=$row['username']?></option>
    <?php
    }
    ?>


            </select>
        </TD>
        <TD>
            <div id="txtHint"></div>
        </TD>
    </TR>
</TABLE>
<input type="submit"/>
</form>

Answer 1

Basically you solve the problem of registering events. You can save the data in ID (value i specified by you). But then you have problems with returning it, right?

Try reading this topic here: http://www.quirksmode.org/js/events_advanced.html

Then, as soon as you get this (basically), try something like this:

function registerEvents() {
    var showUser = function(e) {
        if (!e) var e = window.event;
        var target = e.target || e.srcElement;
        if (target.nodeType == 3) // defeat Safari bug
            target = target.parentNode;
        console.log(target);
        //  Your code would go here
        //  ..probably in place of the console.log() line as well.
    },
        eventElements = document.getElementsByTagName("select"),
        eventRegistrar;
    if(eventElements.length > 0) {
        for(var i=0;i<eventElements.lengthli++) {
            eventRegistrar = eventElements[i].addEventListener || eventElements[i].attachEvent;
            eventRegistrar(((eventRegistrar==eventElements[i].attachEvent)?"on":"")+"change", registerEvents);
        }
    }
}
var windowEventRegistrar = window.addEventListener || window.attachEvent;
windowEventRegistrar(((windowEventRegistrar==window.attachEvent)?"on":"")+"load", registerEvents);

jQuery, .