JS

script Data Table

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.11.5/datatables.min.css" /> <table id="tblUser" width="90%"> <thead> <tr> <th>หัวตาราง 1 1</th> <th>หัวตาราง 1 2</th> <th>หัวตาราง 1 3</th> <th>หัวตาราง 1 4</th> <th>หัวตาราง 1 5</th> </tr> </thead> <tbody> <tr> <td>เนื้อหา แถว 2 คอลัมน์ 1</td> <td>เนื้อหา แถว 2 คอลัมน์ 2</td> <td>เนื้อหา แถว 2 คอลัมน์ 3</td> <td>เนื้อหา แถว 2 คอลัมน์ 4</td> <td>เนื้อหา แถว 2 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 3 คอลัมน์ 1</td> <td>เนื้อหา แถว 3 คอลัมน์ 2</td> <td>เนื้อหา แถว 3 คอลัมน์ 3</td> <td>เนื้อหา แถว 3 คอลัมน์ 4</td> <td>เนื้อหา แถว 3 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 4 คอลัมน์ 1</td> <td>เนื้อหา แถว 4 คอลัมน์ 2</td> <td>เนื้อหา แถว 4 คอลัมน์ 3</td> <td>เนื้อหา แถว 4 คอลัมน์ 4</td> <td>เนื้อหา แถว 4 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 5 คอลัมน์ 1</td> <td>เนื้อหา แถว 5 คอลัมน์ 2</td> <td>เนื้อหา แถว 5 คอลัมน์ 3</td> <td>เนื้อหา แถว 5 คอลัมน์ 4</td> <td>เนื้อหา แถว 5 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 6 คอลัมน์ 1</td> <td>เนื้อหา แถว 6 คอลัมน์ 2</td> <td>เนื้อหา แถว 6 คอลัมน์ 3</td> <td>เนื้อหา แถว 6 คอลัมน์ 4</td> <td>เนื้อหา แถว 6 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 7 คอลัมน์ 1</td> <td>เนื้อหา แถว 7 คอลัมน์ 2</td> <td>เนื้อหา แถว 7 คอลัมน์ 3</td> <td>เนื้อหา แถว 7 คอลัมน์ 4</td> <td>เนื้อหา แถว 7 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 8 คอลัมน์ 1</td> <td>เนื้อหา แถว 8 คอลัมน์ 2</td> <td>เนื้อหา แถว 8 คอลัมน์ 3</td> <td>เนื้อหา แถว 8 คอลัมน์ 4</td> <td>เนื้อหา แถว 8 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 9 คอลัมน์ 1</td> <td>เนื้อหา แถว 9 คอลัมน์ 2</td> <td>เนื้อหา แถว 9 คอลัมน์ 3</td> <td>เนื้อหา แถว 9 คอลัมน์ 4</td> <td>เนื้อหา แถว 9 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 10 คอลัมน์ 1</td> <td>เนื้อหา แถว 10 คอลัมน์ 2</td> <td>เนื้อหา แถว 10 คอลัมน์ 3</td> <td>เนื้อหา แถว 10 คอลัมน์ 4</td> <td>เนื้อหา แถว 10 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 11 คอลัมน์ 1</td> <td>เนื้อหา แถว 11 คอลัมน์ 2</td> <td>เนื้อหา แถว 11 คอลัมน์ 3</td> <td>เนื้อหา แถว 11 คอลัมน์ 4</td> <td>เนื้อหา แถว 11 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 12 คอลัมน์ 1</td> <td>เนื้อหา แถว 12 คอลัมน์ 2</td> <td>เนื้อหา แถว 12 คอลัมน์ 3</td> <td>เนื้อหา แถว 12 คอลัมน์ 4</td> <td>เนื้อหา แถว 12 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 13 คอลัมน์ 1</td> <td>เนื้อหา แถว 13 คอลัมน์ 2</td> <td>เนื้อหา แถว 13 คอลัมน์ 3</td> <td>เนื้อหา แถว 13 คอลัมน์ 4</td> <td>เนื้อหา แถว 13 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 14 คอลัมน์ 1</td> <td>เนื้อหา แถว 14 คอลัมน์ 2</td> <td>เนื้อหา แถว 14 คอลัมน์ 3</td> <td>เนื้อหา แถว 14 คอลัมน์ 4</td> <td>เนื้อหา แถว 14 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 15 คอลัมน์ 1</td> <td>เนื้อหา แถว 15 คอลัมน์ 2</td> <td>เนื้อหา แถว 15 คอลัมน์ 3</td> <td>เนื้อหา แถว 15 คอลัมน์ 4</td> <td>เนื้อหา แถว 15 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 16 คอลัมน์ 1</td> <td>เนื้อหา แถว 16 คอลัมน์ 2</td> <td>เนื้อหา แถว 16 คอลัมน์ 3</td> <td>เนื้อหา แถว 16 คอลัมน์ 4</td> <td>เนื้อหา แถว 16 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 17 คอลัมน์ 1</td> <td>เนื้อหา แถว 17 คอลัมน์ 2</td> <td>เนื้อหา แถว 17 คอลัมน์ 3</td> <td>เนื้อหา แถว 17 คอลัมน์ 4</td> <td>เนื้อหา แถว 17 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 18 คอลัมน์ 1</td> <td>เนื้อหา แถว 18 คอลัมน์ 2</td> <td>เนื้อหา แถว 18 คอลัมน์ 3</td> <td>เนื้อหา แถว 18 คอลัมน์ 4</td> <td>เนื้อหา แถว 18 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 19 คอลัมน์ 1</td> <td>เนื้อหา แถว 19 คอลัมน์ 2</td> <td>เนื้อหา แถว 19 คอลัมน์ 3</td> <td>เนื้อหา แถว 19 คอลัมน์ 4</td> <td>เนื้อหา แถว 19 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 20 คอลัมน์ 1</td> <td>เนื้อหา แถว 20 คอลัมน์ 2</td> <td>เนื้อหา แถว 20 คอลัมน์ 3</td> <td>เนื้อหา แถว 20 คอลัมน์ 4</td> <td>เนื้อหา แถว 20 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 21 คอลัมน์ 1</td> <td>เนื้อหา แถว 21 คอลัมน์ 2</td> <td>เนื้อหา แถว 21 คอลัมน์ 3</td> <td>เนื้อหา แถว 21 คอลัมน์ 4</td> <td>เนื้อหา แถว 21 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 22 คอลัมน์ 1</td> <td>เนื้อหา แถว 22 คอลัมน์ 2</td> <td>เนื้อหา แถว 22 คอลัมน์ 3</td> <td>เนื้อหา แถว 22 คอลัมน์ 4</td> <td>เนื้อหา แถว 22 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 23 คอลัมน์ 1</td> <td>เนื้อหา แถว 23 คอลัมน์ 2</td> <td>เนื้อหา แถว 23 คอลัมน์ 3</td> <td>เนื้อหา แถว 23 คอลัมน์ 4</td> <td>เนื้อหา แถว 23 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 24 คอลัมน์ 1</td> <td>เนื้อหา แถว 24 คอลัมน์ 2</td> <td>เนื้อหา แถว 24 คอลัมน์ 3</td> <td>เนื้อหา แถว 24 คอลัมน์ 4</td> <td>เนื้อหา แถว 24 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 25 คอลัมน์ 1</td> <td>เนื้อหา แถว 25 คอลัมน์ 2</td> <td>เนื้อหา แถว 25 คอลัมน์ 3</td> <td>เนื้อหา แถว 25 คอลัมน์ 4</td> <td>เนื้อหา แถว 25 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 26 คอลัมน์ 1</td> <td>เนื้อหา แถว 26 คอลัมน์ 2</td> <td>เนื้อหา แถว 26 คอลัมน์ 3</td> <td>เนื้อหา แถว 26 คอลัมน์ 4</td> <td>เนื้อหา แถว 26 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 27 คอลัมน์ 1</td> <td>เนื้อหา แถว 27 คอลัมน์ 2</td> <td>เนื้อหา แถว 27 คอลัมน์ 3</td> <td>เนื้อหา แถว 27 คอลัมน์ 4</td> <td>เนื้อหา แถว 27 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 28 คอลัมน์ 1</td> <td>เนื้อหา แถว 28 คอลัมน์ 2</td> <td>เนื้อหา แถว 28 คอลัมน์ 3</td> <td>เนื้อหา แถว 28 คอลัมน์ 4</td> <td>เนื้อหา แถว 28 คอลัมน์ 5</td> </tr> <tr> <td>เนื้อหา แถว 29 คอลัมน์ 1</td> <td>เนื้อหา แถว 29 คอลัมน์ 2</td> <td>เนื้อหา แถว 29 คอลัมน์ 3</td> <td>เนื้อหา แถว 29 คอลัมน์ 4</td> <td>เนื้อหา แถว 29 คอลัมน์ 5</td> </tr> </tbody> </table> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.11.5/datatables.min.js"></script> <script> jQuery(document).ready(function($) { $('#tblUser').DataTable(); } ); function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('#blah').attr('src', e.target.result); } reader.readAsDataURL(input.files[0]); } } $("#data_news_img").change(function(){ readURL(this); }); </script>