234   2 ขยายบาง column datatable ยังไงครับ



dreamtnwp


พลังงานการช่วยเหลือ
( Level 1 )


คะแนนขอบคุณจากสมาชิก
( 0 )


ตอบกระทู้ ( 1 )
เขียนบทความ ( 0 )

"columnDefs": [
 { "width": "20%", "targets": 0 }
 ]
 
// เคยใช้แบบนี้แล้วไม่ได้ครับ
ความคิดเห็นที่ 1
อ้างอิงความเห็น


bamossza


พลังงานการช่วยเหลือ
( Level 3 )


คะแนนขอบคุณจากสมาชิก
( 15 )


ตอบกระทู้ ( 97 )
เขียนบทความ ( 27 )

ลองดูวิธีนี้นะครับ

Import (JS)

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>

HTML 

<table id="table">
   <thead>
      <tr>
         <th>ProjectId</th>
         <th>Title</th>
         <th>Abstract</th>
         <th>Keywords</th>
         <th>PaperName</th>
         <th>PaperURL</th>
      </tr>
   </thead>
   <tbody>
      <tr id="1">
         <td>ProjectId</td>
         <td>Title</td>
         <td>Abstract</td>
         <td>Keywords</td>
         <td>PaperName</td>
         <td>PaperURL</td>
      </tr>
      <tr id="2">
         <td>ProjectId 2</td>
         <td>Title 2</td>
         <td>Abstract 2</td>
         <td>Keywords 2</td>
         <td>PaperName 2</td>
         <td>PaperURL 2</td>
      </tr>
   </tbody>
</table>

Jquery (JS)

$(document).ready(function() {

   var table = $('#table').DataTable({
         bAutoWidth: false , 
         aoColumns : [
             { sWidth: '50%' },
             { sWidth: '15%' },
             { sWidth: '15%' },
             { sWidth: '15%' },
             { sWidth: '15%' },
             { sWidth: '15%' }
         ]
   });
});

ผลลัพธ์ที่ได้ประมาณนี้ครับ

หรือจะสามารถดูผลลัพธ์ได้จากที่นี่

https://jsfiddle.net/bamossza/u95saj0k/1/

ความคิดเห็นที่ 2
อ้างอิงความเห็น


dreamtnwp


พลังงานการช่วยเหลือ
( Level 1 )


คะแนนขอบคุณจากสมาชิก
( 0 )


ตอบกระทู้ ( 1 )
เขียนบทความ ( 0 )

เดียวลองดูครับ ขอบคุณครับ

แสดงความเห็น

อัพโหลดรูปภาพ..คลิก *** เพื่อความปลอดภัยในด้านสิทธิ ไม่อนุญาติให้นำลิ้งรูปภาพจากที่อื่นมาแปะ ถ้าพบเจอ ลบกระทู้ ทันที ***

Back to Top