change the format of date range input component - javascript

How to change the format of date range input component in pentaho cde.i am getting the format 'yyyy-mm-dd' but i need to change into 'dd-M-yy'.i have return a function under post execution section :
function()
{
var date1 = Dashboards.getParameterValue("parfromDate").toString();
var date2 = Dashboards.getParameterValue("partoDate").toString();
//alert(date1)
//alert(date2)
format = $.datepicker.formatDate("dd-M-yy",new Date(date1));
format2 = $.datepicker.formatDate("dd-M-yy",new Date(date2));
document.getElementById('render_SelectDate').value=format:format2;
}
the same function was working perfect in date input component but i m facing problem in date range component can any one suggest me where i m doing wrong ..

Finally i have solved my issue as per need .Also i have mentioned my script which i am using right now:
function f(){
var date1 = Dashboards.getParameterValue("date_param").toString();
testdate = $.datepicker.formatDate("d-M-y",new Date(date1));
//alert(testdate);
document.getElementById('render_date_picker').value=testdate;
}

**This code also work as charm for Date Range Component**
function f(){
var date1 = Dashboards.getParameterValue("param1_FromDate").toString();
var date2 = Dashboards.getParameterValue("param2_ToDate").toString();
testdate = $.datepicker.formatDate("d-M-y",new Date(date1))+">"+ $.datepicker.formatDate("d-M-y",new Date(date2));
alert(testdate);
document.getElementById('render_date_range_picker').value=testdate;
}

Related

Default date range with lightpicker.js and moment.js

How can I get the following codepen to default to showing all the data. I currently defaults to 21/11/2019 - 28/11/2019. If I change the range to 01/11/2019 - 30/11/2019 it shows all the data. I'm using lightpicker.js and moment.js. Thank you.
UPDATE: What I'm trying to do is show all the data with nothing in the Date Range. Just page defaulting to show everything with no filters. Then I should be able to filter if I choose dates in the Date Range. When I comment out the line picker.setDateRange(new Date(), moment().add(7, 'day')); It show blank text box for the Date Range but no data is shown.
JS
var picker = new Lightpick({
field: document.getElementById('datepickerA'),
singleDate: false
});
picker.setDateRange(new Date(), moment().add(7, 'day'));
$scope.onOkA = function(){
var startDate = picker.getStartDate().format('MM/DD/YYYY')
var endDate = picker.getEndDate().format('MM/DD/YYYY')
if(startDate && endDate){
$scope.filteredTicketA = $scope.ticketsA.filter(ele=>{
return (new Date(ele.Date)-new Date(startDate)>=0) && (new Date(ele.Date)-new Date(endDate)<=0)
})
}
}
new Date() will default to today, if you want it be 01/11/2019 then use new Date(2019,11-1, 1).
However I would use some constants to make code clearer, replace picker.setDateRange() sentence with these 3 lines:
var startDate = new Date(2019,11-1, 1); // be aware that month is 0 based.
var endDate = moment(startDate).endOf('month');
picker.setDateRange(startDate, endDate);
as a quick solution for onOKA(){} I would change this:
var defaultStartDate = moment(new Date(1, 10, 2019));
var startDate = (pickerB.getStartDate() || defaultStartDate).format('MM/DD/YYYY');

JavaScript invalid date from DateTime Picker

I have a function that will create two dates using the result of an input with Bootstrap DateTime Picker and I need to compare both of them.
But my first value (rtime) always gives an invalid date. Where am I wrong?
Note: stime is not editable, the user only uses the DateTime Picker for rtime field.
var stime = '28/11/2017 09:18:52';
var rtime = '04/12/2017 10:16:34';
var lastReturn = new Date(rtime);
var lastOut = new Date(stime);
if (lastReturn >= lastOut) {
console.log("This date is after than the other!");
}
console.log(rtime);
console.log(stime);
console.log(lastReturn);
console.log(lastOut);
This result shows that LastOut is an invalid date:
The format must be month/day/year, not day/month/year
That why you get invallid date on 28/11/2017 09:18:52 because there isn't a 28th month.
console.log(new Date('28/11/2017 09:18:52'))
console.log(new Date('11/28/2017 09:18:52'))
The dates you're picking are probably Month/Day/Year. But your expected date is Day/Month/Year. For example, the date 04/12/2017 is returning April 12th instead of December 4th. You can use a regex on your string to replace and make it in the correct format.
Please check this snippet:
var stime = "28/11/2017 09:18:52" //$("#movesend").val();
var rtime = "04/12/2017 10:16:34" //$("#moveretorna").val();
function parseDate(dateString) {
return dateString.replace( /(\d{2})\/(\d{2})\/(\d{4})/, "$2/$1/$3");
}
var lastReturn= new Date(parseDate(rtime));
var lastOut= new Date(parseDate(stime));
if(lastReturn>= lastOut)
{
console.log("This date is after than the other!");
}
console.log(stime);
console.log(rtime);
console.log(lastReturn);
console.log(lastOut);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
You need to convert your date from DD/MM/YYYY HH:MM:SS format to MM/DD/YYYY HH:MM:SS format.
For conversion, you can use string#replace.
var stime = '28/11/2017 09:18:52';
var rtime = '04/12/2017 10:16:34';
stime = stime.replace(/(..)\/(..)\/(.*)/, '$2/$1/$3');
rtime = rtime.replace(/(..)\/(..)\/(.*)/, '$2/$1/$3');
var lastReturn = new Date(rtime);
var lastOut = new Date(stime);
if (lastReturn >= lastOut) {
console.log("This date is after than the other!");
}
console.log(rtime);
console.log(stime);
console.log(lastReturn);
console.log(lastOut);

Datetime diff in minutes

I have 2 DateTime field in a form, and I want the difference between these 2 fields in minute.
I tried to parse DateTime into Date but it's not working :
<script>
$(document).ready(function () {
$("#mybundle_evenement_button").click(function () {
var field1 = $("#mybundle_evenement_debut").val();
var field2 = $("#mybundle_evenement_fin").val();
var date1 = new Date(field1);
var date2 = new Date(field2);
alert(date1);
});
});
</script>
If I alert() date1, it shows Invalid Date.
But if I alert() field1, it shows 15/09/2017 13:32 (format is : days/months/year hour:minutes).
Is it possible that new Date(field1) isn't working because of the format ?
I know that if I succeed to parse DateTime into Date, it'll be easy to have the difference in minutes, but I don't understand why it says Invalid Date.
dd/MM/yyyy HH:mm isn't a valid date format for Date.parse()
You have to format your date to a valid Date Time String Format, for example:
var field1 = $("#mybundle_evenement_debut").val();
var ISODate1 = field1.replace(/(\d+)\/(\d+)\/(\d+)/, "$3-$2-$1")
var date1 = new Date(ISODate1);
alert(date1) // => Fri Sep 15 2017 13:32:00 ...
The problem is about the format you are getting the date from the field. new Date() don't accepts this format. I think the best is to parse the string yourself. If the format is always the same just use new Date(year, month, day, hours, minutes, seconds, milliseconds).
var day = field.splice(0,2); field.splice(0,1);
var month = field.splice(0,2); field.splice(0,1);
var year = field.splice(0,2); field.splice(0,1);
var hour = field.splice(0,2); field.splice(0,1);
var minute = field.splice(0,2);
It's depend on your browser. I'll suggest to use the standard format is '2013/12/09 10:00'.
Okay! come to the point. You need to manually format the date from my latest answer regarding this same kind of issue. Please take a look at this link : Stange javascript Date behaviour on particular dates
And you could try this below code for getting the date difference in minutes.
var startTime = new Date('2013/12/09 10:00');
var endTime = new Date('2014/12/09 10:00');
var difference = endTime.getTime() - startTime.getTime();
var result = Math.round(difference / 60000);
alert(result);

How to include multiple conditions in afterEQ in rome js calendar?

In Rome, I would like to include multiple conditions, in my second calendar, that it would disallow dates that are earlier than today AND disallow dates that are earlier than what was chosen in first calendar.
var today = moment().format();
var startDate = rome(startDateElem, {dateValidator : rome.val.afterEq(today)});
var endDate = rome(endDateElem, {dateValidator : rome.val.afterEq([startDateElem,
today])});
I could specify default value to start date (today), but is there any other way?
your code should be like this:
var moment = rome.moment;
var today = moment().format();
var startDate = rome(startDateElem, {dateValidator : rome.val.afterEq(today)});
var endDate =rome(endDateElem, {dateValidator:function(d){
var m = moment(d);
var startD=rome(startDateElem).getDate();
if(startD){
return m.isAfter(today)&& m.isAfter(startD);
}else{
return m.isAfter(today)
} }
});
this a working demo that can help you

Jquery date difference

I have this code for calculating date difference (without weekends) between two input fields, and printing the difference in days in a third text box. The date format is yy-mm-dd (because of mysql).
<script type="text/javascript">
$("#vazi_od, #vazi_do").change(function() {
var d1 = $("#vazi_od").val();
var d2 = $("#vazi_do").val();
var minutes = 1000*60;
var hours = minutes*60;
var day = hours*24;
var vazi_od1 = getDateFromFormat(d1, "yy-mm-dd");
var vazi_do1 = getDateFromFormat(d2, "yy-mm-dd");
var newvazi_od=new Date();
newvazi_od.setFullYear(vazi_od1.getYear(),vazi_od1.getMonth(),vazi_od1.getDay());
var newvazi_do=new Date();
newvazi_do.setFullYear(vazi_do1.getYear(),vazi_do1.getMonth(),vazi_do1.getDay());
var days = calcBusinessDays(newvazi_od,newvazi_do);
if(days>0)
{ $("#razlika").val(days);}
else
{ $("#razlika").val(0);}
});
</script>
But, when i pick the start and the end date, nothing happens in the field that should show the difference in days... Any help?
You are using setFullYear to pass all the date params...
setFullYear is just for setting the year part of the date..
Use
var newvazi_od=new Date(vazi_od1.getYear(),vazi_od1.getMonth(),vazi_od1.getDay());
var var newvazi_do=new Date(vazi_do1.getYear(),vazi_do1.getMonth(),vazi_do1.getDay());
Also to use getDateFromFormat and calcBusinessDays you need to include the date library from the javascript toolbox

Categories