JQuery Datepicker维护月份和年份数据

时间:2017-09-20 08:53:31

标签: jquery

我正在使用JQuery Datepicker,我只选择月份和年份,我获取值并将值分配给文本框。如果我想选择另一个月或一年,文本框中的值将重置为默认下拉值。我无法在下拉列表中维护所选值。

任何人都可以建议如何维护它。



 <script src="../SiteAssets/MedcomJs/Custom jq-ui.js" type="text/javascript"></script>

<script src="../SiteAssets/MedcomJs/jQueryv1.11.1.js" type="text/javascript"></script>
<link href="../SiteAssets/MedcomCss/Jquery-ui.css" rel="stylesheet" type="text/css"/> 

 <script type="text/javascript">
 
 $( "#SCAactionmonthss" ).next().bind("click",function () {
    $(".ui-datepicker-calendar,.ui-datepicker-next,.ui-datepicker-prev").css("display","none");
        var month=  $(".ui-datepicker-month").find('option:selected').text();
        var year=  $(".ui-datepicker-year").find('option:selected').text();
        $("#SCAactionmonthss").val(month+" "+year);
    });
    
    $(document).on("keyup keypress focus", $( "#SCAactionmonthss" ).next(), function(e) {
        if(e.which==9){
            $(".ui-datepicker-calendar,.ui-datepicker-next,.ui-datepicker-prev").css("display","none");
        }
    });

    $(function() {
        $('.date-picker').datepicker( {
            showOn: "button",
            buttonImage: "/_layouts/15/images/calendar_25.gif",
            buttonImageOnly: true,
            //buttonText: "Select Month",
            changeMonth: true,
            changeYear: true,
            dateFormat: 'M yy',
            minDate: new Date(),
            onSelect: function(dateText, inst) {
                $(".date-picker").datepicker("option", "defaultDate", dateText);
            },
        }).focus(function() {
            $(".ui-datepicker-calendar,.ui-datepicker-prev, .ui-datepicker-next").remove();
            var month=  $(".ui-datepicker-month").find('option:selected').text();
            var year=  $(".ui-datepicker-year").find('option:selected').text();
            $("#SCAactionmonthss").val(month+" "+year);
        });
      
    });
</script>
&#13;
<div class="dpicker"> 
     <input name="startDate" id="SCAactionmonthss" class=" date-picker formdatepicker"  /> 
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

new ByteBuddy() .rebase(classOf[Source]) .method(ElementMatchers.named("hello")) .intercept(MethodDelegation.to(new Target)) .make() .load(classOf[Source].getClassLoader, ClassReloadingStrategy.fromInstalledAgent()) .getLoaded .newInstance() .hello("World") 绑定事件focusmonth选择更改。

选择更改year选择值。

setDate

&#13;
&#13;
$(".date-picker").focus(function() {
    $(".ui-datepicker-calendar").hide();
    //add event to perform on done button click
    $(".ui-datepicker-month, .ui-datepicker-year").on('change', function() {
      var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
      var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
      $(".date-picker").datepicker('option', 'defaultDate', new Date(year, month, 1));
      $(".date-picker").datepicker('setDate', new Date(year, month, 1));
      $(".ui-datepicker-calendar").hide();
    });
  });
&#13;
$("#SCAactionmonthss").next().bind("click", function() {
  $(".ui-datepicker-calendar,.ui-datepicker-next,.ui-datepicker-prev").css("display", "none");
  var month = $(".ui-datepicker-month").find('option:selected').text();
  var year = $(".ui-datepicker-year").find('option:selected').text();
  $("#SCAactionmonthss").val(month + " " + year);
});

$(document).on("keyup keypress focus", $("#SCAactionmonthss").next(), function(e) {
  if (e.which == 9) {
    $(".ui-datepicker-calendar,.ui-datepicker-next,.ui-datepicker-prev").css("display", "none");
  }
});

$(function() {
  $('.date-picker').datepicker({
    showOn: "button",
    //buttonText: "Select Month",
    changeMonth: true,
    changeYear: true,
    dateFormat: 'M yy',
    minDate: new Date()
  });


  $(".date-picker").focus(function() {
    $(".ui-datepicker-calendar").hide();
    //add event to perform on done button click
    $(".ui-datepicker-month, .ui-datepicker-year").on('change', function() {
      var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
      var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
      $(".date-picker").datepicker('option', 'defaultDate', new Date(year, month, 1));
      $(".date-picker").datepicker('setDate', new Date(year, month, 1));
      $(".ui-datepicker-calendar").hide();
    });
  });

});
&#13;
&#13;
&#13;