如何将if语句添加到数据表中?

时间:2017-09-16 09:39:32

标签: jquery laravel-5 datatables datatables-1.10

我有数据表,这是表格中的渲染图像,但我所做的只是有图像然后渲染,但如果没有图像还没有声明

这是我的数据表

<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>

如果在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

1 个答案:

答案 0 :(得分:2)

您可以使用columns.defaultContent选项为列设置默认静态内容。

<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>