Home > front end >  How to loop through JSON GET result?
How to loop through JSON GET result?

Time:05-29

I am laravel developer and i have no experience with jquery , i want to show editable images on dropbox file uploader please help me how can i dynamic ? thank u.

Jquery Scripts

<script>
$(document).ready(function(){

    var data = @json($roomdetails);

    var   file ="{{Config('wfh.file')}}";

    $.each(data, function(i, item) {

        {id: 1, src: 'https://picsum.photos/500/500?random=1'},
    }),

     let preloaded = [
                {id: 1, src: 'https://picsum.photos/500/500?random=1'},
                {id: 2, src: 'https://picsum.photos/500/500?random=2'},
                {id: 3, src: 'https://picsum.photos/500/500?random=3'},
                {id: 4, src: 'https://picsum.photos/500/500?random=4'},
                {id: 5, src: 'https://picsum.photos/500/500?random=5'},
                {id: 6, src: 'https://picsum.photos/500/500?random=6'},
       ];


    $('.input-images').imageUploader({
        preloaded: preloaded,
        imagesInputName: 'images',
        preloadedInputName: 'old'
    });
});
</script>

This is static images and i want to like this.

 let preloaded = [
                    {id: 1, src: 'https://picsum.photos/500/500?random=1'},
                    {id: 2, src: 'https://picsum.photos/500/500?random=2'},
                    {id: 3, src: 'https://picsum.photos/500/500?random=3'},
                    {id: 4, src: 'https://picsum.photos/500/500?random=4'},
                    {id: 5, src: 'https://picsum.photos/500/500?random=5'},
                    {id: 6, src: 'https://picsum.photos/500/500?random=6'},
           ];

CodePudding user response:

Your question is very unclear. No way to know what you are asking. When I look at your code, I might suggest the following.

<script>
$(function(){
  var data = @json($roomdetails);
  var file ="{{Config('wfh.file')}}";
  var preload = [];

  $.each(data, function(i, item) {
    preload.push({id: item.id, src: item.src});
  });

  $('.input-images').imageUploader({
    preloaded: preloaded,
    imagesInputName: 'images',
    preloadedInputName: 'old'
  });
});
</script>

As you did not provide an example of data, I havce no way to know if this is suitable.

  • Related