Ajax没有获得唯一的ID

Question

I have a little livescore page with multiple matches, each match having unique id in database. I use AJAX to submit data to database, to avoid page refresh. The problem is that AJAX doesn't recognize on which match I submit (update) data (score) and always sends the id from 1st table (match). If I use PHP in same file code works fine but the page needs reloading:

$queryAPTChallenge = mysqli_query($server, "SELECT * FROM meciurilive WHERE Turneu='APT Challenge'");

while ($row = mysqli_fetch_array($queryAPTChallenge)) {
$id=$row['id'];
$submitj1='submitj1'.$id;
$jucator1=$row['Jucator1'];
$jucator2=$row['Jucator2'];
$ziua=$row['Ziua'];
$ora=$row['Ora'];
$set1j1=$row['Set1j1'];
$set1j2=$row['Set1j2'];
$set2j1=$row['Set2j1'];
$set2j2=$row['Set2j2'];
$set3j1=$row['Set3j1'];
$set3j2=$row['Set3j2'];

echo "<table style='margin-top:50px;margin-left:65px;border-collapse:collapse;display:inline-block;'>
<tbody><tr>
<td></td>
<td></td>
<td colspan='3'>
<div style='margin-bottom: 0;'>
<input type='hidden' id='idmeci' value=$id>
<input style='font-size:30px; width:100%;' type='submit' id='submitj1' value='GAME'>
</div>
</td>

</tr>
<tr>
<td style='text-align:center; width: 60px;'>
<div style='margin-bottom: 0;'>
<input type='hidden' id='idmeci' value=$id>
<input type='submit' name='undoj1' value='UNDO'>
</div>
</td>
<td style='text-align: left;font-family: arial, sans-serif;font-size: 17px;text-indent: 10px;padding-left: 0px;padding-right: 0px;padding-top: 5px;padding-bottom: 5px;line-height: 1.5;background: radial-gradient(#E6E6E6, #BABABA 100%);color: black;font-weight: bold;background-size: 100% 100%;border:3px solid black;width:185px'>$jucator1</td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj1s1'>$set1j1</div></td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj1s2'>$set2j1</div></td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj1s3'>$set3j1</div></td>

</tr>
<tr>
<td style='text-align:center; width: 60px;'>
<div style='margin-bottom: 0;'>
<input type='hidden' id='idmeci' value=$id>
<input type='submit' name='undoj2' value='UNDO'>
</div>
</td>
<td style='text-align: left;font-family: arial, sans-serif;font-size: 17px;text-indent: 10px;padding-left: 0px;padding-right: 0px;padding-top: 5px;padding-bottom: 5px;line-height: 1.5;background: radial-gradient(#E6E6E6, #BABABA 100%);color: black;font-weight: bold;background-size: 100% 100%;border:3px solid black;width:185px'>$jucator2</td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj2s1'>$set1j2</div></td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj2s2'>$set2j2</div></td>
<td style='width: 60px;text-align:center;font-family:arial,sans-serif;font-size:19px;font-weight:bold;border:3px solid black;background:#9f3210;color:white'><div id='showj2s3'>$set3j2</div></td>

</tr>
<tr>
<td></td>
<td style='width: 60px;'>
<div style='margin-bottom: 0;'>
<input type='hidden' id='idmeci' value=$id>
<input type='submit' name='sterg' value='STERG'>
</div>
</td>
<td colspan='3'>
<div style='margin-bottom: 0;'>
<input type='hidden' id='idmeci' value=$id>
<input style='font-size:30px; width:100%;' type='submit' id='submitj2' value='GAME'>
</div>
</td>
<td></td>

</tr>
</tbody></table>";
}

AJAX:

$(document).ready(
    $('body').on('click' , '#submitj1', function() {

    var id = $('input#idmeci').val();

    $.ajax({
        url: "submit.php",
        type: "POST",
        cache: false,
        data: {
            idd: id
        },
        succes: function(){
            alert('succes');
        }
    })

    });
});

submit.php:

$server = mysqli_connect("localhost", "root", "root");
$db = mysqli_select_db($server, "tenisapt");

$idmeci = $_POST['idd'];

$sql = "SELECT Set1j1,Set1j2,Set2j1,Set2j2,Set3j1,Set3j2 FROM meciurilive WHERE id=$idmeci";
$result = mysqli_query($server, $sql);

$row = mysqli_fetch_assoc($result);
$set1j1 = $row['Set1j1'];
$set1j2 = $row['Set1j2'];
$set2j1 = $row['Set2j1'];
$set2j2 = $row['Set2j2'];
$set3j1 = $row['Set3j1'];
$set3j2 = $row['Set3j2'];

if ((($set1j1<6) && ($set1j2<5)) || (($set1j1<5) && ($set1j2<6)) || (($set1j1==5) && ($set1j2==5)) || (($set1j1==6) && ($set1j2==5)) || (($set1j1==5) && ($set1j2==6)) || (($set1j1==6) && ($set1j2==6))){
    $actualizare = "UPDATE meciurilive SET Set1j1 = Set1j1 + 1 WHERE id=$idmeci";
    mysqli_query($server, $actualizare);
}
else if ((($set2j1<6) && ($set2j2<5)) || (($set2j1<5) && ($set2j2<6)) || (($set2j1==5) && ($set2j2==5)) || (($set2j1==6) && ($set2j2==5)) || (($set2j1==5) && ($set2j2==6)) || (($set2j1==6) && ($set2j2==6))){
    $actualizare = "UPDATE meciurilive SET Set2j1 = Set2j1 + 1 WHERE id=$idmeci";
    mysqli_query($server, $actualizare);
}
else if ((($set3j1<6) && ($set3j2<5)) || (($set3j1<5) && ($set3j2<6)) || (($set3j1==5) && ($set3j2==5)) || (($set3j1==6) && ($set3j2==5)) || (($set3j1==5) && ($set3j2==6)) || (($set3j1==6) && ($set3j2==6))){
    $actualizare = "UPDATE meciurilive SET Set3j1 = Set3j1 + 1 WHERE id=$idmeci";
    mysqli_query($server, $actualizare);
}

Answer 1

Replace:

var id = $('input#idmeci').val();

with :

var id = $(this).prev('input').val();