Hi gurus,

I am a bit confused here.

I have been trying to follow this thread:

http://forum.jquery.com/topic/jquery-ui-datepicker-validation-plugin

and the solution provided by kwood here:

http://jsfiddle.net/TJA4f/

When I play around with that solution, it works fine.

However, when I try to model my actual code after it, it doesn't do anything.

No errors but no validations.

For instance, my version of the code validates both individual dates and date ranges.

However, it doesn't work for me.

What am I doing wrong?

Below is what I have so far and thanks for your help.

1.   <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css" type="text/css" />
     <link rel="stylesheet" href="Styles/template.css" type="text/css" />
     <script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.js"></script>
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
     <script src="scripts/jquery.datepicker.js" type="text/javascript"></script>
     <script type="text/javascript" src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
     <link rel="stylesheet" href="/resources/demos/style.css" />
     <link href="Styles/buttonFormats.css" rel="stylesheet" type="text/css" />
     <link href="Styles/boxFormats.css" rel="stylesheet" type="text/css" />
     <link rel="stylesheet" type="text/css" href="docsupport/prism.css" />
     <link rel="stylesheet" type="text/css" href="chosen.css" />
     <link type="text/css" rel="stylesheet" href="http://jquery/theme/contrast.css" />
     <script type="text/javascript" src="http://mod_swmenufree/transmenu_Packed.js"></script>
     <script type='text/javascript' src='js/jquery.html5-placeholder-shim.js'></script>
2.   <script type="text/javascript" src="http://keith-wood.name/js/jquery.validate.js"></script>
     <script type="text/javascript" src="http://keith-wood.name/js/jquery.ui.datepicker.validation.js"></script>
3. <script type='text/javascript'>//<![CDATA[
   var VanillaRunOnDomReady = function() {
   $('#txtFromDate').datepicker({});
4.             $('#form1').validate({
                   errorPlacement: $.datepicker.errorPlacement,
                   rules: {
                       txtFromDate: {
                           required: true,
                           dpDate: true
                       }
                   }
               });
   }
5. var alreadyrunflag = 0;
6. if (document.addEventListener)
       document.addEventListener("DOMContentLoaded", function(){
           alreadyrunflag=1;
           VanillaRunOnDomReady();
       }, false);
   else if (document.all && !window.opera) {
       document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>');
       var contentloadtag = document.getElementById("contentloadtag")
       contentloadtag.onreadystatechange=function(){
           if (this.readyState=="complete"){
               alreadyrunflag=1;
               VanillaRunOnDomReady();
           }
       }
   }
7. window.onload = function(){
     setTimeout("if (!alreadyrunflag){VanillaRunOnDomReady}", 0);
   }//]]>
8. </script>
9.   <script type='text/javascript'>//<![CDATA[
       $(window).load(function () {
           $("#txtFromDate").datepicker();
           $("#txtToDate").datepicker();
           $("#txtFromDueDate").datepicker();
           $("#txtToDueDate").datepicker();
           $("#bidDate").datepicker();
           $("#dueDate").datepicker();
        });//]]>
     </script>
    <style type="text/css">
       .ui-datepicker {
           font-family:Garamond;
           font-size: 10px;
           margin-left:1px;
        background: #333;
        border: 1px solid #555;
        color: #EEE;
      }
      .ui-datepicker-trigger
      {
         position: relative; top: 5px;
      }
   </style>
10.     <form id="form1" action="bidsPagedSearch.php" method="get" target="SearchResults">
11.    Date Range:
         <div class="input text">
         <input type="text" ID="txtFromDate" name="txtFromDate" placeholder="Issue date (From...)" style="width:147px;height:15px;" class="dpDate">
         <input type="text" ID="txtToDate" name="txtToDate" placeholder="Issue date (To...)" style="width:147px;height:15px;"></div>
         <span style="color:#fff;text-align:center;">OR </span><br />
         <div class="input text">
         <input type="text" ID="bidDate" name="bidDate" placeholder="Specific Issue date..." style="width:147px;height:15px;"></div><br />
         <div class="input text">
         <input type="text" ID="txtFromDueDate" name="txtFromDueDate" placeholder="Due date (From...)" style="width:147px;height:15px;">
         <input type="text" ID="txtToDueDate" name="txtToDueDate" placeholder="Due date (To...)" style="width:147px;height:15px;"></div>
         <span style="color:#fff;text-align:center;">OR </span><br />
         <div class="input text">
         <input type="text" ID="dueDate" name="dueDate" placeholder="Specific Due date..." style="width:147px;height:15px;"></div><br />
         <div class="input text">
12. </form>

Maybe, there is something in this code that is creating a conflict. That's why I am posting all the libraries I am using so far.

Thanks in advance