ijquery

جدول

ScreenShotپلاگین ساده با قابلیت مرتب سازی

آموزش استفاده

1- فراخوانی های لازم رو انجام میدیم

<script src="TableSorter/jquery-latest.js"></script>
<script src="TableSorter/jquery.tablesorter.min.js"></script>
<link rel="stylesheet" type="text/css" href="TableSorter/themes/blue/style.css">

2-کد HTML

<table id="myTable" class="tablesorter"> 
<thead> 
<tr> 
    <th>نام خوانوادگی</th> 
    <th>نام</th> 
    <th>Email</th> 
    <th>مبلغ</th> 
    <th>وبسایت</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
    <td>پاشایی</td> 
    <td>فرهاد</td> 
    <td>jsmith@gmail.com</td> 
    <td>$50.00</td> 
    <td>http://www.jsmith.com</td> 
</tr> 
<tr> 
    <td>سعیدی</td> 
    <td>سعید</td> 
    <td>fbach@yahoo.com</td> 
    <td>$50.00</td> 
    <td>http://www.frank.com</td> 
</tr> 
<tr> 
    <td>محمد</td> 
    <td>عزیزی</td> 
    <td>jdoe@hotmail.com</td> 
    <td>$100.00</td> 
    <td>http://www.jdoe.com</td> 
</tr> 
<tr> 
    <td>سعید</td> 
    <td>محمدی</td> 
    <td>tconway@earthlink.net</td> 
    <td>$50.00</td> 
    <td>http://www.timconway.com</td> 
</tr> 
</tbody> 
</table> 
    <div>
    <div>
    <p>Jquery TableSorter <a href="http://WwW.ijquery.ir">by: WwW.ijquery.ir</a></p>
    </div>

3- Js

<script type="text/javascript">
$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
);
</script>

دلیل کمی بالا بودن حجم فایل بخاطر اینه که چند فایل تم و css و چند مثال هستش…


پیش نمایش دانلود فایل پلاگین

2 دیدگاه دربارهٔ «جدول»

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *