Update database with form data without refresh

Question

Hello, I’m making a control panel of a scoreboard, where I have a screen with all the games of the round and as the games are already previously registered on the bench, I need to update the games as the rounds occur. I managed to pass the game ID, but the other inputs with the results did not.

PHP

<?php
while($ln = mysqli_fetch_assoc($qr)){
?>
    <form id="frmPlacar" method="post"> 
    <TABLE align="center">
        <TR>
            <TH rowspan="2">
                <INPUT type="checkbox" name="ids[]" id="ids" value="<?php echo $ln['id_placar'];?>">
            </TH>
            <TH>
                <INPUT type="text" name="time1" value="<?php echo $ln['nm_time1'];?>" placeholder="Time visitante" disabled>
            </TH>
            <TD>
                <INPUT type="text" name="placar1_1" value="<?php echo $ln['nr_placar1_1'];?>" placeholder="1&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar1_2" value="<?php echo $ln['nr_placar1_2'];?>" placeholder="2&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar1_3" value="<?php echo $ln['nr_placar1_3'];?>" placeholder="3&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar1_4" value="<?php echo $ln['nr_placar1_4'];?>" placeholder="4&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
               <INPUT type="text" name="placar1_o" value="<?php echo $ln['nr_placar1_o'];?>" placeholder="OT" maxlength="2">
            </TD> 
            <TD>
                <INPUT type="text" name="placar1_f[]" value="<?php echo $ln['nr_placar1_f'];?>" placeholder="FINAL" maxlength="2">
            </TD> 
            <TD>
                <INPUT type="text" name="campanha1" value="<?php echo $ln['nm_campanha1'];?>" placeholder="CAMPANHA" maxlength="7">
            </TD> 
        </TR>
        <TR>
            <TH>
                <INPUT type="text" name="time2" value="<?php echo $ln['nm_time2'];?>" placeholder="Time mandante" disabled>
            </TH>
            <TD>
                <INPUT type="text" name="placar2_1" value="<?php echo $ln['nr_placar2_1'];?>" placeholder="1&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar2_2" value="<?php echo $ln['nr_placar2_2'];?>" placeholder="2&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar2_3" value="<?php echo $ln['nr_placar2_3'];?>" placeholder="3&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
                <INPUT type="text" name="placar2_4" value="<?php echo $ln['nr_placar2_4'];?>" placeholder="4&ordm; Q" maxlength="2">
            </TD>                                    
            <TD>
               <INPUT type="text" name="placar2_o" value="<?php echo $ln['nr_placar2_o'];?>" placeholder="OT" maxlength="2">
            </TD> 
            <TD>
                <INPUT type="text" name="placar2_f[]" value="<?php echo $ln['nr_placar2_f'];?>" placeholder="FINAL" maxlength="2">
            </TD> 
            <TD>
                <INPUT type="text" name="campanha2" value="<?php echo $ln['nm_campanha2'];?>" placeholder="CAMPANHA" maxlength="7">
            </TD> 
        </TR>
        <TR>
            <TD colspan="8" class="bt" align="right">
                <input type="hidden" value="<?php echo $ln['id_placar'];?>" name="jogos[]" id="jogo">
                <button class="btn btn-small btn-success" id="botao"><i class="icon-thumbs-up icon-white"></i>Alterar</button>
            </TD> 
        </TR>
        <TR>
            <TD colspan="8" align="left">
                <div id="erro">Erro:</div>
                <div id="sucesso">Sucesso:</div>
            </TD>
        </TR>
    </TABLE>
    </form>
<?php
}
?>  

AJAX

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

        var Jogo = new Array();

        $("input[name='ids[]']:checked").each(function(){
            Jogo.push(parseInt($(this).val()));
            alert(Jogo);
        });

        $.ajax({
            type: "POST",
            url: "teste.php",
            data: "jogo="+Jogo,
            success: function(html){
                if(html=='true')
                {
                    $("#erro").html("");
                    $("#sucesso").html("Placar atualizado com sucesso!");
                }
                else
                {
                    $("#erro").html(html);
                    $("#sucesso").html("");
                }
            },
            beforeSend:function()
            {
                $("#erro").html("");
                $("#sucesso").html("");
            }
        });
        return false;
    })
})

Answer 1

The error is that you are taking out the value only the value of the input whose the name=ids[] and it is if you are checked.

The error is in that line:

$("input[name='ids[]']:checked").each(function(){
   ...

You can change to:

$('#frmPlacar input:checked').each(function(){
   ...

This way you will already get the value of all the inputs that are checked

Why are you passing values as array to the server? You worked the file teste.php? If it was and if you allow me a suggestion, I would suggest that it is passed as Object, as array may not give the expected result:

I would do without the array Jogo:

var dados = {};
$('#frmPlacar input:checked').each(function(){
    // aqui cada chave vai ser o 'name' do input
    dados[$(this).prop('name')] = $(this).val();
});

...
data: dados,
success: function(html){
   console.log(html);
   ...

test php.

if($_SERVER['REQUEST_METHOD'] == 'POST') {

    print_r($_POST);
    // verificar consola para ver resposta, se resulta
    // depois para aceder a cada key vá pelo 'name' dos inputs, não esquecendo que alguns deles são arrays. ex:
    print_r($_POST['placar2_f']); 
}