title: Creating a searchable image gallery with datatable
body: <p>Datatable is great when using data to display in tables. I like it's searching behavior.  I want to make a image gallery with same searching behavior.</p>
  
  <p><strong>Jquery</strong> </p>
  
  <pre><code>if ($("#tbl_images_list").length) {
      // Get parameters from the current URL 
      var oTable = $('#tbl_images_list').DataTable({
          processing: true,
          serverSide: true,    
  
          ajax: {
              url: 'upload_images/fetch',
          },
          columns: [{
              data: null,                               
              render: function(data, type, row, meta) {
                  return '&lt;img src="' + row.image_url + '" onerror="this.src=' 
                      + 'uploads/default.png' + '" width="400" height="200"&gt;';
              },
              name: 'image_url'
          },],
      });
  }
  </code></pre>
  
  <p><strong>View</strong></p>
  
  <pre><code>&lt;div class="body table-responsive"&gt;
      &lt;table class="table table-bordered table-striped table-hover d-flex" id="tbl_images_list"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;Image&lt;/th&gt;   
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody &gt;                               
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>public function fetch() 
  {
      $model = Image::select('image_url');
      return Datatables::eloquent($model)-&gt;make(true);
  }
  </code></pre>
  
  <p>As for now it is rendering just one column and images in a row.
  What I can do here I can do something to make the rows side by side, everything will be awesome then.  Let me give a visible example.  So for now, here  what is on screen.</p>
  
  <pre><code>| Image (column_name) |
  |   Row 1 (image_1)   |
  |   Row 2 (image_2)   |
  .....son on............
  </code></pre>
  
  <p>What I want is make rows adjacent to each other, I know it's stupid idea. But this idea would work here if it's possible.</p>
  
  <pre><code>| Image (column_name) |
  | Row 1 (image_1)  | | Row 2 (image_2) | and so on...
  </code></pre>
  
  <p>I need help. Please tell me if it's possible, or any alternative way to achieve the same.</p>