Neeraj1005's avatar

how can I store image using java script or ajax?

This line shows me an error plz fix this var image = $('#clientimage' + id).prop('files')[0];

<div class="row">
    @foreach($client as $clie)
<div class="form-group" id="mydiv1">
         <label for="myid1" class="col-form-label">Myid1:</label>
               <input type="text" id="myid1" class="form-control" readonly="">
                       </div>
                <label for="clientimage">Logo #{{$loop->index+1}}</label>
            <input type="file" class="form-control-file" name="image" id="clientimage{{$clie->id}}">
        <small id="emailHelp" class="form-text text-muted">JPEG, PNG only</small>
                           </div>
       <button type="submit" class="btn btn-primary float-right" onclick="updateImage()">update</button> 
                               {{-- </form> --}}
                                   </div>
                            @endforeach
                               </div>

    @endforeach
</div>
<script>
    function updateImage(){
        // var image = myFormData.append('image', $('#clientimage' + id).prop('files')[0]));
        var id = $('#myid1').val();
        var image = $('#clientimage' + id).prop("files")[0];
         $.ajax({
            headers: {
                 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
             },
            type: 'PUT',
            dataType: 'json',
            mimeType: 'multipart/form-data',
            data: {image:image},
            // url: `/cms/companyClient/${id}`,
            url: "/cms/companyClient/"+id,
            success: function( _response ){
                console.log(_response);
                console.log("file uploaded");
            },
            error: function( _response ){
                console.log(_response);
            }
         });
    }
</script>
0 likes
0 replies

Please or to participate in this conversation.