Como atualizar banco com inputs e botões diferentes sem sair da pagina

[SabrinaCastro 0]

Gente, não sei se vou saber explicar direito, mas vamos lá.

 

Preciso atualizar jogos de um campeonato.

 

Fiz uma consulta no banco que busca os jogos de uma certa rodada, tipo rodada 5.
Ele traz os nomes das equipes, data e tudo mais. Até ai beleza.

 

Bom, dai eu crio uma tabela com os jogos e coloco os inputs para o placar de cada jogo.

 

ex:

jogo1 - time1 (input do placar time1) x (input do placar time2) time2 BOTAO

jogo2 - time1 (input do placar time1) x (input do placar time2) time2 BOTAO

jogo3 - time1 (input do placar time1) x (input do placar time2) time2 BOTAO

 

Cada linha tem o respectivo jogo e um botão pra atualizar o resultado do jogo.

Bom, eu preciso atualizar os jogos individualmente clicando no botão sem sair da página, através talvez de um javascript, não sei bem como fazer.

 

Como ele gera inputs com ids diferentes, não to conseguindo fazer.

 

Alguém me dá uma luz?

Por favor!!!

Obrigada a todos!

[M.Torres 1]

Primeiro, crie uma função js para ser executada no onlcick do button com alguma identificação para saber quais inputs dos times você deve recuperar os dados, exemplo:

<input id="inputPlacar1_1"> X <input id="inputPlacar2_1"> <input type="button" onlclick="getValues('1');"
<input id="inputPlacar1_2"> X <input id="inputPlacar2_2"> <input type="button" onlclick="getValues('2');"
<input id="inputPlacar1_3"> X <input id="inputPlacar2_3"> <input type="button" onlclick="getValues('3');"

Agora a função javascript para resgatar os valores:

//função para resgatar os valores do placar de determinado jogo
function getValues(placar){
   var placar1 = getElementById('inputPlacar1_' + placar);
   var placar2 = getElementById('inputPlacar2_' + placar);
  
  //apenas para demonstração
   alert('Resultado: ' + placar1.value + ' X ' + placar2.value)

}

Tendo os resultados você pode executar através de ajax uma página para gravar esses dados.

 

Não sei se consegui ser claro o suficiente.

[SabrinaCastro 0]

Oi M.Torres,

Nesse caso, como faço pra passar os valores dos inputs do seu ex?

 

esse 1 do getValues('1') é o que?

 

Não entendi bem como fazer.

ahhhhhhhh... acho que entendi.

 

aqui, nesse caso

'inputPlacar1_' + placar 

 

é como fosse concactenar o valor do getValuel ao texto, né?

[William Bruno 1501]

Sabrina, pensa em partes.

 

como vc faria se fosse apenas 1 input ?

e com apenas os 2, sabe fazer só com 2 ?

[SabrinaCastro 0]

bom... acho que é atraves do

getElementById.

 

Eu pensei que tivesse que passar na ação do botão

[William Bruno 1501]

uma forma simples de vc fazer, é ter um formulário para cada "jogo"

 

ai, no evento onsubmit de cada form, vc pega os dados daquele form e envia para o ajax.

Só isso.

[SabrinaCastro 0]

O exemplo do M.Torres deu bem certo. Porém só falta agora atualizar o jogo no banco de dados.

Como poderei fazer sem sair da página, sendo que não dá pra misturar javascript com php?

aff... :(

[Dian Carlos 29]

Você pode usar o plugin jQuery Form http://jquery.malsup.com/form/. ele envia formulários sem sair da página, e retorna o resultado em qualquer lugar que você quizer.

 

Exemplos e tutoriais tem na própria documentação.

 

Boa sorte.

[SabrinaCastro 0]

Hum.. obrigada pela dica Dian! vou tentar algum resultado.