Reputation: 43
i have two inputs which are datepickers thanks to this
<div class="col-6">
<input type="text" class="dateselect startDateJq " required="required"/>
</div>
<div class="col-6">
<input type="text" class="dateselect endDateJq" required="required"/>
</div>
and now im trying to get the dates in string format in a live way (not onload or keyup, when user picked or changed his date the variable changes) with JQ to calculate the price for the customer based on the difference between two dates like this.
$('.startDateJq, .endDateJq').on("input", function(){
var a = ($(".startDateJq").val());
var b = ($(".endDateJq").val());
});
but as you can guess it's not working at all. I will calculate the difference thanks to moment js but firstly i need this to work
Upvotes: 0
Views: 184
Reputation: 4686
If I understand your questions correctly, I would advise you to listen to change in value. See the example below.
$(function() {
$('#startDateJq, #endDateJq').on("change", function() {
setTimeout(function() {
var a = new Date($(".dateselect").val());
var b = new Date($(".dateselect1").val());
var diff = (b - a);
alert(diff / 1000 / 60 / 60 / 24 + " Day(s)");
}, 1000); // A litle delay to wait for both values
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-6">
<input type="date" class="dateselect" id='startDateJq ' required="required" />
</div>
<div class="col-6">
<input type="date" class="dateselect1" id='endDateJq' required="required" />
</div>
Upvotes: 1
Reputation: 43
Zhonk was right the input wasn't triggered at all this will work
$('.dateselect').datepicker()
.on('changeDate', function() {
var a = ($(".startDateJq").val());
console.log(a)
});
Upvotes: 0