2010-11-27 134 views
0

私は、 のWED & SATを表示する作業中のjQuery UI DatePickerスクリプトを持っています(下記のMAIN SCRIPTを参照してください)。jQueryのUI DatePickerボタンを追加する方法TRIGGER SCRIPT

また、 ボタンイメージを追加してDatePickerをトリガーするjQuery UI DatePickerスクリプトもあります(下記のトリガースクリプトを参照してください)。

どのようにしてTRIGGER SCRIPTをMAIN SCRIPTに統合できますか?

これはシンプルですが、この初心者は構文を理解できません。 そのことについて申し訳ありません....

トリガースクリプト:

<script> 
$(function() { 
    $("#datepicker").datepicker({ 
     showOn: "button", 
     buttonImage: "css/blitzer/images/calendar.gif", 
     buttonImageOnly: true 
    }); 
}); 
</script> 

メインスクリプト:あなたのメインスクリプトで

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title>Disable Certains Days in a Week using jQuery UI DatePicker</title> 
     <link rel="stylesheet" href="css/redmond/jquery-ui-1.8.6.custom.css" type="text/css" /> 
     <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
     <script type="text/javascript" src="js/jquery-ui-1.8.6.custom.min.js"></script> 


     <script type="text/javascript"> 
     $(function() { 
      $("#datepicker").datepicker(
      { beforeShowDay: function(day) { 
       var day = day.getDay(); 
       if (day == 0 || day == 1 || day == 2 || day == 4 || day == 5) { 
        return [false, "somecssclass"] 
       } else { 
        return [true, "someothercssclass"] 
       } 
      } 
      }); 
     }); 
     </script> 
    </head> 
    <body> 
     <input id="datepicker"/> 
    </body> 
</html> 
+0

ドリス42ダブルDD? http://marcgrabanski.com/articles/jquery-ui-datepicker – 422

+0

水曜と土曜日だけを表示するスクリプトはどこですか? –

答えて

1
<input type="button" name="date" id="popupDatepicker"> 


/* create an array of days which need to be disabled */ 
     var disabledDays = ["2-21-2010","2-24-2010","2-27-2010","2-28-2010","3-3-2010","3-17-2010","4-2-2010","4-3-2010","4-4-2010","4-5-2010"]; 

     /* utility functions */ 
     function nationalDays(date) { 
      var m = date.getMonth(), d = date.getDate(), y = date.getFullYear(); 
      //console.log('Checking (raw): ' + m + '-' + d + '-' + y); 
      for (i = 0; i < disabledDays.length; i++) { 
       if(ArrayContains(disabledDays,(m+1) + '-' + d + '-' + y) || new Date() > date) { 
        //console.log('bad: ' + (m+1) + '-' + d + '-' + y + '/' + disabledDays[i]); 
        return [false]; 
       } 
      } 
      //console.log('good: ' + (m+1) + '-' + d + '-' + y); 
      return [true]; 
     } 
     function noWeekendsOrHolidays(date) { 
      var noWeekend = jQuery.datepicker.noWeekends(date); 
      return noWeekend[0] ? nationalDays(date) : noWeekend; 
     } 

     /* taken from mootools */ 
     function ArrayIndexOf(array,item,from){ 
      var len = array.length; 
      for (var i = (from < 0) ? Math.max(0, len + from) : from || 0; i < len; i++){ 
       if (array[i] === item) return i; 
      } 
      return -1; 
     } 
     /* taken from mootools */ 
     function ArrayContains(array,item,from){ 
      return ArrayIndexOf(array,item,from) != -1; 
     } 


     /* create datepicker */ 
     jQuery(document).ready(function() { 
      jQuery('#date').datepicker({ 
       minDate: new Date(2010, 0, 1), 
       maxDate: new Date(2010, 5, 31), 
       dateFormat: 'DD, MM, d, yy', 
       constrainInput: true, 
       beforeShowDay: noWeekendsOrHolidays 
      }); 
     }); 
0

$(document).ready(function(){ 
     $("#datepicker").datepicker(
       { showOn: "button", 
       buttonImage: "css/blitzer/images/calendar.gif", 
       buttonImageOnly: true}); 
}); 
+0

http://keith-wood.name/datepick.html ポップアップdatepickerはどの要素からでも起動できます。もし彼がボタンを望んでいるのであれば、ちょうど適当なIDを付けたのが – 422

+0

なのですが、私は彼らがメインのjavascriptファイルのどこにdatapicker要素の拡張子を追加すべきか質問していると思いました。間違っている可能性があります。 –

+0

あなたはメーシーになっているかもしれないようです:) – 422

-1

解決方法:jQuery UIのDatePickerボタンを追加する方法TRIGGER SCRIPT。

<script type="text/javascript"> 
    $(function() { 
     $("#datepicker").datepicker({ 
       showOn: "button", 
       buttonImage: "css/blitzer/images/calendar.gif", 
       buttonImageOnly: true, 
       beforeShowDay: function(day) { 
     var day = day.getDay(); 
     if (day == 0 || day == 1 || day == 3 || day == 4 || day == 6) { 
      return [false, "somecssclass"] 
     } else { 
      return [true, "someothercssclass"] 
     } 
    } 
     }); 
    }); 
</script> 
関連する問題