How to change data on html page?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • thimmappa
    New Member
    • Sep 2010
    • 4

    How to change data on html page?

    Hi all
    i have shuffle function with me which shuffles data in an array and i am displaying the array values in a table along column wise.By an on click event the values in the table has to be shuffled and again they have to be displayed in the table.
    shuffle function code is here
    Code:
    function shuffle()
    {
    
          
    
          var randomNumber;
    
          var len=this.length-1;
    
    	  randomNumber = Math.floor(Math.random()*len);
    	 // document.write(randomNumber);
    	 
    
    	  if(randomNumber > len)
    	            {
    				randomNumber =len;
    				}
                 
    
          for(var i =0; i <= randomNumber; i++)
          {
    
                
    			
                if(i !=len)
                       {
                this[i] = this[i+1];
                         }
    		  else
    		  {
    		  temp =this[i];
    
    		  this[i]=this[0];
    
    		  this[0]=temp ;
    		  }
    
               
    
          }
    
    }
    and i have used this shuffle function as below
    Code:
    function autoSpin()
    {
    
         //var Date.monthNames = new Array('Active','Passive','Bargain','Vegas','Value');
    
        months.shuffle();
    
         var shuffleresults= Date.monthNames.join("br<>");
         var len = shuffleresults.rows.length, i;
    			if(shuffleresults.rows.length > 0) {
    				alert("hi");
    				
    				Date.monthNames[0] = shuffleresults.rows.item[0].Date.monthNames[0];
    				Date.monthNames[1] = shuffleresults.rows.item[1].Date.monthNames[1];
    				Date.monthNames[2] = shuffleresults.rows.item[2].Date.monthNames[2];
    				Date.monthNames[3] = shuffleresults.rows.item[3].Date.monthNames[3];
    				Date.monthNames[4] = shuffleresults.rows.item[4].Date.monthNames[4];
    
    				//spinnerId = shuffleresults.rows.item[0].spinnerId;
    	
    			
    			 }	
    			document.getElementById('Date.monthNames[0]').innerHTML = Date.monthNames[0];
    			document.getElementById('Date.monthNames[1]').innerHTML = Date.monthNames[1];
    			document.getElementById('Date.monthNames[2]').innerHTML = Date.monthNames[2];
    			document.getElementById('Date.monthNames[3]').innerHTML = Date.monthNames[3];
    			document.getElementById('Date.monthNames[4]').innerHTML = Date.monthNames[4];
    			
    		
          Date.dayNames.shuffle(); 
    	  //var Date.dayNames=new Array('LEAPS','Earnings','Economic','Weekly','Daily');
    
         var shuffleresults1= Date.dayNames.join("<br>");
         var len = shuffleresults1.columns.length, i;
    			if(shuffleresults1.columns.length > 0) {
    				
    				
    				Date.dayNames[0] = shuffleresults1.columns.item[0].Date.dayNames[0];
    				Date.dayNames[1] = shuffleresults1.columns.item[1].Date.dayNames[1];
    				Date.dayNames[2] = shuffleresults1.columns.item[2].Date.dayNames[2];
    				Date.dayNames[3] = shuffleresults1.columns.item[3].Date.dayNames[3];
    				Date.dayNames[4] = shuffleresults1.columns.item[4].Date.dayNames[4];
    			}
    				//spinnerId = shuffleresults1.columns.item[0].spinnerId;
    	
    			
    			
    			document.getElementById('Date.dayNames[0]').innerHTML = Date.dayNames[0];
    			document.getElementById('Date.dayNames[1]').innerHTML = Date.dayNames[1];
    			document.getElementById('Date.dayNames[2]').innerHTML = Date.dayNames[2];
    			document.getElementById('Date.dayNames[3]').innerHTML = Date.dayNames[3];
    			document.getElementById('Date.dayNames[4]').innerHTML = Date.dayNames[4];
    			
    		
          
    //var Date.yearNames=new Array('2$','1$','50 cents','25 cents','5 cents');	  
    Date.yearNames.shuffle();
    
         var shuffleresults2= Date.yearNames.join("<br>");
         var len = shuffleresults2.columns.length, i;
    			if(shuffleresults2.columns.length > 0) {
    				
    				
    				Date.yearNames[0] = shuffleresults2.columns.item[0].Date.yearNames[0];
    				Date.yearNames[1] = shuffleresults2.columns.item[1].Date.yearNames[1];
    				Date.yearNames[2] = shuffleresults2.columns.item[2].Date.yearNames[2];
    				Date.yearNames[3] = shuffleresults2.columns.item[3].Date.yearNames[3];
    				Date.yearNames[4] = shuffleresults2.columns.item[4].Date.yearNames[4];
    
    				//spinnerId = shuffleresults2.rows.item[0].spinnerId;
    	
    			
    			}			
    			document.getElementById('Date.yearNames[0]').innerHTML = Date.yearNames[0];
    			document.getElementById('Date.yearNames[1]').innerHTML = Date.yearNames[1];
    			document.getElementById('Date.yearNames[2]').innerHTML = Date.yearNames[2];
    			document.getElementById('Date.yearNames[3]').innerHTML = Date.yearNames[3];
    			document.getElementById('Date.yearNames[4]').innerHTML = Date.yearNames[4];
    			
    }
    for reference please visit the url http://www.urbanspoon. com/spin-widget
    for the spin button in that application i have used an on click event with function autoSpin() and i have defined the function above.The arrays displayed here are
    Date.monthNames ,Date.dayNames, Date.yearNames please check this one and if you find any errors please revert back to me
    Thanks in advance
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    Firstly, check the error console. What errors do you see?

    Do you have a page with the code in action?

    Comment

    • thimmappa
      New Member
      • Sep 2010
      • 4

      #3
      i have a code for single array to shuffle here it is
      Code:
      <html>
      <head>
      <title>How to shuffle an array in JavaScript</title>
      <script language="JavaScript">
      
      Array.prototype.shuffle = shuffle;
      
      function shuffle()
      {
      
            var tempSlot;
      
            var randomNumber;
      
      
            for(var i =0; i != this.length; i++)
            {
      
                  randomNumber = Math.floor(Math.random() * this.length);
                  
                  tempSlot = this[i];
      
                  this[i] = this[randomNumber];
      
                  this[randomNumber] = tempSlot;
      
      			
      
            }
      	 
      }
      
      function shuffleNumbers()
      {
      
            var numbers = new Array('Active','Passive','Bargain','Vegas','value');
      
            numbers.shuffle();
      
            var numbersAfterShuffle = numbers.join("<br>");
      
            document.getElementById("result").innerHTML = numbersAfterShuffle;
      
      
      }
      
      </script>
      </head>
      
      <body onload="javascript:shuffleNumbers();">
      
      <div id="result"></div>
      
      <input type='button' onclick='shuffleNumbers()' value='Shuffle'/>
      
      </body>
      </html>
      and i applied the same logic to all the three rows in my application.
      Last edited by acoder; Oct 14 '10, 11:57 AM.

      Comment

      Working...