Olá, tento fazer uma requisição para atualização de item do accordion no mysql, porém apenas um item é atualizado.
O código funciona da seguinte forma: É buscado perguntas referente ao vídeo selecionado no carousel, logo após, o código da Amostra de Código 1, cria os cards dentro do modal. Cada card é referente a uma pergunta diferente registrada no Banco de Dados.
Porém, ao tentar atualizar um item do MYSQL, dentro do card, no textarea, o primeiro item (1º pergunta) desse accordion é atualizado, o segundo item (2º pergunta) não é atualizado.
Cada pergunta possui um id no MYSQL, bem como, um assunto, uma resposta, uma pergunta... de acordo com a Figura 01.
Vale ressaltar que, de acordo com a Amostra de Código 2, é buscado juntamente com o AJAX, todas as perguntas referente ao vídeo selecionado no carousel.
Amostra de Código 1:
$(document).ready(function() {
$(function(){
$('#responder_duvidas').click(function() {
var codigoVideo2 = $('.carousel-item.active').attr('data-link_video');
var accordion2 = "";
$.post("buscar_duvida_monitor_resp.php", {
codigo_video_monitor: codigoVideo2,
},
function(data2, status) {
if (data2 !== "Fail") {
$("#dynamic_accordion #accordion").html(accordion2); // Adiciona essa linha
$.each(JSON.parse(data2), function (index2, duvida3){
accordion2 += '<div class="card" style="margin: 5px">';
accordion2 += '<div class="card-header" id="heading'+index2+'">';
accordion2 += '<h5 class="mb-0">';
accordion2 += '<button class="btn btn-link" data-toggle="collapse" data-target="#collapse'+index2+'" aria-expanded="true" aria-controls="collapse'+index2+'">';
accordion2 += duvida3.assunto;
accordion2 += '</button>';
accordion2 += '</h5>';
accordion2 += '</div>';
accordion2 += '<div id="collapse'+index2+'" class="collapse" aria-labelledby="heading'+index2+'" data-parent="#accordion">';
accordion2 += '<div class="card-body">';
accordion2 += '<div style="background: #ddd; color #fff; padding: 10px 20px; border-radius: 5px">';
accordion2 += duvida3.pergunta;
accordion2 += '</div>';
accordion2 += '<hr>';
accordion2 += '<div style="background: #fff; color #fff; padding: 10px 20px; border-radius: 5px">';
accordion2 += '<form method="post" enctype="multipart/form-data">';
accordion2 += '<textarea class="form-control" name="resposta" id="resposta" required>'+duvida3.resposta+'</textarea>';
accordion2 += '<input type="hidden" id="id_duvidas" value="'+duvida3.idduvidas+'" />';
accordion2 += '<br><button type="button" id="enviar_resposta" class="btn btn-success btn-sm">Enviar resposta</button>';
accordion2 += '</form>';
accordion2 += '</div>';
accordion2 += '</div>';
accordion2 += '</div>';
accordion2 += '</div>';
$("#dynamic_accordion #accordion").html(accordion2);
});
}
});
});
$(document).on("click", "#enviar_resposta",function(){
$.ajax({
url: "atualizar_resposta.php",
method: "POST",
data: {
resposta: $('#resposta').val(),
idduvidas: $('#id_duvidas').val()
},
success: function(res) {
var data = JSON.parse(res);
alert((data.success == true) ? "Pergunta atualizada" : "Pergunta não atualizada");
$('.modal-backdrop').remove();
return;
}
});
// fecha modal
$("#modalDuvidas").modal("hide");
});
});
});
Figura 1:
Amostra de Código 2:
<?php
if (isset($_POST['idduvidas']) && isset($_POST['resposta'])) {
$id_resposta = $_POST['idduvidas'];
$resposta = $_POST['resposta'];
$servidor = 'localhost';
$usuario = 'root';
$senha = 'root';
$banco = 'onteach';
$conexao = mysqli_connect($servidor,$usuario,$senha,$banco);
$consulta2 = "UPDATE duvidas SET duvidas.resposta = '$resposta' WHERE duvidas.idduvidas = '$id_resposta'";
die(json_encode(['success'=>(mysqli_query($conexao, $consulta2))]));
}
Figura 2 (FIGURA COMPLEMENTAR APRESENTANDO O ACCORDION NO WEBSITE)
Por fim, este tópico auxilia em um tema que é específico, porém, pode ser utilizado para outros fins de programação, bem como, a utilização de definição de váriantes em accordion com maiores itens.
Desde já, agradeço.