使用整数添加datepicker日期

Question

我的代码中有三个字段，

1. 日期选择器
2. 整数值的输入字段
3. 显示结果日期的输入框。

我选择了datepicker日期，并以dd/mm/yyyy格式读取，比如说06/02/2018。现在，我在下一个输入框中输入一个整数值，然后单击一个按钮，在将整数添加到所选日期后显示结果日期。在结果中，我的日期以mm-dd-yyyy格式显示，并且该整数已添加到所选日期的月份部分，即如果我将3天添加到所选日期06/02/2018，则应显示09/02/2018，但相反将结果日期显示为06/05/2018。

这怎么解决？欢迎任何见解和意见。

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<div class="panel panel-primary">
  <div class="panel-heading">Registration Parameters</div>
  <br><br>
  <form class="form-horizontal" method="post" action="" >
    <div class="form-group">
      <div class="col-md-6">
        <div class="col-md-4">
          <label for="username" class="control-label"><b>Date from:</b></label>
        </div>
        <div class="col-md-8 input-group date" >
          <input id="txtDate"  name="title"  class="form-control" placeholder="Start Date" value="" >
        </div>
      </div>
      <div class="col-md-6">
        <div class="col-md-4">
          <label for="username" class="control-label"><b>New Date formed:</b></label>
        </div>
        <div class="col-md-8">
          <div class="input-group date">
            <input id="follow_Date"  name="days_for_start" disabled class="form-control"  value="" >
          </div>
        </div>
      </div>
      <br><br><br><br>
      <input type="button" id="btn"  value="Check New Date" />
      <div class="col-md-6">
        <div class="col-md-4">
          <label for="username" class="control-label"><b>Extension days:</b></label>
        </div>
        <div class="col-md-8">
          <input id="extdays" type="text" name="days_for_end"  class="form-control"  required="" value="" >
        </div>
      </div>
    </div>
  </form>
</div>
      
<script type="text/javascript">
  $(document).ready(function () {
    $('#txtDate').datepicker({
      dateFormat:'mm/dd/yy',
    });
  });

  function getdate() {
    var tt = document.getElementById('txtDate').value;
    var input = document.getElementById('extdays').value;
    if (input == "" || input==null){
      input =0
    }
    if(tt != ''){
      var date = new Date(tt);
      var newdate = new Date(tt);
      newdate.setDate(newdate.getDate() + parseInt(input));

      var dd = newdate.getDate();
      var mm = newdate.getMonth() + 1;
      var y = newdate.getFullYear();

      var someFormattedDate = mm + '/' + dd + '/' + y;
    
      document.getElementById('follow_Date').value = someFormattedDate;
    }
  }
</script>

Answer 1

我做了一些更改，现在正在查看此答案

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <div class="form-group">
              <div class="col-md-6">
                <div class="col-md-4">
                  <label for="username" class="control-label"><b>Date from:</b></label>
                </div>
                <div class="col-md-8 input-group date" >
                <input id="txtDate"  name="title" maxlength="150" class="form-control" placeholder="Start Date" value="" >

                </div>
              </div>
              <div class="col-md-6">
                <div class="col-md-4">
                  <label for="username" class="control-label"><b>New Date formed:</b></label>
                </div>
                <div class="col-md-8">
                  <div class="input-group date">
               <input id="follow_Date" type="text" name="days_for_start" disabled class="form-control"  value="" >
                </div>
                </div>
                </div><br><br> <br><br>
                 <input type="button" onclick="getdate()" value="Check New Date" />
              <div class="col-md-6">
                <div class="col-md-4">
                  <label for="username" class="control-label"><b>Extension days:</b></label>
                </div>
                <div class="col-md-8">
               <input id="extdays" type="text" name="days_for_end"  class="form-control"  required="" value="" >
                </div>
              </div>
              </div>
              <script>
  $(document).ready(function () {
            $('#txtDate').datepicker({
   
    dateFormat:'mm/dd/yy',
   
});
    });


  function getdate() {
  var tt = document.getElementById('txtDate').value;
  var input = document.getElementById('extdays').value;
  if (input == "" || input==null){
    input =0
  }
  if(tt != ''){
    var date = new Date(tt);
    var newdate = new Date(tt);


    newdate.setDate(newdate.getDate() + parseInt(input));

    var dd = newdate.getDate();
    var mm = newdate.getMonth() + 1;
    var y = newdate.getFullYear();

    var someFormattedDate = mm + '/' + dd + '/' + y;
    
    document.getElementById('follow_Date').value = someFormattedDate;
  }
  }

  </script>

Answer 2

希望这会有所帮助

＆＃13;

＆＃13;

$input_data = $request->all();

$validator = Validator::make(
$input_data, [
'image_file.*' => 'required|file|mimes:xlsx,xls,csv,jpg,jpeg,png,bmp,doc,docx,pdf,tif,tiff'
],[
    'image_file.*.required' => 'Please upload an image',
    'image_file.*.mimes' => 'Only xlsx,xls,csv,jpg,jpeg,png,bmp,doc,docx,pdf,tif,tiff images are allowed',

]
);

if ($validator->fails()) {
    $messages = $validator->messages();
    return Redirect::to('/')->with('message', 'Your erorr message');
}

＆＃13;

＆＃13;

＆＃13;

Answer 3

您好需要将DateString解析为Date -

tt = $.datepicker.parseDate("dd/mm/yy",tt);

您更新的脚本是

 function getdate() {  
  var tt = document.getElementById('txtDate').value;
  var input = document.getElementById('extdays').value;
  if (input == "" || input==null){
    input =0
  }
  if(tt != ''){
   tt = $.datepicker.parseDate("dd/mm/yy",tt);
    var date = new Date(tt);
    var newdate = new Date(tt);


    newdate.setDate(newdate.getDate() + parseInt(input));

    var dd = newdate.getDate();
    var mm = newdate.getMonth() + 1;
    var y = newdate.getFullYear();

    var someFormattedDate = mm + '/' + dd + '/' + y;

    document.getElementById('follow_Date').value = someFormattedDate;
  }
  }

Answer 4

终于得到了结果。必须解析输入日期并转换，

    <script>  

    $(document).ready(function () {

       $( "#txtDate" ).datepicker({
            //dateFormat: "dd/mm/yy"
            dateFormat: "dd/mm/yy"
        });
      });
    function getdate() {
        var tt = document.getElementById('txtDate').value;
        var input = document.getElementById('extdays').value;
        if (input == "" || input==null)
        {
          input =0
        }


    var initial = tt.split(/\//).reverse().join('/'); // to change the format

        var date = new Date(initial);
        var newdate = new Date(date);


       newdate.setDate(newdate.getDate() + parseInt(input));

        var dd = newdate.getDate();
        var mm = newdate.getMonth() + 1;
        var y = newdate.getFullYear();

        var someFormattedDate = dd + '/' + mm + '/' + y;
        document.getElementById('follow_Date').value = someFormattedDate;
    }
</script> 

Answer 5

更改

var someFormattedDate = mm + '/' + dd + '/' + y;

到

var someFormattedDate = dd + '/' + mm + '/' + y;

所以你得到了你想要的结果。