Question

我使用bootstrap模式并且我在其中调用自动完成功能，当它设置如下时一切正常：

具有数据目标的按钮，用于调用模态的id：

data-target="#modalAdicao"

将id设置为与数据目标匹配的div：

id="modalAdicao"

但是因为它在PHP foreach中被调用并且我需要保留信息，所以我必须将模态的id设置为我正在处理的mysql行的id，如下所示：< / p>

data-target="#modalAdicao<?php echo htmlspecialchars($idModal); ?>"

和

id="modalAdicao<?php echo htmlspecialchars($idModal); ?>"

在此之后，信息被保留，但js停止工作，就像我从未打过电话一样，但它就像那里一样：

<script src="js/procura-paciente.js"></script>

任何人都可以提供帮助吗？

Answer 1

当模态打开时，更改id并重新绘制模态。但是定义了js事件。尝试使用此

$(document).on('input','.busca', limpaCampos);

for循环生成许多#busca，id是唯一的。更改为使用class。例如

php form

<form id="novoAgendamento" method="POST" action="include/novo_agendamento.php">
            <div class="form-inline">
              <div class="form-group">
                <label for="busca" class="sr-only">Identidade</label>
                <input type="text" id="busca" data-id="<?php echo htmlspecialchars($idModal); ?>" placeholder="Identidade" name="rgPaciente" class="mx-sm-69 form-control busca" required>
              </div>
              <div class="form-group">
                <label for="nascimentoPaciente" class="sr-only">Nascimento</label>
                <input type="text" id="nascimentoPaciente" placeholder="Nascimento" name="nascimentoPaciente" class="mx-sm-69 form-control" required>
              </div>
            </div>
            <div class="form-group">
              <label for="nomePaciente"></label>
              <input type="hidden"  name="nomePaciente" class="form-control nomePaciente">
              <input type="hidden" name="cpfPaciente" class="form-control cpfPaciente">
              <input type="hidden" name="horaPaciente" value="<?php echo htmlspecialchars($horarios[$i]); ?>" class="form-control horaPaciente">
              <input type="hidden" name="dataPaciente" value="<?php echo htmlspecialchars($data_agendamento_convert); ?>" class="form-control dataPaciente">
              <input type="hidden" name="medicoPaciente" value="<?php echo htmlspecialchars($medico_completo); ?>" class="form-control medicoPaciente">
              <input type="text"  placeholder="Nome do Paciente" class="form-control nomePaciente2" disabled="">     
              <label for="observacaoPaciente"></label>
              <input type="text" name="observacaoPaciente" placeholder="Observação" class="form-control" required>
            </div>
            <div class="modal-footer">
              <button type="button" data-dismiss="modal" class="btn btn-secondary">Fechar</button>
              <button type="submit" class="btn btn-primary">Agendar</button>
            </div>
          </form>

JS

$(function() {
 $('#tableteste').on('input', '.busca', function(){
    var busca = $(this).val();
    var form = $(this).parents().eq(2);
    if(busca == ""){
    form.find('.nomePaciente').val('');
        form.find('.nomePaciente2').val('');
        form.find('.rgPaciente').val('');
        form.find('.nascimentoPaciente').val('');
        form.find('.cpfPaciente').val('');
    }
});
.....

});

JS在动态更改其id之后不在modal内部运行

1 个答案: