Search jQuery

jQuery Forum

Screen name:
takehiko_power

takehiko_power's Profile

2 Posts

2 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

Problem to combine filter + pagination
[1Reply]
- 04-May-2011 04:31 AM
- Forum: Getting Started
Hello, i need combine this example , and this... Is posible?
I need a filter + pagination - for example in this web www.vecteezy.com or mootools.net/forge/browse
I need help please!
my example not work...
Thanks!

I need help, Quicksand multiple filter - Help me please.
[0Replies]
- 18-Apr-2011 09:51 AM
- Forum: Using jQuery Plugins
Hello i need add one filter in this example...

For download here

a js quicksan ok download here

Im add a filter "delta" but, not work.. :(
2. <script type="text/javascript">
3. // DOMContentLoaded
4. $(function() {
5. // bind dropdowns in the form
6. var $filterAlpha = $('#filter select[name="alpha"]');
7. var $filterBeta = $('#filter select[name="beta"]');
8. var $filterGamma = $('#filter select[name="gamma"]');
9. var $filterDelta = $('#filter select[name="delta"]');
11. // get the first collection
12. var $applications = $('#applications');
14. // clone applications to get a second collection
15. var $data = $applications.clone();
17. // attempt to call Quicksand on every form change
18. $('select').change(
19. function() {
20. $(this).addClass('animate');
21. if ($($filterAlpha).val() == '0'){
22. if ($($filterBeta).val() == '0'){
23. if ($($filterGamma).val() == '0'){
24. if ($($filterDelta).val() == '0'){
27. //0-0-0
28. var $filteredData = $data.find('div');
29. } else {
30. //0-0-1
31. var $filteredData = $data.find('div[data-gamma=' + $($filterGamma).val() + ']' );
32. }
33. } else {
34. if ($($filterGamma).val() == '0'){
35. //0-1-0
36. var $filteredData = $data.find('div[data-beta=' + $($filterBeta).val() + ']' );
37. } else {
38. //0-1-1
39. var $filteredData = $data.find('div[data-beta=' + $($filterBeta).val() + ']' + 'div[data-gamma=' + $($filterGamma).val() + ']');
40. }
41. }
42. } else {
43. if ($($filterBeta).val() == '0'){
44. if ($($filterGamma).val() == '0'){
45. //1-0-0
46. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' );
47. } else {
48. //1-0-1
49. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-gamma=' + $($filterGamma).val() + ']');
50. }
51. } else {
52. if ($($filterGamma).val() == '0'){
53. //1-1-0
54. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-beta=' + $($filterBeta).val() + ']');
55. } else {
56. //1-1-1
57. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-beta=' + $($filterBeta).val() + ']' + 'div[data-gamma=' + $($filterGamma).val() + ']');
58. }
62. }
63. }
68. } else {
69. if ($($filterAlpha).val() == '0'){
70. if ($($filterBeta).val() == '0'){
71. if ($($filterGamma).val() == '0'){
72. //1-0-0-0
73. var $filteredData = $data.find('div[data-delta=' + $($filterdelta).val() + ']' );
74. } else {
75. //1-0-1
76. //1-0-0-1
77. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-delta=' + $($filterdelta).val() + ']');
78. }
79. } else {
80. if ($($filterGamma).val() == '0'){
81. //1-1-0
82. //1-0-1-0
83. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-gamma=' + $($filterGamma).val() + ']');
85. } else {
86. //1-1-1
87. //1-0-1-1
88. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-gamma=' + $($filtergamma).val() + ']' + 'div[data-delta=' + $($filterdelta).val() + ']');
89. }
90. }
92. } else {
94. //1-0-1-1
95. //1-1-1-0
96. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-beta=' + $($filterbeta).val() + ']' + 'div[data-gamma=' + $($filtergamma).val() + ']');
98. }
99. }
102. } else {
104. //1-1-1-0
105. //1-1-1-1
106. var $filteredData = $data.find('div[data-alpha=' + $($filterAlpha).val() + ']' + 'div[data-beta=' + $($filterbeta).val() + ']' + 'div[data-gamma=' + $($filtergamma).val() + ']'+ 'div[data-delta=' + $($filterdelta).val() + ']');
108. }
110. }
112. // finally, call quicksand
113. $applications.quicksand($filteredData, {
114. duration: 1000,
115. easing: 'easeInOutQuad',
116. adjustHeight: 'auto'
117. });
119. });
121. </script>
1. orm id="filter">
        <select name="alpha">
           <option value="0">All items</option>
           <option value="1">Pepper</option>
           <option value="2">Apple</option>
        </select>
        <select name="beta">
           <option value="0">All colours</option>
           <option value="1">Red</option>
           <option value="2">Green</option>
        </select>
        <select name="gamma">
           <option value="0">All places</option>
           <option value="1">Couche</option>
           <option value="2">Table</option>
        </select>
     <select name="delta">
           <option value="0">All places</option>
           <option value="1">Black</option>
           <option value="2">White</option>
        </select>
  </form>
Is posible add a one filter???..
and pagination?

Please Help!

Thanks!!

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend