Commits

Anonymous committed c1a0162 Draft

-limit max search result = 20 pages. [follow amazon]
-pressing enter to search for product working now

Comments (0)

Files changed (2)

build/web/index.html

                 </div>
 
                 <!-- div for displaying of page numberings -->
-                <div class ="pagination" id="productPagination"> 
+                <div class ="pagination pagination-centered" id="productPagination"> 
 
                 </div>
 
                 if(ifFieldValid == false)
                     return;
                 
-                
                 var searchKeyword = $('#productSearchKey').val();
                 
                 //deciding which restful api to use depending on search keyword
                             {
                                 // On success, 'data' contains a list of products.
                                 $.each(data, function (key, val) {
-                            
-                                
                                     displayProductInfo(val,totalProductFound);
                                     totalProductFound++;
                                 });
                             }
-                            else
+                            else //only one search result
                             {
-   
                                 displayProductInfo(data,totalProductFound);
                                 totalProductFound++;
-                           
                             }
                         }
                     }
                     //creating the main list
                     var mainUl = document.createElement("ul");
                 
-                    //creating sub list for all the page numbers / prev / next buttons
+                    //adding the "Prev" button
                     var subUl = document.createElement("li");
                     subUl.className ="prev disabled"
                     subUl.innerHTML ="<a href=\"#\" onClick=\"showPage(-1)\">Prev</a>";
                     mainUl.appendChild(subUl);
-                    //for(var i =1;i<=number;i++)
-                    for(var x=1;x<=Math.ceil(totalElement/2);x++)
+                    
+                  
+                    
+                    //limit the search result to only 20 pages. [Just like amazon]
+                    // for(var x=1;x<=Math.ceil(totalElement/2);x++)
+                    for(var x=1;x<=20;x++)
                     {
-                   
                         var subUl = document.createElement("li");
                         subUl.className =x;
                         if(x==1)
                             subUl.className = subUl.className +" active";
                         subUl.innerHTML ="<a href=\"#\" onClick=\"showPage("+x+")\">"+x+"</a>";
-                        // subUl.onclick = showPage(subUl.innerHTML);
-                        //subUl.on("click",showPage(subUl.innerHTML));
                         mainUl.appendChild(subUl);
                     }
+                    
+                    //Adding the next button
                     var subUl = document.createElement("li");
                     subUl.innerHTML ="<a href=\"#\" onClick=\"showPage(0)\">Next</a>";
                     subUl.className = "next";
                     mainUl.appendChild(subUl);
-                
+                    
                     var test = document.getElementById("productPagination");
                     test.appendChild(mainUl);
                 }
             
             function loadItemFromCookie(productId,productQty,productName,productEach,productTotal)
             {
-                // var productName = $('#div_'+productId).find('#productTitle').text();
-                // var productPrice = $('#div_'+productId).find('#productPrice').text();
-                // var qtySelected = $('#div_'+productId).find('#qty_'+productId).val();
-                  
-                // var totalPrice = qtySelected * productPrice;
-                
+               
                 var tableDetailHeader ="<tr>";
                 var tableProductTitle ="<td class=\""+productId+"\" id=\"productId\">"+productName+"</td>";
                 var tableQty = "<td id=\"productQty\">"+productQty+"</td>";
                     }
                 } 
                      
-                
-                
                 var payBtn = $("#PayBtn");
                 var clearFormBtn = $("#clearFormBtn");
 		
                   
                 });
 		
-		
-		
                 //hide the payment at the start
                 divPayment.hide();
 		
                 </div>
 
                 <!-- div for displaying of page numberings -->
-                <div class ="pagination" id="productPagination"> 
+                <div class ="pagination pagination-centered" id="productPagination"> 
 
                 </div>
 
                 if(ifFieldValid == false)
                     return;
                 
-                
                 var searchKeyword = $('#productSearchKey').val();
                 
                 //deciding which restful api to use depending on search keyword
                             {
                                 // On success, 'data' contains a list of products.
                                 $.each(data, function (key, val) {
-                            
-                                
                                     displayProductInfo(val,totalProductFound);
                                     totalProductFound++;
                                 });
                             }
-                            else
+                            else //only one search result
                             {
-   
                                 displayProductInfo(data,totalProductFound);
                                 totalProductFound++;
-                           
                             }
                         }
                     }
                     //creating the main list
                     var mainUl = document.createElement("ul");
                 
-                    //creating sub list for all the page numbers / prev / next buttons
+                    //adding the "Prev" button
                     var subUl = document.createElement("li");
                     subUl.className ="prev disabled"
                     subUl.innerHTML ="<a href=\"#\" onClick=\"showPage(-1)\">Prev</a>";
                     mainUl.appendChild(subUl);
-                    //for(var i =1;i<=number;i++)
-                    for(var x=1;x<=Math.ceil(totalElement/2);x++)
+                    
+                  
+                    
+                    //limit the search result to only 20 pages. [Just like amazon]
+                    // for(var x=1;x<=Math.ceil(totalElement/2);x++)
+                    for(var x=1;x<=20;x++)
                     {
-                   
                         var subUl = document.createElement("li");
                         subUl.className =x;
                         if(x==1)
                             subUl.className = subUl.className +" active";
                         subUl.innerHTML ="<a href=\"#\" onClick=\"showPage("+x+")\">"+x+"</a>";
-                        // subUl.onclick = showPage(subUl.innerHTML);
-                        //subUl.on("click",showPage(subUl.innerHTML));
                         mainUl.appendChild(subUl);
                     }
+                    
+                    //Adding the next button
                     var subUl = document.createElement("li");
                     subUl.innerHTML ="<a href=\"#\" onClick=\"showPage(0)\">Next</a>";
                     subUl.className = "next";
                     mainUl.appendChild(subUl);
-                
+                    
                     var test = document.getElementById("productPagination");
                     test.appendChild(mainUl);
                 }
             
             function loadItemFromCookie(productId,productQty,productName,productEach,productTotal)
             {
-                // var productName = $('#div_'+productId).find('#productTitle').text();
-                // var productPrice = $('#div_'+productId).find('#productPrice').text();
-                // var qtySelected = $('#div_'+productId).find('#qty_'+productId).val();
-                  
-                // var totalPrice = qtySelected * productPrice;
-                
+               
                 var tableDetailHeader ="<tr>";
                 var tableProductTitle ="<td class=\""+productId+"\" id=\"productId\">"+productName+"</td>";
                 var tableQty = "<td id=\"productQty\">"+productQty+"</td>";
                     }
                 } 
                      
-                
-                
                 var payBtn = $("#PayBtn");
                 var clearFormBtn = $("#clearFormBtn");
 		
                   
                 });
 		
-		
-		
                 //hide the payment at the start
                 divPayment.hide();