[ Mini Kiebo ]
Server: Windows NT DESKTOP-5B8S0D4 6.2 build 9200 (Windows 8 Professional Edition) i586
Path:
D:
/
xampp182
/
htdocs
/
simpeg
/
zapatec
/
zpgrid
/
zpgrid
/
demo
/
[
Home
]
File: custom_pagination.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <meta name="description" content=" Using the controls on the left, you can filter which rows you want to see Filter Rate Periods - Click the checkboxes to include or exclude different Rate Periods Range of Items - Show all rows whose Item column is between the minimum and maximum values. Range of Minutes - Show all rows whose Minutes column is between the minimum and maximum values. Filter Minutes - Click the Minutes checkboxes to include or exclude different Minutes Notice the difference between controls for filters vs. ranges. The filter controls allow you to display rows whose column value is selected and the range controls allow you to display rows whose column value is in the user-defined range. You can sort the rows both before and after filters. "> <meta name="keywords" content="dhtml tools,javascript,DHTML Tools,Javascript,ajax,AJAX,Ajax,ajax tools,AJAX Tools,tools controls,simple javascript tools"> <title>Zapatec DHTML Grid Widget - Phone Bill Example with Custom Pagination</title> <!-- Common JS files --> <script type='text/javascript' src='../../utils/zapatec.js'></script> <!-- Custom includes --> <script type="text/javascript" src="../src/zpgrid.js"></script> <script type="text/javascript" src="demo.js"></script> <!-- ALL demos need these css --> <link href="../../website/css/zpcal.css" rel="stylesheet" type="text/css"> <link href="../../website/css/template.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { width: 778px; } </style> <link rel="SHORTCUT ICON" href="http://www.zapatec.com/website/main/favicon.ico"> <link href="../themes/layout.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="../../zpslider/src/slider.js"></script> </head> <body> <div class='zpCalSubHeader' style='text-align:center;'>Phone Bill Example with Custom Pagination</div> <div class='leftCol'> <h3> Controls</h3> <form onsubmit="return filter(this)"><br/> <fieldset> Filter Rate Period<div id="filterOutRate"></div> </fieldset> <fieldset> <p>Range of Dates</p> <center> <div id="rangeOfDatesScale"></div> <div id="rangeOfDates" style="white-space: nowrap"></div> </center> </fieldset> <fieldset> <p>Range of Minutes</p> <center> <div id="rangeOfMinutesScale"></div> <div id="rangeOfMinutes"></div> </center> </fieldset> <fieldset> Filter Minutes<div id="filterOutMinutes"></div> </fieldset> <fieldset> <p>Find Value</p> <p><input type="checkbox" name="isRegExp"/> Use regular expression</p> <p>Search: <input type="text" name="textFilter" size="6"/> <input type="button" name="buttonText" value="Go" onclick="filter(this.form)"/></p> </fieldset> <fieldset> <p>Reset all filters</p> <input type="button" value="Reset" onclick="resetControls(this.form)"/></p> </fieldset> </form> </div> <div id="2"></div> <div id="1"></div> <div id="3"></div> <div id="4"></div> <div id="5"></div> <div id="scroll" style="margin-left : 300px;"> </div> <div class='mainCol'> This phone bill example shows a few more advanced capabilities of the Zapatec AJAX grid, including a slider for the user to control the pagination. <div class='zpCalDemoText'> <ul> <li>Using the controls on the left, you can filter which rows you want to see</li> <li>Filter Rate Periods - Click the checkboxes to include or exclude different Rate Periods </li> <li>Range of Items - Show all rows whose Item column is between the minimum and maximum values.</li> <li>Range of Minutes - Show all rows whose Minutes column is between the minimum and maximum values.</li> <li>Filter Minutes - Click the Minutes checkboxes to include or exclude different Minutes</li> <li>Notice the difference between controls for filters vs. ranges. The filter controls allow you to display rows whose column value is selected and the range controls allow you to display rows whose column value is in the user-defined range.</li> <li>You can sort the rows both before and after filters.</li> </ul> </div> <div id="gridContainer"> <table id="gridSource"> <tbody> <tr> <td width="35" class="zpGridTypeInt">Item</td> <td width="60" class="zpGridTypeDate">Date</td> <td width="46" class="zpGridTypeTime">Time</td> <td width="70">Rate Period</td> <td width="87">Phone Number</td> <td width="47" class="zpGridTypeInt">Minutes</td> <td width="80" class="zpGridTypeFloat">Total Charges</td> </tr> <tr> <td>1</td> <td>11/08/2006</td> <td>09:30AM</td> <td>P</td> <td>(911)504-7207</td> <td>1</td> <td>.50</td> </tr> <tr> <td>2</td> <td>11/08/2006</td> <td>10:39AM</td> <td>P</td> <td>(910)525-7522</td> <td>3</td> <td>1.50</td> </tr> <tr> <td>3</td> <td>11/08/2006</td> <td>12:11PM</td> <td>P</td> <td>(981)483-3140</td> <td>5</td> <td>.70</td> </tr> <tr> <td>4</td> <td>11/08/2006</td> <td>03:41PM</td> <td>P</td> <td>(910)504-8168</td> <td>2</td> <td>.20</td> </tr> <tr> <td>5</td> <td>11/09/2006</td> <td>09:50AM</td> <td>P</td> <td>(910)642-8345</td> <td>1</td> <td>.10</td> </tr> <tr> <td>6</td> <td>11/09/2006</td> <td>02:49PM</td> <td>P</td> <td>(000)000-0086</td> <td>1</td> <td>1.23</td> </tr> <tr> <td>7</td> <td>11/09/2006</td> <td>03:05PM</td> <td>P</td> <td>(910)504-8168</td> <td>6</td> <td>.40</td> </tr> <tr> <td>8</td> <td>11/09/2006</td> <td>03:53PM</td> <td>P</td> <td>(910)873-0894</td> <td>5</td> <td>2.00</td> </tr> <tr> <td>9</td> <td>11/10/2006</td> <td>11:35AM</td> <td>P</td> <td>(910)525-7522</td> <td>5</td> <td>1.00</td> </tr> <tr> <td>10</td> <td>11/10/2006</td> <td>09:41PM</td> <td>O</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>11</td> <td>11/10/2006</td> <td>09:42PM</td> <td>O</td> <td>(910)292-6349</td> <td>2</td> <td>.10</td> </tr> <tr> <td>12</td> <td>11/11/2006</td> <td>11:14AM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>13</td> <td>11/12/2006</td> <td>04:24PM</td> <td>W</td> <td>(926)485-8854</td> <td>1</td> <td>.10</td> </tr> <tr> <td>14</td> <td>11/12/2006</td> <td>04:36PM</td> <td>W</td> <td>(926)485-8854</td> <td>1</td> <td>.10</td> </tr> <tr> <td>15</td> <td>11/13/2006</td> <td>02:46PM</td> <td>W</td> <td>(910)776-3005</td> <td>1</td> <td>.10</td> </tr> <tr> <td>16</td> <td>11/14/2006</td> <td>10:45AM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>17</td> <td>11/14/2006</td> <td>11:27AM</td> <td>P</td> <td>(910)504-2167</td> <td>1</td> <td>.10</td> </tr> <tr> <td>18</td> <td>11/14/2006</td> <td>01:25PM</td> <td>P</td> <td>(910)525-7522</td> <td>4</td> <td>.10</td> </tr> <tr> <td>19</td> <td>11/14/2006</td> <td>06:41PM</td> <td>P</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>20</td> <td>11/15/2006</td> <td>01:19PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>21</td> <td>11/15/2006</td> <td>01:26PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>22</td> <td>11/15/2006</td> <td>01:27PM</td> <td>P</td> <td>(910)717-4984</td> <td>3</td> <td>.10</td> </tr> <tr> <td>23</td> <td>11/15/2006</td> <td>03:21PM</td> <td>P</td> <td>(910)504-8168</td> <td>2</td> <td>.10</td> </tr> <tr> <td>24</td> <td>11/15/2006</td> <td>04:52PM</td> <td>P</td> <td>(910)525-7522</td> <td>3</td> <td>.10</td> </tr> <tr> <td>25</td> <td>11/15/2006</td> <td>05:54PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>26</td> <td>11/15/2006</td> <td>05:55PM</td> <td>P</td> <td>(910)504-2167</td> <td>1</td> <td>.10</td> </tr> <tr> <td>27</td> <td>11/15/2006</td> <td>05:58PM</td> <td>P</td> <td>(910)527-0883</td> <td>1</td> <td>.10</td> </tr> <tr> <td>28</td> <td>11/15/2006</td> <td>05:59PM</td> <td>P</td> <td>(910)710-1325</td> <td>1</td> <td>.10</td> </tr> <tr> <td>29</td> <td>11/15/2006</td> <td>06:00PM</td> <td>P</td> <td>(910)710-1325</td> <td>2</td> <td>.10</td> </tr> <tr> <td>30</td> <td>11/16/2006</td> <td>09:41AM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>31</td> <td>11/16/2006</td> <td>10:44AM</td> <td>P</td> <td>(866)522-7941</td> <td>1</td> <td>.10</td> </tr> <tr> <td>32</td> <td>11/16/2006</td> <td>04:08PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>33</td> <td>11/16/2006</td> <td>06:49PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>34</td> <td>11/17/2006</td> <td>02:42PM</td> <td>P</td> <td>(910)525-7522</td> <td>9</td> <td>.10</td> </tr> <tr> <td>35</td> <td>11/17/2006</td> <td>02:55PM</td> <td>P</td> <td>(910)525-7522</td> <td>3</td> <td>.10</td> </tr> <tr> <td>36</td> <td>11/17/2006</td> <td>03:04PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>37</td> <td>11/17/2006</td> <td>03:17PM</td> <td>P</td> <td>(910)504-8168</td> <td>1</td> <td>.10</td> </tr> <tr> <td>38</td> <td>11/17/2006</td> <td>05:45PM</td> <td>P</td> <td>(910)776-3005</td> <td>1</td> <td>.10</td> </tr> <tr> <td>39</td> <td>11/17/2006</td> <td>05:56PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>40</td> <td>11/18/2006</td> <td>09:03AM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>41</td> <td>11/18/2006</td> <td>09:15AM</td> <td>P</td> <td>(973)785-3080</td> <td>1</td> <td>.10</td> </tr> <tr> <td>42</td> <td>11/18/2006</td> <td>09:24AM</td> <td>P</td> <td>(913)960-1457</td> <td>1</td> <td>.10</td> </tr> <tr> <td>43</td> <td>11/18/2006</td> <td>11:45AM</td> <td>P</td> <td>(925)791-2200</td> <td>9</td> <td>.10</td> </tr> <tr> <td>44</td> <td>11/18/2006</td> <td>12:12PM</td> <td>P</td> <td>(925)791-2200</td> <td>1</td> <td>.10</td> </tr> <tr> <td>45</td> <td>11/18/2006</td> <td>02:40PM</td> <td>P</td> <td>(910)717-4984</td> <td>1</td> <td>.10</td> </tr> <tr> <td>46</td> <td>11/18/2006</td> <td>03:01PM</td> <td>P</td> <td>(866)522-7941</td> <td>5</td> <td>.10</td> </tr> <tr> <td>47</td> <td>11/19/2006</td> <td>04:14PM</td> <td>W</td> <td>(910)504-7207</td> <td>3</td> <td>.10</td> </tr> <tr> <td>48</td> <td>11/20/2006</td> <td>11:31AM</td> <td>W</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>49</td> <td>11/20/2006</td> <td>11:32AM</td> <td>W</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>50</td> <td>11/20/2006</td> <td>11:35AM</td> <td>W</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>51</td> <td>11/20/2006</td> <td>11:50AM</td> <td>W</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>52</td> <td>11/20/2006</td> <td>12:11PM</td> <td>W</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>53</td> <td>11/20/2006</td> <td>12:53PM</td> <td>W</td> <td>(910)504-8168</td> <td>2</td> <td>.10</td> </tr> <tr> <td>54</td> <td>11/20/2006</td> <td>05:49PM</td> <td>W</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>55</td> <td>11/20/2006</td> <td>05:53PM</td> <td>W</td> <td>(910)504-8168</td> <td>1</td> <td>.10</td> </tr> <tr> <td>56</td> <td>11/21/2006</td> <td>12:20PM</td> <td>P</td> <td>(910)642-1714</td> <td>1</td> <td>.10</td> </tr> <tr> <td>57</td> <td>11/21/2006</td> <td>01:43PM</td> <td>P</td> <td>(910)717-4984</td> <td>2</td> <td>.10</td> </tr> <tr> <td>58</td> <td>11/21/2006</td> <td>05:46PM</td> <td>P</td> <td>(910)559-6688</td> <td>1</td> <td>.10</td> </tr> <tr> <td>59</td> <td>11/22/2006</td> <td>09:49AM</td> <td>P</td> <td>(000)000-0086</td> <td>2</td> <td>.10</td> </tr> <tr> <td>60</td> <td>11/23/2006</td> <td>12:58PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>61</td> <td>11/23/2006</td> <td>02:02PM</td> <td>P</td> <td>(866)522-7941</td> <td>1</td> <td>.10</td> </tr> <tr> <td>62</td> <td>11/23/2006</td> <td>02:22PM</td> <td>P</td> <td>(911)852-6217</td> <td>1</td> <td>.10</td> </tr> <tr> <td>63</td> <td>11/23/2006</td> <td>02:43PM</td> <td>P</td> <td>(910)776-3005</td> <td>2</td> <td>.10</td> </tr> <tr> <td>64</td> <td>11/23/2006</td> <td>02:57PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>65</td> <td>11/23/2006</td> <td>03:36PM</td> <td>P</td> <td>(866)522-7941</td> <td>3</td> <td>.10</td> </tr> <tr> <td>66</td> <td>11/23/2006</td> <td>03:45PM</td> <td>P</td> <td>(866)522-7941</td> <td>9</td> <td>.10</td> </tr> <tr> <td>67</td> <td>11/25/2006</td> <td>02:12PM</td> <td>P</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>68</td> <td>11/28/2006</td> <td>12:01PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>69</td> <td>11/28/2006</td> <td>03:26PM</td> <td>P</td> <td>(866)522-7941</td> <td>5</td> <td>.10</td> </tr> <tr> <td>70</td> <td>11/28/2006</td> <td>05:05PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>71</td> <td>11/28/2006</td> <td>06:16PM</td> <td>P</td> <td>(910)504-8168</td> <td>2</td> <td>.10</td> </tr> <tr> <td>72</td> <td>11/29/2006</td> <td>10:30AM</td> <td>P</td> <td>(911)374-9561</td> <td>5</td> <td>.10</td> </tr> <tr> <td>73</td> <td>11/29/2006</td> <td>10:42AM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>74</td> <td>11/29/2006</td> <td>04:32PM</td> <td>P</td> <td>(910)642-8345</td> <td>1</td> <td>.10</td> </tr> <tr> <td>75</td> <td>11/30/2006</td> <td>12:00PM</td> <td>P</td> <td>(930)426-3661</td> <td>1</td> <td>.10</td> </tr> <tr> <td>76</td> <td>11/30/2006</td> <td>12:07PM</td> <td>P</td> <td>(930)426-3661</td> <td>3</td> <td>.10</td> </tr> <tr> <td>77</td> <td>11/30/2006</td> <td>12:12PM</td> <td>P</td> <td>(930)587-0557</td> <td>2</td> <td>.10</td> </tr> <tr> <td>78</td> <td>11/30/2006</td> <td>02:10PM</td> <td>P</td> <td>(930)386-2557</td> <td>4</td> <td>.10</td> </tr> <tr> <td>79</td> <td>11/30/2006</td> <td>03:24PM</td> <td>P</td> <td>(910)525-7522</td> <td>2</td> <td>.10</td> </tr> <tr> <td>80</td> <td>12/01/2006</td> <td>09:52AM</td> <td>P</td> <td>(910)525-7522</td> <td>4</td> <td>.10</td> </tr> <tr> <td>81</td> <td>12/01/2006</td> <td>09:57AM</td> <td>P</td> <td>(866)522-7941</td> <td>4</td> <td>.10</td> </tr> <tr> <td>82</td> <td>12/01/2006</td> <td>11:59AM</td> <td>P</td> <td>(910)528-6402</td> <td>1</td> <td>.10</td> </tr> <tr> <td>83</td> <td>12/01/2006</td> <td>12:00PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>84</td> <td>12/01/2006</td> <td>12:03PM</td> <td>P</td> <td>(910)528-6402</td> <td>1</td> <td>.10</td> </tr> <tr> <td>85</td> <td>12/01/2006</td> <td>12:51PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>86</td> <td>12/01/2006</td> <td>03:11PM</td> <td>P</td> <td>(866)522-7941</td> <td>2</td> <td>.10</td> </tr> <tr> <td>87</td> <td>12/01/2006</td> <td>05:08PM</td> <td>P</td> <td>(866)522-7941</td> <td>2</td> <td>.10</td> </tr> <tr> <td>88</td> <td>12/02/2006</td> <td>09:49AM</td> <td>P</td> <td>(910)504-7204</td> <td>1</td> <td>.10</td> </tr> <tr> <td>89</td> <td>12/02/2006</td> <td>09:49AM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>90</td> <td>12/02/2006</td> <td>10:15AM</td> <td>P</td> <td>(910)525-7522</td> <td>3</td> <td>.10</td> </tr> <tr> <td>91</td> <td>12/02/2006</td> <td>02:02PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>92</td> <td>12/02/2006</td> <td>02:19PM</td> <td>P</td> <td>(910)504-2167</td> <td>1</td> <td>.10</td> </tr> <tr> <td>93</td> <td>12/02/2006</td> <td>03:43PM</td> <td>P</td> <td>(934)846-5561</td> <td>4</td> <td>.10</td> </tr> <tr> <td>94</td> <td>12/02/2006</td> <td>04:46PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>95</td> <td>12/02/2006</td> <td>05:06PM</td> <td>P</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>96</td> <td>12/02/2006</td> <td>05:07PM</td> <td>P</td> <td>(910)710-1325</td> <td>3</td> <td>.10</td> </tr> <tr> <td>97</td> <td>12/02/2006</td> <td>06:04PM</td> <td>P</td> <td>(910)710-1325</td> <td>2</td> <td>.10</td> </tr> <tr> <td>98</td> <td>12/02/2006</td> <td>06:06PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>99</td> <td>12/02/2006</td> <td>06:10PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>100</td> <td>12/02/2006</td> <td>06:16PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>101</td> <td>12/02/2006</td> <td>06:30PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>102</td> <td>12/02/2006</td> <td>06:32PM</td> <td>P</td> <td>(910)220-0883</td> <td>2</td> <td>.10</td> </tr> <tr> <td>103</td> <td>12/02/2006</td> <td>06:37PM</td> <td>P</td> <td>(910)220-0883</td> <td>1</td> <td>.10</td> </tr> <tr> <td>104</td> <td>12/02/2006</td> <td>06:40PM</td> <td>P</td> <td>(930)400-2929</td> <td>2</td> <td>.10</td> </tr> <tr> <td>105</td> <td>12/02/2006</td> <td>06:45PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>106</td> <td>12/02/2006</td> <td>07:10PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>107</td> <td>12/02/2006</td> <td>07:15PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>108</td> <td>12/02/2006</td> <td>07:18PM</td> <td>P</td> <td>(930)400-2929</td> <td>1</td> <td>.10</td> </tr> <tr> <td>109</td> <td>12/02/2006</td> <td>07:20PM</td> <td>P</td> <td>(910)220-0883</td> <td>2</td> <td>.10</td> </tr> <tr> <td>110</td> <td>12/02/2006</td> <td>07:24PM</td> <td>P</td> <td>(930)400-2929</td> <td>3</td> <td>.10</td> </tr> <tr> <td>111</td> <td>12/02/2006</td> <td>07:40PM</td> <td>P</td> <td>(930)400-2929</td> <td>1</td> <td>.10</td> </tr> <tr> <td>112</td> <td>12/02/2006</td> <td>07:47PM</td> <td>P</td> <td>(930)400-2929</td> <td>2</td> <td>.10</td> </tr> <tr> <td>113</td> <td>12/03/2006</td> <td>09:12AM</td> <td>W</td> <td>(910)710-1325</td> <td>3</td> <td>.10</td> </tr> <tr> <td>114</td> <td>12/03/2006</td> <td>09:29AM</td> <td>W</td> <td>(930)400-2929</td> <td>1</td> <td>.10</td> </tr> <tr> <td>115</td> <td>12/03/2006</td> <td>12:25PM</td> <td>W</td> <td>(910)504-2167</td> <td>1</td> <td>.10</td> </tr> <tr> <td>116</td> <td>12/03/2006</td> <td>01:06PM</td> <td>W</td> <td>(910)504-2167</td> <td>1</td> <td>.10</td> </tr> <tr> <td>117</td> <td>12/03/2006</td> <td>01:33PM</td> <td>W</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>118</td> <td>12/03/2006</td> <td>04:06PM</td> <td>W</td> <td>(930)400-2929</td> <td>2</td> <td>.10</td> </tr> <tr> <td>119</td> <td>12/03/2006</td> <td>04:08PM</td> <td>W</td> <td>(910)710-1325</td> <td>1</td> <td>.10</td> </tr> <tr> <td>120</td> <td>12/03/2006</td> <td>04:11PM</td> <td>W</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>121</td> <td>12/03/2006</td> <td>04:21PM</td> <td>W</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>122</td> <td>12/03/2006</td> <td>04:22PM</td> <td>W</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>123</td> <td>12/03/2006</td> <td>04:22PM</td> <td>W</td> <td>(930)386-2628</td> <td>1</td> <td>.10</td> </tr> <tr> <td>124</td> <td>12/03/2006</td> <td>04:23PM</td> <td>W</td> <td>(930)386-2628</td> <td>1</td> <td>.10</td> </tr> <tr> <td>125</td> <td>12/03/2006</td> <td>04:55PM</td> <td>W</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>126</td> <td>12/03/2006</td> <td>05:06PM</td> <td>W</td> <td>(930)386-2628</td> <td>2</td> <td>.10</td> </tr> <tr> <td>127</td> <td>12/03/2006</td> <td>06:15PM</td> <td>W</td> <td>(930)386-2628</td> <td>2</td> <td>.10</td> </tr> <tr> <td>128</td> <td>12/03/2006</td> <td>06:21PM</td> <td>W</td> <td>(930)386-2628</td> <td>3</td> <td>.10</td> </tr> <tr> <td>129</td> <td>12/04/2006</td> <td>11:36AM</td> <td>W</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>130</td> <td>12/04/2006</td> <td>01:20PM</td> <td>W</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>131</td> <td>12/05/2006</td> <td>12:10PM</td> <td>P</td> <td>(866)522-7941</td> <td>4</td> <td>.10</td> </tr> <tr> <td>132</td> <td>12/05/2006</td> <td>12:47PM</td> <td>P</td> <td>(910)504-7207</td> <td>1</td> <td>.10</td> </tr> <tr> <td>133</td> <td>12/05/2006</td> <td>02:09PM</td> <td>P</td> <td>(910)525-7522</td> <td>5</td> <td>.10</td> </tr> <tr> <td>134</td> <td>12/05/2006</td> <td>02:11PM</td> <td>P</td> <td>(910)504-7207</td> <td>2</td> <td>.10</td> </tr> <tr> <td>135</td> <td>12/06/2006</td> <td>04:45PM</td> <td>P</td> <td>(910)504-8168</td> <td>6</td> <td>.10</td> </tr> <tr> <td>136</td> <td>12/06/2006</td> <td>06:48PM</td> <td>P</td> <td>(000)000-0086</td> <td>1</td> <td>.10</td> </tr> <tr> <td>137</td> <td>12/06/2006</td> <td>06:49PM</td> <td>P</td> <td>(910)504-8168</td> <td>2</td> <td>.10</td> </tr> <tr> <td>138</td> <td>12/06/2006</td> <td>06:50PM</td> <td>P</td> <td>(910)525-7522</td> <td>1</td> <td>.10</td> </tr> <tr> <td>139</td> <td>12/07/2006</td> <td>05:53PM</td> <td>P</td> <td>(910)527-4777</td> <td>2</td> <td>.10</td> </tr> </tbody> </table> </div> <table> <tr> <td><div id="gridPaginationSlider"></div></td> <td><div id="gridPagination" style="width: 290px; text-align: right; font: 11px Tahoma, Arial, sans-serif"></div></td> </tr> </table> </div> <script type="text/javascript"> /* * Initialize the grid */ var objGrid = new Zapatec.Grid({ // Use HTML table with id "gridSource" as grid data source source: 'gridSource', sourceType: 'html', // Use "winxp" theme theme: 'winxp', // Put the grid into element with id "gridContainer" container: 'gridContainer', // Use custom function to display pagination callbackPaginationDisplay: funcPagination, // Initially sort ascending by first column sortColumn: 0, // Display 10 rows per page rowsPerPage: 10, // Display filter out forms filterOut: [ // Filter Rate Period { // Use column number 3 (first column number is 0) column: 3, // Put checkboxes into element with id "filterOutRate" container: 'filterOutRate', // This will press "Filter" button for you if you changed range of items // or minutes and forgot to press it onclick: 'filter(this.form)' }, // Filter Minutes { // Use column number 5 (first column number is 0) column: 5, // Sort descending sortDesc: true, // Put checkboxes into element with id "filterOutMinutes" container: 'filterOutMinutes', // This will press "Filter" button for you if you changed range of items // or minutes and forgot to press it onclick: 'filter(this.form)' } ], // Event listeners eventListeners: { 'gridInitialized': onGridInit, 'gridModified': onGridInit, 'gridMovedColumn': onGridMovedColumn } }); /* * Pagination slider. */ var oPaginationSlider; /* * Prints current page number and draws pagination slider. */ function funcPagination(oGrid) { // Get number of pages var iPages = oGrid.totalPages(); // Gat current page var iCurrentPage = oGrid.getCurrentPageNumber(); // Print current page number document.getElementById('gridPagination').innerHTML = 'Page <b>' + iCurrentPage + '</b> of <b>' + iPages + '</b> (' + oGrid.filteredRows.length + ' rows)'; // Reset slider if (oPaginationSlider) { // Need to reset slider only after filtering or searching if (iCurrentPage == 1) { oPaginationSlider.setPos(0); oPaginationSlider.setRange(0, iPages - 1); } } else { // Initialize slider oPaginationSlider = new Zapatec.Slider({ div: 'gridPaginationSlider', length: 99, orientation: 'H', step: 1, range: [0, iPages - 1], newPosition: function(iValue) { oGrid.gotoPage(Math.ceil(iValue)); } }); } }; </script> <noscript> <br/> This page uses an <a href='http://www.zapatec.com/website/main/products/suite/'> AJAX Component</a> - Zapatec DHTML Grid Widget, but your browser does not support Javascript. <br/> <br/> </noscript> <br/><br/><br/> <div class="footer" style='width: 778px; text-align:center; margin-top:2em'> © 2004-2007 <strong> <a href='http://www.zapatec.com/'>Zapatec, Inc.</a> </strong> </div> </body> </html>