JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" class="form-control date" value="04/06/2015">
<button type="button" class="btn btn-primary" id="search-button">Search</button>
<br>
<br>
<div class="rideshare-item" data-date="2015-06-04">04/06/2015</div>
<div class="rideshare-item" data-date="2015-06-05">05/06/2015</div>
JavaScript
$('body').on('click', '#search-button', function (event) {
// Collect values
var date = $('.date').val().trim();
$('.rideshare-item, .no-result').hide();
$('.rideshare-item').each(function (a, b) {
var rideshareDate = $(b).data('date');
// Check for rideshareDate
if (date.length == 0) {
$(this).closest('.rideshare-item').show();
} else if (date.length > 0) {
// Check to see if it is a valid date, if it is then run comparison
var timestamp = Date.parse(date)
if (isNaN(timestamp) == false) {
alert("de: " + parseDateEntry(date));
alert("da: " + parseDateAttribute(rideshareDate))
if (parseDateEntry(date) == parseDateAttribute(rideshareDate)) {
$(this).closest('.rideshare-item').show();
}
}
}
});
});
function parseDateEntry(input) {
var parts = input.split('/');
// new Date(year, month [, day [, hours[, minutes[, seconds[, ms]]]]])
return new Date(parts[2], parts[1]-1, parts[0]);
}
function parseDateAttribute(input) {
var parts = input.split('-');
// new Date(year, month [, day [, hours[, minutes[, seconds[, ms]]]]])
return new Date(parts[0], parts[1]-1, parts[2]);
}