www.webdeveloper.com
Results 1 to 4 of 4

Thread: select option and keep desabled

  1. #1
    Join Date
    May 2014
    Posts
    6

    select option and keep desabled

    Hello every body,

    when i select some options, i want to keep it disabled after submit and after refresh/return on the page.

    I write this code:

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>Checkbox answer</title>
    
    <script>
    	function checks()
    	
    	{
    			var i;
    			
    		   var select = document.getElementById("sel");
       		   options = select.getElementsByTagName("option");
      		   values  = [];
      		 
    			
        for (i=0; i<options.length; i++)
         {
            if (options[i].selected) 
           { 
           		 
           		values.push(options[i].value);
           		localStorage.setItem("values", values);
           			if (localStorage.getItem("values")) 
    			{
       				 select.options[localStorage.getItem("values")].disabled = true;
    			}​
    		
           		
            
            }
        }
     	
       
      	 	
        }
       
      		             
    	
    	
    </script>
    </head>
    <body>
    
    <form action= # onsubmit="return checks()">
    
    <select name="seating position" id= "sel" multiple >
      <option value="1" >seat1</option>
     <option value="2">seat2</option>
     <option value="3">seat3</option>
     <option value="4">seat4</option>
    <option value="5">seat5</option>
    <option value="6">seat6</option>
    <option value="7">seat7</option>
    <option value="8">seat8</option>
    <option value="9">seat9</option>
    <option value="10">seat10</option>
    </select>
    <input type="submit" value = "OK">
    </form>
    
    
    
    </body>
    </html>
    What is wrong? Thank you

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,438

    Lightbulb

    See if you can modify this to your needs...

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>Checkbox answer</title>
    </head>
    <body>
    
    <form action='#' onsubmit="saveChecks();return false">
    
    <select name="seating_position" id="sel" multiple >
      <option value="1">seat1</option>
      <option value="2">seat2</option>
      <option value="3">seat3</option>
      <option value="4">seat4</option>
      <option value="5">seat5</option>
      <option value="6">seat6</option>
      <option value="7">seat7</option>
      <option value="8">seat8</option>
      <option value="9">seat9</option>
      <option value="10">seat10</option>
    </select>
    <input type="submit" value="OK">
    </form>
    
    <script>
    var values = [];
    function saveChecks() {
      var select = document.getElementById("sel");
      options = select.getElementsByTagName("option");
      values  = [];
      for (var i=0; i<options.length; i++) {
        if (options[i].selected) { values.push(options[i].value); } else { values.push(''); }
      }
      localStorage.setItem("LSvalues", values.join(','));
      alert('Checked values: '+values.join(','));  // this line for testing purposes only
    }
    function restoreChecks(info) {
      values = info.split(',');
      var select = document.getElementById("sel");
      options = select.getElementsByTagName("option");
      for (var i=0; i<values.length; i++) {
        if (values[i] != '') { options[i].selected = true; }
      }
    }
    
    window.onload = function() {
      var tmp = localStorage.getItem('LSvalues');
      if (tmp != null) { restoreChecks(tmp); }
                  else { alert('No stored values'); }  // can remove line if not needed
    }
    </script>
    </body>
    </html>

  3. #3
    Uhm... if it's going to be disabled and stay disabled, why are you wasting bandwidth even sending it with the page from that point on?

  4. #4
    Join Date
    May 2014
    Posts
    10
    It is doing some problem during disable the function.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles