No Description Available
1
Exif js is a Javascript library that provides us exif information of images.
onex
This is a multiple-input fields generator that can generate or add or create multiple input fields dynamically at a time.
$("#file").change(function(e) { // Exif js EXIF.getData($("#file")[0].files[0], function() { let obj = EXIF.getAllTags(this); let tr = ""; if(Object.entries(obj).length === 0 && obj.constructor === Object){ $('.alert').show().html('No Exif Data Found ...').delay(4000).fadeOut(); } Object.keys(obj).forEach(function(key) { tr += "<tr><th>" + key + "</th><td>" + obj[key] + "</td></tr>"; }); $("#res").html(tr); }); var reader = new FileReader(); reader.readAsDataURL($("#file")[0].files[0]); var me = this; reader.onload = function() { var fileContent = reader.result; $(".adp-img").html(`<img id="pi" src='${fileContent}'>`); }; });
<section class="mt-5"> <div class="container"> <div class="card"> <div class="card-body"> <div class="form-row"> <div class="col-md-6 cil-xs-12"> <form class="adp-form"> <div class="form-row align-items-center"> <label>Choose Image</label> <div class="input-group mb-2"> <div class="input-group-prepend"> <div class="input-group-text"><i class="fas fa-images"></i></div> </div> <input type="file" class="btn btn-light btn-sm form-control" id="file" placeholder="Jane Doe" accept="image/*"> </div> </div> </form> <div class="adp-img"></div> </div> <div class="col-md-6 cil-xs-12 table-responsive"> <h2>Result</h2> <p>Exif data will shown here.....</p> <div class="alert alert-danger" style="display:none"></div> <table class="table table-hover table-striped table-sm"> <tbody id="res"> </tbody> </table> </div> </div> </div> </div> </div> </section>