JavaScript Tutorial/Dojo toolkit/DateTextBox

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

DateTextBox prompts invalid message

<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.ValidationTextBox");    
      dojo.require("dijit.form.ruboBox");     
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("dijit.form.DateTextBox");      
      dojo.require("dijit.Editor");
    </script>
  </head>
  <body class="tundra">
      <label for="serviceDate">Service Date:</label> 
      <input type="text" id="serviceDate" name="serviceDate" size="10"
        dojoType="dijit.form.DateTextBox"
        required="true"       
        promptMessage="Enter service date."
        invalidMessage="Invalid date." 
        constraints="{min:"2008-03-16"}"
      />
</body>
</html>


Declare dijit.form.DateTextBox

<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.DateTextBox");
    </script>
  </head>
  <body class="tundra">
        <input type="textbox" dojoType="dijit.form.DateTextBox">
  </body>
</html>


Define date pattern for dijit.form.DateTextBox

<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.DateTextBox");
         
    </script>
  </head>
  <body class="tundra">
     <input constraints="{datePattern:"MMM dd, yyyy"}" dojoType="dijit.form.DateTextBox">
      
</body>
</html>


Min,max, date pattern for DateTextBox

<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.DateTextBox");
         
    </script>
  </head>
  <body class="tundra">
    <input constraints="{min:"2007-12", max:"2008-06", datePattern:"MMM dd, yyyy"}" dojoType="dijit.form.DateTextBox">
     
</body>
</html>


Set constraints for dijit.form.DateTextBox

<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.ValidationTextBox");    
      dojo.require("dijit.form.ruboBox");     
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("dijit.form.DateTextBox");      
      dojo.require("dijit.Editor");
    </script>
  </head>
  <body class="tundra">
      <label for="serviceDate">Service Date:</label> 
      <input type="text" id="serviceDate" name="serviceDate" size="10"
        dojoType="dijit.form.DateTextBox"
        required="true"       
        promptMessage="Enter service date."
        invalidMessage="Invalid date." 
        constraints="{min:"2008-03-16"}"
      />
</body>
</html>


Set up dijit.form.DateTextBox

<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.DateTextBox");
      function myFunc() {
        var myDijit = new dijit.form.DateTextBox({
          value : new Date()
        });
        dojo.byId("my").appendChild(myDijit.domNode);
      }
    </script>
  </head>
  <body class="tundra" onLoad="myFunc();">
      <div id="my">&nbsp;</div>
  </body>
</html>
Источник — «http://wbex.ru/index.php?title=JavaScript_Tutorial/Dojo_toolkit/DateTextBox&oldid=8579»