如何使用jquery获取编辑文本的价值

Question

Hi i want to get changed text value from JQuery but i can't select edit text with JQUERY because edit texts generated from php while loop that this php code query on database and get value of edit texts and in my program i have edit button for every edit texts and when the user changed value of edit text i select new value and when user click edit button send this value from get method to another php page with jquery $.ajax function and send new value to that php code with ajax.But i don't know how can i select edit text that it's value changed because i don't know id of that edit text!.And when i set one id for every edit text i only get first edit text value from $("#id").change().val(); .I use below code but it doesn't work.I am beginner in java script and don't know how fix this problem!.

var testAnswer;

function setNewTestAnswer(id){
    testAnswer = $("#id").val();
}
function sendToEdit(pID,phID,thDate,type){
    var info = 'pId='+pID+'&phId='+phID+'&testAnswer='+testAnswer+'&thDate='+thDate+'&type='+type;
}

2nd function use testAnswer that user changed in edit text.
php code

<?php
    include 'Connect.php'; 
    if(match($_POST['pId'], "/^[\d]+$/") ){
        $pId = $_POST['pId'];
        $result = mysql_query("select pName, pID, phName, phID, testHistoryDate, type, testAnswer from patient join reception using(pID) join physician using(phID) join testHistory using(rID) join test using(tID) where pID = $pId",$connection);
    }
    else
        die("Insert true value");
    while($row=mysql_fetch_array($result)){
        echo "<tr><td>";
        echo $row["pName"].'</td>';
        echo '<td>'.$row["phName"].'</td>';
        echo '<td>'.$row["testHistoryDate"].'</td>';
        echo '<td>'.$row["type"].'</td>';
        $type =  $row['type'];
        $testHistoryDate = $row['testHistoryDate'];
        ?>
        <td>
            <span id='spryTanswer'>
                <input type='text' name='tAnswer' id='tAnswer' value='<?php echo $row['testAnswer']; ?>' />
            </span>
        </td>
        <td>
            <input type='submit' value='Edit' name='edit' id='edit' onclick="sendToEdit('<?php echo $row['pID'] ?>','<?php echo $row['phID'] ?>', '<?php echo $row['testHistoryDate'] ?>', '<?php echo $row['type'] ?>')" />
        </td>
        </tr>
    <?php } ?>

Answer 1

tl;dr

So it isn't completely clear what you are trying to do here but I can explain a couple things that might help.

• in html ids should be unique. You dont have to obey this rule for your page to work but you have found one of the consequences if breaking it: jQuery will only find the first one.

• it is a good idea to base html ids on some unique attribute of your data eg the table row id.

• You can get more creative with your jQuery selectors for example

  $('input[type="text"]') // gets all the text inputs

• Use classes. When you want to be able to easily select all of a group of html elements you should give them all the same class name. one element can have multiple class names and many elements can share a class name. you can then select them by class name using jquery like this:

  $('.myclassname')

I think you need to change your php to look more like this:

<span class='spryTanswer'>
  <input type='text' name='tAnswer' id='tAnswer-<?php echo $row['id'] ?>' value='<?php echo $row['testAnswer']; ?>' />
</span>

Answer 2

Since you're creating elements inside a php loop, you must be sure that every element has a unique id (or no id at all). You can use either an incrementing index, or some unique value in your array. At first glance, seems that $row['pID'] is a good candidate:

<input id='edit_<?php $row['pID'] ?>' type='submit' value='Edit' ... />

After that you should be able to target individual elements.