JavaScript DHTML/Dojo toolkit/CheckBox

Материал из Web эксперт
Перейти к: навигация, поиск

CheckBox checked state

 
<html>
  <head>
    <title></title>
    <link rel="StyleSheet" type="text/css" href="js/dojo/dojo/resources/dojo.css">
    <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true,
        extraLocale: ["en-us"]
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script language="JavaScript" type="text/javascript">
      dojo.require("dojo.parser");
           dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
<input id="cb" dojotype="dijit.form.CheckBox" name="developer" 
                           checked="checked" value="on" type="checkbox" />
    <label for="cb"> Are you a Developer </label> 
  </body>
</html>



CheckBox onclick event

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
            dojo.require("dijit.form.Button");
            dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <div name="confirmation" dojoType="dijit.form.CheckBox">
        <script type="dojo/method" event="onClick" args="evt">
          if (this.checked)
            dijit.byId("signup").setAttribute("disabled", false);
          else
            dijit.byId("signup").setAttribute("disabled", true);
        </script>
    </div>Text.<br>
    <button id="signup" disabled dojoType="dijit.form.Button" type="submit">Button</button>
     
</body>
</html>



CheckBox preset value

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css"
      href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
      dojo.require("dojo.parser");
      dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <input id="cb" dojotype="dijit.form.CheckBox" name="developer" checked="checked" value="on" type="checkbox" />
    <label for="cb">value</label> 
    
  </body>
</html>



dojo check box creation

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css"
      href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
      dojo.require("dojo.parser");
      dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
        <input type="checkbox" id="cb1" dojoType="dijit.form.CheckBox"/>&nbsp;
        <label for="cb1">Check me</label>
  </body>
</html>



Get check box value

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
            dojo.require("dijit.form.ToggleButton");
            dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <button dojoType="dijit.form.ToggleButton">asdf
     <script type="dojo/method" event="onChange" args="newValue">
       alert(dijit.byId("foo").getValue());
     </script>
    </button>
    <input id="foo" dojoType="dijit.form.CheckBox"></input>
     
</body>
</html>



Is checkbox checked

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
            dojo.require("dijit.form.ToggleButton");
            dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <button dojoType="dijit.form.ToggleButton">asdf
     <script type="dojo/method" event="onChange" args="newValue">
       alert(dijit.byId("foo").checked);
     </script>
    </button>
    <input id="foo" dojoType="dijit.form.CheckBox"></input>
     
</body>
</html>



Precheck checkbox

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css"
      href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
      dojo.require("dojo.parser");
      dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <input id="cb" dojotype="dijit.form.CheckBox" name="developer" checked="checked" value="on" type="checkbox" />
    <label for="cb">value</label> 
    
  </body>
</html>



Set checkbox value

 
<html>
  <head>
    <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
            dojo.require("dijit.form.ToggleButton");
            dojo.require("dijit.form.CheckBox");
    </script>
  </head>
  <body class="tundra">
    <button dojoType="dijit.form.ToggleButton">asdf
     <script type="dojo/method" event="onChange" args="newValue">
       alert(dijit.byId("foo").setValue(true));
     </script>
    </button>
    <input id="foo" dojoType="dijit.form.CheckBox"></input>
     
</body>
</html>