Calendar Control - Multi-Select 2-up Implementation : Calendar : GUI Components JAVASCRIPT DHTML TUTORIALS


JAVASCRIPT DHTML TUTORIALS » GUI Components » Calendar »

 

Calendar Control - Multi-Select 2-up Implementation




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

  <title>Yahoo! Calendar Control - Multi-Select 2-up Implementation</title>
  

  <link rel="stylesheet" href="./examples/calendar/css/examples.css" type="text/css">
  
  <script type="text/javascript" src="./build/yahoo/yahoo.js"></script>
  <script type="text/javascript" src="./build/event/event.js" ></script>
  <script type="text/javascript" src="./build/dom/dom.js" ></script>
  
  <link type="text/css" rel="stylesheet" href="./build/fonts/fonts.css">
  <link type="text/css" rel="stylesheet" href="./build/reset/reset.css">  

  <link rel="stylesheet" type="text/css" href="./docs/assets/dpSyntaxHighlighter.css" />

  <script type="text/javascript" src="./build/calendar/calendar.js"></script>
  <link type="text/css" rel="stylesheet" href="./build/calendar/assets/calendar.css">  

  <script language="javascript">
    YAHOO.namespace("example.calendar");

    function init() {
      YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar2up("YAHOO.example.calendar.cal1","cal1Container");

      var customConfig = function() {
        this.Options.MULTI_SELECT = true;
      }
      
      YAHOO.example.calendar.cal1.setChildFunction("customConfig", customConfig);
      YAHOO.example.calendar.cal1.callChildFunction("customConfig");

      YAHOO.example.calendar.cal1.render();
    }

    YAHOO.util.Event.addListener(window, "load", init);
  </script>

  

</head>

<body>
  <img id="logo" src="../img/logo.gif"/>
  
  <div id="pageTitle">
    <h3>Calendar Control</h3>
  </div>

  <div class="column left">
    <h4>Multi-Select 2-up Implementation</h4>

    <p>To allow for multiple selections on a 2-up Calendar, use the following code:</p>
    <textarea name="code" class="JScript" cols="60" rows="1">
    var cal1;
    function init() {
      cal1 = new YAHOO.widget.Calendar2up("cal1","cal1Container");

      var customConfig = function() {
        this.Options.MULTI_SELECT = true;
      }
      
      cal1.setChildFunction("customConfig", customConfig);
      cal1.callChildFunction("customConfig");

      cal1.render();
    }
    </textarea>

    <textarea name="code" class="HTML" cols="60" rows="1"><div id="cal1Container"></div></textarea>

  </div>
  
  <div id="cal1Container" style="position:absolute;left:50px;top:400px"></div>

</body>

<script src="./docs/assets/dpSyntaxHighlighter.js"></script>
<script language="javascript"
dp.SyntaxHighlighter.HighlightAll('code'); 
</script>

</html>
           
       

Download : Download nav_yui.zip nav_yui.zip


-

Leave a Comment / Note


 
Verification is used to prevent unwanted posts (spam). .

Follow Navioo On Twitter

JAVASCRIPT DHTML TUTORIALS

 Navioo GUI Components
» Calendar