How to add if statement into datatables?

Question

I have datatables which is render image inside table but what I've done is just if there is image then render but if no image not yet have statement

here's my datatables

<script type="text/javascript">
$(function() {
    $('#pengumuman-table').DataTable({
        processing: true,
        serverSide: true,
        responsive: true,
        ajax: '{!! route('pengumuman.data') !!}',
        columns: [
            { data: 'rownum', name: 'rownum' },
            { data: 'gambar', render: function(data)
                { return '<img src="{{ asset("/images/pengumuman/") }}/'+data+'" atl img style="width:200px; height:150px"/>' }
            },
            { data: 'nama_pengumuman', name: 'nama_pengumuman' },
            { data: 'created_at', name: 'created_at' },
            { data: 'action', name: 'action', orderable: false, searchable: false }
        ]
    });
});
</script>

How do I add statement if no image in datatable like this in php

@if(isset($pegawai->foto) && !empty($pegawai->foto))
  <div align="center"> 
  <img src="{{ asset("/images/karyawan/$pegawai->foto") }}" alt="" img style="width:250px; height:260px">
  </div>
@else
  <div align="center"> 
  <img src="http://www.blogsaays.com/wp-content/uploads/2014/02/no-user-profile-picture-whatsapp.jpg" alt="" img style="width:250px; height:260px">
  </div>
@endif

Prashant Pokhriyal · Accepted Answer · 2019-06-28 08:02:16Z

7

You can use columns.defaultContent option to set default static content for a column.

<script type="text/javascript">
  $(function() {
    $('#pengumuman-table').DataTable({
        processing: true,
        serverSide: true,
        responsive: true,
        ajax: '{!! route('pengumuman.data') !!}',
        columns: [
            { 
              data: 'rownum', 
              name: 'rownum' 
            },
            { 
              data: 'gambar', 
              render: function(data) { 
                if(data) {
                  return '<img src="{{ asset("/images/pengumuman/") }}/'+data+'" atl img style="width:200px; height:150px"/>' 
                }
                else {
                  return '<img src="http://www.blogsaays.com/wp-content/uploads/2014/02/no-user-profile-picture-whatsapp.jpg" alt="" img style="width:250px; height:260px">'
                }

              },
              defaultContent: '<img src="http://www.blogsaays.com/wp-content/uploads/2014/02/no-user-profile-picture-whatsapp.jpg" alt="" img style="width:250px; height:260px">'
            },
            { 
              data: 'nama_pengumuman', 
              name: 'nama_pengumuman' 
            },
            { 
              data: 'created_at', 
              name: 'created_at'
            },
            { 
              data: 'action', 
              name: 'action', 
              orderable: false, 
              searchable: false
            }
        ]
    });
  });
</script>

edited Jun 28, 2019 at 8:02

answered Sep 16, 2017 at 17:37

Prashant Pokhriyal

3,8474 gold badges33 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Prashant Pokhriyal Over a year ago

if you are getting image for each and every data, then it will not show? Are you getting any warnings?

Aslam H Over a year ago

I did not get any warning just like no defaultContent: there

Prashant Pokhriyal Over a year ago

what is the content of data in this line --> '<img src="{{ asset("/images/pengumuman/") }}/'+data+'"

Aslam H Over a year ago

it's images name from database

Aslam H Over a year ago

thank you very much @Prashant Pokhriyal this work like a charm!!

Collectives™ on Stack Overflow

How to add if statement into datatables?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related