0

Preciso preencher um Modal em modo de edição com base no id recebido. Meu código:

$("body").on('click', '#editfoto', function () {
        $('#modalEdit').modal('show');

        id = $(this).data("idedit");       

        $.get("editafoto.php?id=" + id, function (data, status) {
        }).done(function (data) {
            
            descricaofoto = data['descricaofoto'];
            datavisita = data['datavisita'];
            
            //preenche os campos com dados do banco
            $('#descricaofoto').val(descricaofoto);
            $('#datavisita').val(datavisita);
     

            //console.log("STATUS : ", data);
        }).fail(function (jqXHR, textStatus) {
            console.log("Request failed: " + textStatus);
        });

    });
<div class="modal fade" id="modalEdit" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Editar Foto</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form class="editfoto" method="POST" enctype="multipart/form-data">
                            
                            <div class="row justify-content-md-left">
                                <div class="col col-lg-3">
                                    <label class="control-label" for="datavisita">Data Vísita</label>
                                </div>
                                <div class="col col-lg-6">    
                                    <input type="text" name="dtvisita" id="dtvisita" required autocomplete="off" class="form-control  form-control-sm form-group small" />
                                </div>
                            </div>

                            <div class="row justify-content-md-left">
                                <div class="col col-lg-3">
                                    <label class="control-label" for="idvisita">Visíta</label>
                                </div>
                                <div class='col col-md-6'>   
                                    <input type="text" name="idvisita" id="idvisita" readonly class="form-control  form-control-sm form-group small" />
                                </div>
                            </div>
                            <br />
                            <div class="row justify-content-md-left">
                                <div class="col col-lg-3">
                                    <label class="control-label" for="percentandamento">Porcentagem Andamento</label>
                                </div>
                                <div class="col col-md-6 slidecontainer">
                                    <input type="range" name="percentandamento" id="percentandamento" required min="1" max="100" class="form-control-range slider" oninput="disp.value = percentandamento.value">
                                    <output  id="disp"></output>
                                </div>
                            </div>
                            <div class="row justify-content-md-left">
                                <div class="col col-lg-3">
                                    <label class="control-label" for="caminhofoto">Foto</label>
                                </div>
                                <div>   
                                    <input type="file" name="caminhofoto" id="caminhofoto" required class="form-control-file form-control-sm form-group small" accept="image/png,image/jpg" />
                                </div>
                            </div>
                            <div class="row justify-content-md-left">
                                <div class="col col-lg-3">
                                    <label class="control-label" class="control-label" for="descricaofoto">Descrição Foto</label>
                                </div>
                                <div class='col-md-auto'>                
                                    <textarea name="descricaofoto" id="descricaofoto" cols="25" rows="3" class="form-control  form-control-sm form-group small" ></textarea>
                                </div>
                            </div>  
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        <button type="submit" id="btnEdit" class="btn btn-primary">Salvar</button>
                    </div>
                    </form>
                </div>
            </div>
        </div>

a saída do ajax no arquivo edita.php está funcionando, porém está dando erro de Uncaught TypeError: data is not a function.

8
  • Creio que terá que usar um Ajax.
    – Sam
    Commented 26/11/2018 às 13:53
  • têm alguma idéia de como poderei fazer para preencher o form com ajax?
    – JB_
    Commented 26/11/2018 às 13:54
  • Nesta resposta tem mais ou menos o que vc quer fazer.
    – Sam
    Commented 26/11/2018 às 13:55
  • Não seria data['descricaofoto']? Colchetes em vez de parênteses. Ou data.descricaofoto?
    – Sam
    Commented 26/11/2018 às 14:36
  • ele não está preenchendo os campos do modal, testei data['descricaofoto'] e data.descricaofoto
    – JB_
    Commented 26/11/2018 às 14:41

1 Resposta 1

1

Jb, uma vez que está usando Jquery, você pode usar o ajax, após o retorno for efetivado com sucesso você pode tratar as resposta, mapeado o DOOM via jquery.

    $.ajax({
    	method: 'GET',
    	url: 'url/path',
    	dataType: 'JSON',
    })
    .done(function (response) {
        const data = response.data 
    	$('input[name="dtvisita"]').val(data.idvisita)
    	$('input[name="percentandamento"]').val(percentandamento)
    })
    .fail(function(error) {
    	console.error(error)
    })

3
  • no arquivo edita.php eu preciso devolver um json, ou objeto?
    – JB_
    Commented 26/11/2018 às 22:55
  • deu certo, só não estou conseguindo pegar o caminho do arquivo. preciso exibir no modal uma foto para edição que vem do banco o path dela.
    – JB_
    Commented 26/11/2018 às 23:19
  • Uncaught DOMException: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string.
    – JB_
    Commented 26/11/2018 às 23:46

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .