1

I am a beginner of laravel. I want to edit a record which contains image, but it just show the input type for file same as insert records, instead of displaying the image. I have no ideas how to make it. Any comments are appreciated. Thanks.

Modal

<div class="modal-body">
  <form method="POST" id="memberCardForm" name="memberCardForm" class="form-horizontal" enctype="multipart/form-data">

    @csrf
    <input type="hidden" name="id" id="id">
    <div class="form-group">
      <label for="">Card Type</label>
      <div class="col-sm-12">
        <input type="text" class="form-control" id="card_type" name="card_type" maxlength="50" required>
      </div>
    </div>

    <div class="form-group">
      <label for="">Description</label>
      <div class="col-sm-12">
        <input type="text" class="form-control" id="card_desc" name="card_desc" maxlength="50" required>
      </div>
    </div>

    <div class="form-group">
      <label for="">Entitlement</label>
      <div class="col-sm-12">
        <input type="text" class="form-control" id="card_entitlement" name="card_entitlement" maxlength="50">
      </div>
    </div>

    <div class="form-group">
      <label for="">Card Image</label>
      <div class="col-sm-12">
        <input type="file" class="form-control" id="image" name="image" required>
      </div>
    </div>
    <div class="modal-footer">
      <a href="#" class="btn btn-danger" data-dismiss="modal">Close</a>
      <button type="submit" id="saveBtn" class="btn btn-success">Save</button>
    </div>
  </form>
</div>

JS for Edit record

//Edit
$('body').on('click', '.editRecord', function() {
  var id = $(this).data('id');
  $.get("{{ url('membercards/edit') }}" + '/' + id, function(data) {
    $('#exampleModalLabel').html("Edit Member Card");
    $('#saveBtn').html('Save');
    $('#exampleModal').modal('show');
    $('#id').val(data.id);
    $('#card_type').val(data.card_type);
    $('#card_desc').val(data.card_desc);
    $('#card_entitlement').val(data.card_entitlement);
    $('#image').val(data.image);
  })
});
Ghost Ops
  • 1,710
  • 2
  • 13
  • 23
Say Jack
  • 61
  • 1
  • 6
  • https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Images_in_HTML, https://stackoverflow.com/questions/554273/changing-the-image-source-using-jquery ? – Don't Panic Oct 19 '21 at 12:10

0 Answers0