Question

我目前被困住了。我想将2个datepicker的2个日期分配为data-date1和data-date2属性到button。然后单击该按钮，它将进行一次调用，以使用其数据属性中的值检查数据库。

ajax的php片段不是我的问题，更像是如何获取datapicker值？

以下是我的代码到目前为止，这里是fiddle

`

$('#date1').on('changeDate', function(a) {
var Date1 = $('#date1').val();
var Date2 = $('#date2').val();
$('#button').attr('data-date1', Date1);
$('#button').attr('data-date2', Date2);
});
});

$(document).on("click", "#button", function() {
  var d1 = $(this).data('date1');
  var d2 = $(this).data('date2');
  $.post('phpurl.php/controller', {
    d1,
    d2
  }, function() { /* do something */ });
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <label>Date 1</label>
  <input class="form-control" type="datetime-local" id="date1">
</div>
<div>
  <label>Date 2</label>
  <input class="form-control" type="datetime-local" id="date2">
</div>

`

Answer 1

试用此代码

您可以使用change事件

轻松地将datepickers中的值分配给按钮

$('#date1').on('change, blur', function(a) {
var Date1 = $(this).val();
$('#button').attr('data-date1', Date1);
});
$('#date2').on('change, blur', function(a) {
var Date2 = $(this).val();
$('#button').attr('data-date2', Date2);
});

$('#date1').on('change, blur', function(a) {
var Date1 = $(this).val();
alert(Date1);
$('#button').attr('data-date1', Date1);
});
$('#date2').on('change, blur', function(a) {
var Date2 = $(this).val();
alert(Date2);
$('#button').attr('data-date2', Date2);
});

$(document).on("click", "#button", function() {
  var d1 = $(this).data('date1');
  var d2 = $(this).data('date2');
  $.post('phpurl.php/controller', {
    d1,
    d2
  }, function() { /* do something */ });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div>
  <label>Date 1</label>
  <input class="form-control" type="datetime-local" id="date1">
</div>
<div>
  <label>Date 2</label>
  <input class="form-control" type="datetime-local" id="date2">
</div>
<button id="button">button</button>

将datepicker中的日期分配给按钮作为jquery post的data-id属性

1 个答案: