i need to highlight a disabled date from datepicker
what i have now is like this
the only available day is Tuesday, so i wanted to highlight the disabled day
this is my javascript
<script>
var idf = '';
var hari = '';
$('.divradio').hide();
$(".divradio input").prop('disabled','disabled');
function getIndex(data, id) {
var date = $('#' + data).datepicker('getDate');
var dayOfWeek = date.getDay();
$('.divradio').hide();
$(".radio" + idf + hari + " input").prop('checked', false);
// $(".radio" + idf + hari + " input").attr('disabled','disabled');
$('.radio' + id + dayOfWeek).show();
$(".radio" + id + dayOfWeek + " input").removeAttr('disabled');
idf = id;
hari = dayOfWeek;
// console.log(".radio" + idf + hari + " input");
};
</script>
what should i do to achieve that?
With jQuery UI you can use Theming with CSS to do this. Consider the following example.
$(function() {
$("#datepicker").datepicker({
beforeShowDay: function(dt) {
if (dt.getDay() == 2) {
return [true, ""];
} else {
return [false, ""];
}
}
});
});
.ui-datepicker-calendar .ui-datepicker-unselectable span {
background-color: yellow;
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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>
Date:
<div id="datepicker"></div>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Try It</title>
<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>
<script type="text/javascript">
var dates = new Array();
function addDates(date) {
if (dates.length > 0) {
dates = [];
}
if (jQuery.inArray(date, dates) < 0){
var i;
var month = date.getMonth()+1;
var day = date.getDate();
var year = date.getFullYear();
for (i=1;i<14;i++){
var value = month + '/' + day + '/' + year;
var dateIsValid = isDate(value);
if (dateIsValid == true) {
day++;
dates.push(value);
} else {
if (month == 12) {
month = 0;
year = year + 1;
day = 0;
}
if (month != 12) {
month = month + 1;
day = 1;
}
var value = month + '/' + day + '/' + year;
dates.push(value);
}
console.log(dateIsValid);
console.log(dates);
}
}
}
function isDate(val) {
var date = new Date(val);
return !isNaN(date.valueOf());
}
jQuery(function () {
jQuery("#datepicker").datepicker({
autoclose: false,
onSelect: function (dateText, inst) {
var date = new Date($(this).datepicker('getDate'));
addDates(date);
},
beforeShowDay: function (date) {
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var dateString = month + "/" + day + "/" + year;
var gotDate = jQuery.inArray(dateString, dates);
if (gotDate >= 0) {
// Enable date so it can be deselected. Set style to be highlighted
return [true, "ui-state-highlight"];
}
// Dates not in the array are left enabled, but with no extra style
return [true, ""];
}
});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker"></p>
I've created a script where it highlights the next 14 days then it checks if the date is valid or not. If Not it will change the date.
Problem is:
When i select the date October 31, 2017
the array should look like this
10/31/2017, 11/1/2017, 11/2/2017,...
But the array returns:
10/31/2017, 11/1/2017, 11/1/2017, 11/2/2017, ...
thanks in advance
Here is the solution using moment.js , it is very easy , you don't need to use that complicated coding which you have. It is add a 14 days in selected date.Moment.js is automatically handle the month change , year change etc , so you don't need that extra conditions which is for change month,year,date etc.
var dates = new Array();
function addDa(date){
dates = [];
var selected_date = moment(date);
var last_date = moment(date).add(14, 'days');
for (var dat=selected_date; dat <= last_date; dat.add(1, 'days'))
{
dates.push(dat.format('MM/DD/YYYY'));
}
console.log(dates);
}
jQuery(function () {
jQuery("#datepicker").datepicker({
autoclose: false,
onSelect: function (dateText, inst) {
var date = new Date($(this).datepicker('getDate'));
addDa(date);
},
beforeShowDay: function (date) {
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var dateString = month + "/" + day + "/" + year;
var gotDate = jQuery.inArray(dateString, dates);
if (gotDate >= 0) {
// Enable date so it can be deselected. Set style to be highlighted
return [true, "ui-state-highlight"];
}
// Dates not in the array are left enabled, but with no extra style
return [true, ""];
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.0/moment.js"></script>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Try It</title>
<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>
</head>
<body>
<p>Date: <input type="text" id="datepicker"></p>
error in :
if (month != 12) {
month = month + 1;
day = 1;
}
var value = month + '/' + day + '/' + year;
dates.push(value);
you pushed value : 11/1/2017 to datas.
then day=1, month=11 :
var value = month + '/' + day + '/' + year;
var dateIsValid = isDate(value);
if (dateIsValid == true) {
day++;
dates.push(value);
}
you push again value : 11/1/2017 . you can add day++ to
if (month != 12) {
month = month + 1;
day = 1;
}
var value = month + '/' + day + '/' + year;
dates.push(value);
day++;
same as below :
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Try It</title>
<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>
<script type="text/javascript">
var dates = new Array();
function addDates(date) {
if (dates.length > 0) {
dates = [];
}
if (jQuery.inArray(date, dates) < 0){
var i;
var month = date.getMonth()+1;
var day = date.getDate();
var year = date.getFullYear();
for (i=1;i<14;i++){
var value = month + '/' + day + '/' + year;
var dateIsValid = isDate(value);
if (dateIsValid == true) {
day++;
dates.push(value);
} else {
if (month == 12) {
month = 0;
year = year + 1;
day = 0;
}
if (month != 12) {
month = month + 1;
day = 1;
}
var value = month + '/' + day + '/' + year;
dates.push(value);
day++;
}
console.log(dateIsValid);
console.log(dates);
}
}
}
function isDate(val) {
var date = new Date(val);
return !isNaN(date.valueOf());
}
jQuery(function () {
jQuery("#datepicker").datepicker({
autoclose: false,
onSelect: function (dateText, inst) {
var date = new Date($(this).datepicker('getDate'));
addDates(date);
},
beforeShowDay: function (date) {
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var dateString = month + "/" + day + "/" + year;
var gotDate = jQuery.inArray(dateString, dates);
if (gotDate >= 0) {
// Enable date so it can be deselected. Set style to be highlighted
return [true, "ui-state-highlight"];
}
// Dates not in the array are left enabled, but with no extra style
return [true, ""];
}
});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker"></p>
Btw found a solution adding a day++ after pushing it when the date is not valid :)
Full Code: custom.js
function addAlert(message, type) {
$('.alerts-con').empty().append(
'<div class="alert alert-' + type + '">' +
'<button type="button" class="close" data-dismiss="alert">' +
'×</button>' + message + '</div>');
}
function widthFunctions(e) {
$(".tip").tooltip();
$(".chzn-container").css('width', '100%');
var bH = $('body').height();
var nH = $('.navbar').outerHeight();
var mH = $('.mainbar').height();
var sbH = bH - nH;
if ( mH > sbH ) {
$('.sidebar-inner').css('height', (mH+20)+'px');
} else {
$('.sidebar-inner').css('height', (sbH)+'px');
}
}
$(document).ready(function () {
widthFunctions();
});
// $(window).load(function () {
// setTimeout(widthFunctions, 2000);
// });
$(window).bind("resize", widthFunctions);
//$('.container').bind("resize", widthFunctions);
/* Navigation */
$(document).ready(function() {
$(window).resize(function() {
if($(window).width() >= 765){
$(".sidebar .sidebar-inner").css('width', '100%');
$(".sidebar .sidebar-inner").slideDown(350);
}
else{
$(".sidebar .sidebar-inner").slideUp(350);
}
});
});
$(document).ready(function(){
$(".has_submenu > a").click(function(e){
e.preventDefault();
var menu_li = $(this).parent("li");
var menu_ul = $(this).next("ul");
if(menu_li.hasClass("open")){
menu_ul.slideUp(350);
menu_li.removeClass("open")
}
else{
$(".navi > li > ul").slideUp(350);
$(".navi > li").removeClass("open");
menu_ul.slideDown(350);
menu_li.addClass("open");
}
});
});
$(document).ready(function(){
$(".sidebar-dropdown a").on('click',function(e){
e.preventDefault();
if(!$(this).hasClass("dropy")) {
$(".sidebar .sidebar-inner").slideUp(350);
$(".sidebar-dropdown a").removeClass("dropy");
$(".sidebar .sidebar-inner").slideDown(350);
$(this).addClass("dropy");
}
else if($(this).hasClass("dropy")) {
$(this).removeClass("dropy");
$(".sidebar .sidebar-inner").slideUp(350);
}
});
});
$(".totop").hide();
$(function(){
$(window).scroll(function(){
if ($(this).scrollTop()>300)
$('.totop').slideDown();
else
$('.totop').slideUp();
});
$('.totop a').click(function (e) {
e.preventDefault();
$('body,html').animate({scrollTop: 0}, 500);
});
});
$(function() {
$( "#todaydate" ).datepicker({
onSelect: function(dateText, inst) {
var sp = dateText.split('/')
var href = Site.base_url+'calendar/get_day_event/' + sp[2]+'-'+sp[0]+'-'+sp[1];
$.get(href, function( data ) {
$("#simModal").html(data).appendTo("body").modal();
});
}
});
});
/* Modal fix */
$('.modal').appendTo($('body'));
$(document).ready(function() {
$('#gen_ref').click(function(){
$(this).parent('.input-group').children('input').val(getRandomRef());
});
// $('#simModal').on('hidden.bs.modal', function() {
// $(this).find('.modal-dialog').empty();
// $(this).removeData('bs.modal');
// });
// $('#simModal2').on('hidden.bs.modal', function () {
// $(this).find('.modal-dialog').empty();
// $(this).removeData('bs.modal');
// $('#simModal').css('zIndex', '1050');
// $('#simModal').css('overflow-y', 'scroll');
// });
// $('#simModal2').on('show.bs.modal', function () {
// $('#simModal2').appendTo('body');
// $('#simModal').css('zIndex', '1040');
// });
// $('.modal').on('show.bs.modal', function () {
// $('#modal-loading').show();
// $('.blackbg').css('zIndex', '1041');
// $('.loader').css('zIndex', '1042');
// }).on('hide.bs.modal', function () {
// $('#modal-loading').hide();
// $('.blackbg').css('zIndex', '3');
// $('.loader').css('zIndex', '4');
// });
$("form select").chosen({no_results_text: "No results matched", disable_search_threshold: 5, allow_single_deselect:true, width: '100%'});
$('#myTab a').click(function (e) {
e.preventDefault()
$(this).tab('show');
});
$('#myTab a').first().tab('show');
if (location.hash !== '') $('a[href="' + location.hash + '"]').tab('show');
return $('a[data-toggle="tab"]').on('shown', function(e) {
return location.hash = $(e.target).attr('href').substr(1);
});
});
function fld(oObj) {
if (oObj != null) {
var aDate = oObj.split('-');
var bDate = aDate[2].split(' ');
year = aDate[0], month = aDate[1], day = bDate[0], time = bDate[1];
if (Site.dateFormats.js_sdate == 'dd-mm-yyyy')
return day + "-" + month + "-" + year + " " + time;
else if (Site.dateFormats.js_sdate === 'dd/mm/yyyy')
return day + "/" + month + "/" + year + " " + time;
else if (Site.dateFormats.js_sdate == 'dd.mm.yyyy')
return day + "." + month + "." + year + " " + time;
else if (Site.dateFormats.js_sdate == 'mm/dd/yyyy')
return month + "/" + day + "/" + year + " " + time;
else if (Site.dateFormats.js_sdate == 'mm-dd-yyyy')
return month + "-" + day + "-" + year + " " + time;
else if (Site.dateFormats.js_sdate == 'mm.dd.yyyy')
return month + "." + day + "." + year + " " + time;
else
return oObj;
} else {
return '';
}
}
function fsd(oObj) {
if (oObj != null) {
var aDate = oObj.split('-');
if (Site.dateFormats.js_sdate == 'dd-mm-yyyy')
return aDate[2] + "-" + aDate[1] + "-" + aDate[0];
else if (Site.dateFormats.js_sdate === 'dd/mm/yyyy')
return aDate[2] + "/" + aDate[1] + "/" + aDate[0];
else if (Site.dateFormats.js_sdate == 'dd.mm.yyyy')
return aDate[2] + "." + aDate[1] + "." + aDate[0];
else if (Site.dateFormats.js_sdate == 'mm/dd/yyyy')
return aDate[1] + "/" + aDate[2] + "/" + aDate[0];
else if (Site.dateFormats.js_sdate == 'mm-dd-yyyy')
return aDate[1] + "-" + aDate[2] + "-" + aDate[0];
else if (Site.dateFormats.js_sdate == 'mm.dd.yyyy')
return aDate[1] + "." + aDate[2] + "." + aDate[0];
else
return oObj;
} else {
return '';
}
}
function formatNumber(x, d) {
if(!d) { d = Site.Settings.decimals; }
return accounting.formatNumber(x, d, Site.Settings.thousands_sep == 0 ? ' ' : Site.Settings.thousands_sep, Site.Settings.decimals_sep);
}
function formatMoney(x, symbol) {
if(!symbol) { symbol = ""; }
return accounting.formatMoney(x, symbol, Site.Settings.decimals, Site.Settings.thousands_sep == 0 ? ' ' : Site.Settings.thousands_sep, Site.Settings.decimals_sep, "%s%v");
}
function decimalFormat(x) {
if (x != null) {
return '<div class="text-center">'+formatNumber(x)+'</div>';
} else {
return '<div class="text-center">0</div>';
}
}
function currencyFormat(x) {
if (x != null) {
return '<div class="text-right">'+formatMoney(x)+'</div>';
} else {
return '<div class="text-right">0</div>';
}
}
function formatDecimal(x) {
return parseFloat(x).toFixed(decimals);
}
function getRandomRef() {
var min = 10000000000000, max = 9999999999999999;
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function formatDecimal(x, d) {
if(!d) { d = Site.Settings.decimals; }
return parseFloat(accounting.formatNumber(x, d, Site.Settings.thousands_sep == 0 ? ' ' : Site.Settings.thousands_sep, Site.Settings.decimals_sep));
}
function cf(x) { return currencyFormat(x); }
function pf(x) { return parseFloat(x); }
// for add edit pages
var rate_origin;
function suggestions() {
$(".suggestions").autocomplete({
source: Site.base_url+'products/suggestions',
select: function (event, ui) {
var row = $(this).closest('tr');
var sel_item = ui.item;
row.find('.price').val(sel_item.price);
rate_origin = sel_item.price;
var price = parseInt(row.find('.price').val());
var gst = parseInt(price * 0.14);
row.find('.hsn').val(sel_item.hsn);
row.find('.cgst').val(gst);
var igst = $('#gst').val();
if(igst == 'sgst'){
row.find('.igst').val('NIL');
row.find('.sgst').val(gst);
}else {
row.find('.sgst').val('NIL');
row.find('.igst').val(gst);
}
rate = row.find('.price').val();
var data = $('#order_tax').val();
var cgst = row.find('.cgst').val();
var sgst = row.find('.sgst').val();
var igst = row.find('.igst').val();
if(data == 'incl'){
if($('#gst').val() == 'sgst'){
console.log('Hello SGST Type'+rate+data+cgst+sgst);
var change_price = (rate - cgst) - sgst;
row.find('.price').val(change_price);
}else {
console.log('Hello IGST Type '+rate+data+cgst+igst);
var change_price = (rate - cgst) - igst;
row.find('.price').val(change_price);
}
}
if(row.find('.sqft').val() == 0){
row.find('.sqft').val(1).change();
}
if (sel_item.details != '' && sel_item.details != null) {
row.find('.details-con').css('display', 'block');
row.find('.details').val(sel_item.details);
}
calculateTotal();
},
minLength: 1,
autoFocus: false,
delay: 250,
response: function (event, ui) {
if (ui.content.length == 1 && ui.content[0].id != 0) {
ui.item = ui.content[0];
$(this).val(ui.item.label);
$(this).removeClass('ui-autocomplete-loading');
}
},
});
$(".price").select(calculateTotal());
}
function calculateTotal() {
if (typeof counter !== 'undefined') {
var total = 0, total_tax_amount = 0; var row_total = 0;
for (i = 1; i < (counter+1); i++) {
var shipping = parseFloat($('#shipping').val() ? $('#shipping').val() : 0);
var row = $('#'+i);
var quantity = row.find('.sqft').val(),
product = row.find('.suggestions').val(),
price = row.find('.price').val(),
discount = row.find('.discount').val(),
tax = row.find('.cgst').val(),
subtotal = row.find('.subtotal');
if (quantity && product && price) {
var product_discount = 0, product_tax = 0;
/*if(Site.Settings.product_discount > 0) {
if (discount) {
if (discount.indexOf("%") !== -1) {
var pds = discount.split("%");
if (!isNaN(pds[0])) {
product_discount = formatDecimal((((price) * parseFloat(pds[0])) / 100), 4);
}
} else {
product_discount = formatDecimal(discount, 4);
}
}
}*/
/*if(Site.Settings.default_tax_rate > 0) {
$.each(tax_rates, function () {
if (this.id == tax) {
if (this.type == 1 && this.rate != 0) {
product_tax = formatDecimal((((price) * 28) / 100), 4);
} else {
product_tax = parseFloat(28/100);
}
}
});
}*/
var data = $('#order_tax').val();
if(data == 'incl'){
row_total = parseInt(price) * parseInt(quantity);
}else{
row_total = rate_origin;
}
var totaltax = parseInt(row.find('.cgst').val()) + parseInt(row.find('.sgst').val());
total_tax_amount += totaltax;
subtotal.val(formatMoney(row_total));
total += row_total;
}
}
$('.total_amount').text(formatMoney(total));
console.log("Total Tax Amount : "+total_tax_amount);
$('#order_tax_total').text(formatMoney(total_tax_amount));
if ($('#order_discount').val()) {
order_discount_val = $('#order_discount').val();
if (order_discount_val.indexOf("%") !== -1) {
var pds = order_discount_val.split("%");
if (!isNaN(pds[0])) {
order_discount = formatDecimal((((total) * parseFloat(pds[0])) / 100), 4);
}
} else {
order_discount = formatDecimal(order_discount_val, 4);
}
} else {
order_discount = 0;
}
/*if ($('#order_tax').val()) {
order_tax_val = $('#order_tax').val();
$.each(tax_rates, function () {
if (this.id == order_tax_val) {
if (this.type == 1 && this.rate != 0) {
order_tax = formatDecimal((((total - order_discount) * this.rate) / 100), 4);
} else {
order_tax = parseFloat(this.rate);
}
}
});
} else {
order_tax = 0;
}*/
grand_total = total + shipping;
$('#order_discount_total').text(formatMoney(total));
$('#grand_total').text(formatMoney(grand_total));
}
}
$(document).ready(function() {
$(document).on('click', '[data-toggle="ajax-modal"]', function (e) {
e.preventDefault();
var link = $(this).attr('href');
$.get(link).done(function(data) {
$('#myModal').html(data)
// .append("<script src='"+assets+"js/modal.js' />")
.modal();
});
return false;
});
$(document).on('click', '[data-toggle="modal"]', function (e) {
e.preventDefault();
var tm = $(this).attr('data-target');
$(tm).appendTo('body').modal('show');
return false;
});
$("#addButton").click(function () {
var newTr = $('<tr></tr>').attr("id", counter);
var row_hrml = '';
row_hrml += '<td style="width: 20px; text-align: center; padding-right: 10px;">'+ counter +'</td>';
row_hrml += '<td><input type="text" class="quantity form-control input-sm" name="quantity[]" id="quantity-' + counter + '" value="" style="min-width: 70px; text-align: center;" /></td>';
row_hrml += '<td><div class="input-group"><input type="text" name="product[]" id="product-' + counter + '" value="" class="form-control input-sm suggestions" maxlength="80"><span class="input-group-addon"><i class="fa fa-file-text-o pointer details"></i></span></div><div class="details-con details-con-' + counter + '" style="display:none;"><textarea style="margin-top:5px;padding:5px 10px;height:60px;" class="form-control" name="details[]" id="details-' + counter + '" maxlength="255"></textarea></div></td>';
row_hrml += '<td><input type="text" name="price[]" id="price-' + counter + '" value="" class="price form-control input-sm text-right" style="min-width: 100px;"></td>';
if (Site.Settings.product_discount == 1) {
row_hrml += '<td><input type="text" name="discount[]" id="discount-' + counter + '" value="" class="discount form-control input-sm"></td>';
}
if (Site.Settings.default_tax_rate == 1) {
row_hrml += '<td><select class="tax form-control input-sm" style="min-width: 100px;" name="tax_rate[]" id="tax_rate-' + counter + '">';
$.each(tax_rates, function () {
row_hrml += '<option value="'+ this.is +'">'+ this.name +'</option>';
});
row_hrml += '</select></td>';
}
row_hrml += '<td><input type="text" name="subtotal[]" readonly id="subtotal-' + counter + '" value="" class="subtotal form-control input-sm text-right" tabindex="-1"></td>';
newTr.html(row_hrml);
newTr.appendTo("#dyTable");
counter++;
$("form select").chosen({no_results_text: "No results matched", disable_search_threshold: 5, allow_single_deselect:true, width: '100%'});
suggestions();
});
$("#removeButton").click(function () {
if (counter <= no_of_rows) {
alert(lang.not_allowed);
return false;
}
counter--;
$("#"+counter).remove();
});
$( "#customer" ).change(function () {
if($(this).val() == 'new')
$('#customerForm').slideDown('100');
else
$('#customerForm').slideUp('100');
});
$(document).on ('blur', '.suggestions', function() {
var row = $(this).closest('tr');
var v = $(this).val();
var q = row.find('.quantity');
var qv = row.find('.quantity').val();
if (qv.length == 0 && v.length != 0 ) {
$(q).val(1).change();
}
});
$(document).on('click', '.details', function(){
$(this).parents('.input-group').next('.details-con').toggle();
});
$(document).on('change', '#shipping, #order_discount, #order_tax, .quantity, .price, .discount, .tax', function() {
calculateTotal();
});
$(".notes").autocomplete({
source: Site.base_url+'sales/notes',
minLength: 2,
autoFocus: false,
delay: 500,
response: function (event, ui) {
if (ui.content.length == 1 && ui.content[0].id != 0) {
ui.item = ui.content[0];
$(this).val(ui.item.label);
$(this).removeClass('ui-autocomplete-loading');
}
},
});
$("form select").chosen({no_results_text: "No results matched", disable_search_threshold: 5, allow_single_deselect:true, width: '100%'});
$( ".datetime" ).datetimepicker({format: Site.dateFormats.js_ldate, autoclose: true, weekStart: 1, showMeridian: true, todayBtn: true});
$( ".date" ).datetimepicker({format: Site.dateFormats.js_sdate, autoclose: true, todayBtn: true, minView: 2});
$('.modal').on('show.bs.modal', function (e) {
$( ".datetime" ).datetimepicker({format: Site.dateFormats.js_ldate, autoclose: true, weekStart: 1, showMeridian: true, todayBtn: true});
$( ".date" ).datetimepicker({format: Site.dateFormats.js_sdate, autoclose: true, todayBtn: true, minView: 2});
})
suggestions();
setTimeout(function(){ calculateTotal(); }, 1000);
});
JavaScript(Error Section): custom.js
$(document).on ('blur', '.suggestions', function() {
var row = $(this).closest('tr');
var v = $(this).val();
var q = row.find('.quantity');
var qv = row.find('.quantity').val();
if (qv.length == 0 && v.length != 0 ) {
$(q).val(1).change();
}
});
Error Msg:
http://[::1]/RDS/smgp-invoice/themes/default/assets/js/custom.js:481
Uncaught TypeError: Cannot read property 'length' of undefined
at HTMLInputElement. (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/custom.js:481)
at HTMLDocument.dispatch (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/jquery.js:3074)
at HTMLDocument.elemData.handle (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/jquery.js:2750)
at Object.trigger (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/jquery.js:2986)
at Object.simulate (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/jquery.js:3301)
at HTMLDocument.handler (http://[::1]/RDS/smgp-invoice/themes/default/assets/js/jquery.js:3552)
I dont know what really to do??
any Possible solutions??
Thanks in advance...
I have a datepicker. I want to increment the date by 1 day as mouse wheel up is fired and decrement the date by 1 day as mouse wheel down is fired (upto the minimum possible date).
Below is my code snippet:
HTML
<input type="text" id="txtFromDate" class="calender"/>
JS
$(document).ready(function(){
$("#txtFromDate").datepicker({
minDate: new Date()
});
$("#txtFromDate").datepicker("setDate", new Date()); });
$('.calender').bind('mousewheel DOMMouseScroll', function (event) {
$id = $(this).attr('id');
$minDate = $('#' + $id).datepicker("option", "minDate");
$minDate = ($minDate.getMonth() + 1) + "/" + $minDate.getDate() + "/" + $minDate.getFullYear();
$datePickerDate = $('#' + $id).datepicker("getDate");
$datePickerDate = ($datePickerDate.getMonth() + 1) + "/" + $datePickerDate.getDate() + "/" + $datePickerDate.getFullYear();
var days = parseInt("1", 10);
if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
$datePickerDate = new Date($datePickerDate);
$datePickerDate = $datePickerDate.setDate($datePickerDate.getDate() + days);
}
else {
if ($datePickerDate >= $minDate && $('#' + $id ).val() != "") {
$datePickerDate = new Date($datePickerDate);
$datePickerDate = $datePickerDate.setDate($datePickerDate.getDate() - days);
}
}
alert($datePickerDate);
$('#' + $id).val($datePickerDate);
$('#' + $id).datepicker("setDate", $datePickerDate);
});
But the $datePickerDate value is coming to be as 1464028200000.
Here is the Non-Working Demo
What am I doing wrong?
I have the following script for selecting calendar days from a drop down list:
http://jsfiddle.net/nachosarmiento/XPj58/3/
$(document).ready(function () {
var calendario = new Date();
var una_noche = new Date();
var dos_noches = (new Date()).setDate(una_noche.getDate() + 1);
var tres_noches = (new Date()).setDate(una_noche.getDate() + 2);
var cuatro_noches = (new Date()).setDate(una_noche.getDate() + 3);
var cinco_noches = (new Date()).setDate(una_noche.getDate() + 4);
var atras = (new Date()).setDate(una_noche.getDate() - 1);
var dates;
var dates_in_string = '';
$('#simpliest-usage').multiDatesPicker({
disabled: true,
addDates: [una_noche]
});
$("#dias").on("change", function () {
$('#simpliest-usage').multiDatesPicker('resetDates', 'picked');
$('#simpliest-usage').multiDatesPicker('resetDates', 'disabled');
if ($("#dias").val() == "1") {
$('#simpliest-usage').multiDatesPicker({
disabled: true,
addDates: [una_noche]
});
dates = $('#simpliest-usage').multiDatesPicker('getDates');
dates_in_string = '';
for (var a in dates) dates_in_string += dates[a] + ' ';
alert(dates_in_string);
}
if ($("#dias").val() == "2") {
$('#simpliest-usage').multiDatesPicker({
disabled: true,
addDates: [una_noche, dos_noches]
});
dates = $('#simpliest-usage').multiDatesPicker('getDates');
dates_in_string = '';
for (var b in dates) dates_in_string += dates[b] + ' ';
alert(dates_in_string);
}
if ($("#dias").val() == "3") {
$('#simpliest-usage').multiDatesPicker({
addDates: [una_noche, dos_noches, tres_noches],
minDate: "una_noche"
});
dates = $('#simpliest-usage').multiDatesPicker('getDates');
dates_in_string = '';
for (var c in dates) dates_in_string += dates[c] + ' ';
alert(dates_in_string);
}
if ($("#dias").val() == "4") {
$('#simpliest-usage').multiDatesPicker({
addDates: [una_noche, dos_noches, tres_noches, cuatro_noches],
minDate: "una_noche"
});
dates = $('#simpliest-usage').multiDatesPicker('getDates');
dates_in_string = '';
for (var d in dates) dates_in_string += dates[d] + ' ';
alert(dates_in_string);
}
if ($("#dias").val() == "5") {
$('#simpliest-usage').multiDatesPicker({
addDates: [una_noche, dos_noches, tres_noches, cuatro_noches, cinco_noches],
minDate: "una_noche"
});
dates = $('#simpliest-usage').multiDatesPicker('getDates');
dates_in_string = '';
for (var e in dates) dates_in_string += dates[e] + ' ';
alert(dates_in_string);
}
});
});
It works perfect with jQuery 1.7.2, but when I want to use jQuery 1.9.1 stops working.
Anyone know the reason for this problem?
PD: Official site: http://multidatespickr.sourceforge.net/
Thank you.
Greetings.
jQuery 1.9 removed the $.browser object.
See this page about the jQuery "Migrate" plugin.