I use Bootstrap date paginator. I really can't figure out by myself how to enable datepicker to allow select a date. Calendar is shown but the date selection is disabled.
The initialization code is.
var options = {
selectedDate: $('#selected-date').html(),
selectedDateFormat: 'YYYYMMDD',
onSelectedDateChanged: function (event, date) {
$('#selected-date').html(moment(date).format('YYYYMMDD'));
disableDatePaginator();
$('#log-table').DataTable().ajax.reload(function(json){ enableDatePaginator(); });
},
};
$('#date-paginator').datepaginator(options);
I tried $('#date-paginator').datepaginator(options).datepicker(); with no success.
Finally I found the reason of the issue. It's necessary to specify valid startDate and endDate in options for date paginator like this.
var options = {
startDate: moment(new Date(2000, 1, 1)),
endDate: moment(new Date(2100, 1, 1)),
selectedDate: $('#selected-date').html(),
selectedDateFormat: '{{date_format}}',
onSelectedDateChanged: function (event, date) {
$('#selected-date').html(moment(date).format('{{date_format}}'));
disableDatePaginator();
$('#log-table').DataTable().ajax.reload(function(json){ enableDatePaginator(); });
},
};
Related
After inline edit is cancelled, the date column comes back as undefined instead of restoring the original value. Column is defined as following (dates are coming in 1970-01-01 format):
{name:'Release<br>Date',index:'Street_Date', sorttype:"date", width:70,
formatter: function (cellvalue, options, rowObject) {
return cellvalue === ('1970-01-01') ? "" : $.fn.fmatter.call(this, "date", cellvalue, options, rowObject);
},
formatoptions: {newformat:'d M y'},
editable:true,
editoptions: {
size:9,
dataInit: function(el, options) {
$(el).datepicker({
dateFormat: "d M y",
defaultDate: '01 Jan 70',
onSelect: function(dateText, inst) {
}
});
}
},
searchoptions: {
sopt: ['eq','ne','ge','le'],
dataInit: function (elem) {
$(elem).datepicker({ showButtonPanel: true, dateFormat: 'yy-mm-dd' })
}
}
},
The inline edit is setup as following:
ondblClickRow: function (rowid) {
var savedRows = $grid.jqGrid("getGridParam", "savedRow");
if (savedRows.length > 0 && savedRows[0].id !== rowid) {
// cancel editing
$grid.jqGrid("restoreRow", savedRows[0].id);
}
if (savedRows.length === 0) {
$grid.jqGrid("editRow", rowid, editOptions);
}
}
When Grid is loaded, the date shown like 07 Aug 18, entering the inline editing by double click, the date is still 07 Aug 18. After cancelling the edit either by clicking away or clicking Cancel button, date becomes NaN undefined N. After refresh, it comes back correctly though.
How to preserve the correct date after cancelling editing?
Grid behaves correctly with formatter: date
free jqGrid v jqGrid 4.13.5
Maybe the author of free-jqGrid will help better, but I would recommend you to add additional parameter (action='edit') when the formatter is called. Code below:
formatter: function (cellvalue, options, rowObject) {
return cellvalue === ('1970-01-01') ? "" : $.fn.fmatter.call(this, "date", cellvalue, options, rowObject, "edit");
},
Note the last parameter in $.fn.fmatter.call
UPDATE
This is working in my tests.
Since you use a custom date fomatter it is needed the value in savedRows to be unformated in order to be saved correct. In case of default formatter = date this is done automatically.
Below is the code that can be used, suppose you know the index of the field in colModel:
ondblClickRow: function (rowid) {
var savedRows = $grid.jqGrid("getGridParam", "savedRow");
if (savedRows.length > 0 && savedRows[0].id !== rowid) {
// cancel editing
savedRows[0].Release_Date = $.unformat.date.call($grid[0], savedRows[0].Release_Date, $grid[0].p.colModel[1]);
$grid.jqGrid("restoreRow", savedRows[0].id);
}
if (savedRows.length === 0) {
$grid.jqGrid("editRow", rowid, editOptions);
}
}
I am using DatePicker of NativeBase and want to change the format of the displayed date after picking a date. I am unable to find a relevant prop due to lack of docs.
Is there a way I could change the format of the date as in DatePickerAndroid using format="YYYY-MM-DD"?
Fixed in native-base v2.6.1 onwards.
<DatePicker
formatChosenDate={date => {return moment(date).format('YYYY-MM-DD');}}
..... />
Try this:----
async onPressAction() {
try {
const {action, year, month, day} = await DatePickerAndroid.open({
// Use `new Date()` for current date.
// May 25 2020. Month 0 is January.
date: new Date(2018, 6, 26)
});
if (action !== DatePickerAndroid.dismissedAction) {
// Selected year, month (0-11), day
var date = new Date(year, month, day);
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
console.log('>>>>>>>>>>>>>'+year);
console.log('>>>>>>>>>>>>>'+month);
console.log('>>>>>>>>>>>>>'+day);
console.log(year+'-'+month+'-'+day);
}
} catch ({code, message}) {
console.warn('Cannot open date picker', message);
}
}
Looking to query against the date only anyone encountered this?
Sample code:
////MODEL
module.exports = {
attributes: {
date: {
type: 'date',
required: true
}
}
};
////CONTROLLER
var today = moment().toISOString();
var queryObj = { date: today };
var newDay = { date: today };
Day.findOrCreate(queryObj, newDay).exec(function(err, day) {
console.log(day)
});
Obviously this creates a new record on each refresh, as the iso string will change with each passing second.
Thanks for the help!
Instead of querying for a single date, you can query for a date range that includes all of today. First, you'll need to actually create values for that range--I whipped this up using Moment, but there's probably a better way:
var begin = moment(moment().format("YYYY-MM-DD")).toISOString();
var end = moment(moment().format("YYYY-MM-DD")).add(1, 'days').toISOString();
Then you can use query operators to search the range:
var queryObj = {date: {'>=': begin, '<': end}};
Day.findOrCreate(queryObj, newDay).exec(function(err, day) {
console.log(day)
});
As always, be mindful of time zone issues!
I want to compare date from MongoDB and my date.
Also i read this and this post and I did not find an answer.
My Code :
today: function() {
var today = moment().format();
return Posts.find({createdAt : { $gte : today}}) // show posts created in "future" , so this function must return nothing
},
createdAt = moment().format();// in MongoDB
As a result this construction doesn't work, but if i compare lie this :
var today = moment().format();
var daystart = moment().startOf('day').format();
if (daystart > today){
console.log ("YES");
}
else if (daystart < today)console.log ("NO");
Return
"NO"
Anybody help ?
EDIT :
today: function() {
var today = moment().toDate();
var daystart = moment().startOf('day').toDate();
// console.log(today + daystart);
return Posts.find({createdAt : { $gt : today}})
},
week: function() {
var today = new Date();
return Posts.find({createdAt : { $lt : today}})
},
month: function() {
var today = new Date();
return Posts.find({createdAt : { $ne : today}})
}
createdAt = new Date();
The .format() method is a display helper function which returns the date string representation based on the passed token argument. To compare the date from MongoDB with the the current date and time, just call moment() with no parameters, without the .format() method and get the native Date object that Moment.js wraps by calling the toDate() method:
today: function() {
var now = moment().toDate();
return Posts.find({createdAt : { $gte : now }});
}
Convert date to MongoDB ISODate format in JavaScript using Moment JS
MongoDB uses ISODate as their primary date type. If you want to insert a date object into a MongoDB collection, you can use the Date() shell method.
You can specify a particular date by passing an ISO-8601 date string with a year within the inclusive range 0 through 9999 to the new Date() constructor or the ISODate() function. These functions accept the following formats:
new Date("<YYYY-mm-dd>") returns the ISODate with the specified date.
new Date("<YYYY-mm-ddTHH:MM:ss>") specifies the datetime in the client’s local timezone and returns the ISODate with the specified datetime in UTC.
new Date("<YYYY-mm-ddTHH:MM:ssZ>") specifies the datetime in UTC and returns the ISODate with the specified datetime in UTC.
new Date() specifies the datetime as milliseconds since the Unix epoch (Jan 1, 1970), and returns the resulting ISODate instance.
If you are writing code in JavaScript and if you want to pass a JavaScript date object and use it with MongoDB client, the first thing you do is convert JavaScript date to MongoDB date format (ISODate). Here’s how you do it.
var today = moment(new Date()).format('YYYY-MM-DD[T00:00:00.000Z]');
console.log("Next day -- " + (reqDate.getDate() + 1))
var d = new Date();
d.setDate(reqDate.getDate() + 1);
var tomorrow = moment(d).format('YYYY-MM-DD[T00:00:00.000Z]');
You can pass today and tomorrow object to MongoDB queries with new Date() shell method.
MongoClient.connect(con, function (err, db) {
if (err) throw err
db.collection('orders').find({ "order_id": store_id, "orderDate": {
"$gte": new Date(today), "$lt": new Date(tomorrow)}
}).toArray(function (err, result) {
console.log(result);
if (err) throw err
res.send(result);
})
})
I have used two date controls to filter a row repeater as,
oF_cell5 = new sap.ui.commons.layout.MatrixLayoutCell({id:"F05",colSpan : 2});
var oCreateFrom = new sap.ui.commons.DatePicker("EV_AE_DATE1",
{width:"150px",placeholder:"Created From",
change:function(oEvent){
oController.onChangeFilterValue(oEvent);}
})
oF_cell51 = new sap.ui.commons.layout.MatrixLayoutCell({id:"F051",colSpan : 2});
var oCreateTill = new sap.ui.commons.DatePicker("EV_AE_DATE2",
{width:"150px",placeholder:"Created Till",
change:function(oEvent){
oController.onChangeFilterValue(oEvent);}
});
Now i have a rowrepeater in which one of the column is CreatedOn date like..,,
new sap.m.HBox({
items:[new sap.ui.commons.TextView({text:"Created on:"}),
new sap.ui.commons.TextView("TV11")
.bindProperty("text",
{
path: "CM_EventList>CREATEDON",
type: new sap.ui.model.type.Date({pattern:"MMM dd, yyyy",
source : {pattern : "dd.MM.yyyy"}})
})]
}),
And in the controller i have written this code as....,,
onInit: function() {
var model = new sap.ui.model.json.JSONModel("eventlist.json");
model.setData();
sap.ui.getCore().setModel(model,"CM_EventList");
},
onChangeCmFilterValue : function(oEvent){
var CM_FDATEVAL = sap.ui.getCore().byId("EV_AE_DATE1").getValue();
var CM_TDATEVAL = sap.ui.getCore().byId("EV_AE_DATE2").getValue();
var CM_Date = new sap.ui.model.Filter('CM_EventList>CREATEDON',
sap.ui.model.FilterOperator.BT,CM_FDATEVAL,CM_TDATEVAL);
var oCM_VBOX1 = sap.ui.getCore().byId("EV_CM_VBOX");
var oCM_RR1 = sap.ui.getCore().byId("EV_AE_ROWREPEATER");
oCM_RR1.bindRows('CM_EventList>/eventlist',oCM_VBOX1,null,[CM_Date]);
},
And the eventlist is my seperate json file which has date values as
{
"eventlist": [
{
"CREATEDON": "10.07.2014",
},
{
"CREATEDON": "10.08.2014",
},
.......
and so on..........
Now if select a date range from my date controls then the row repeater should show the records which are between the range of dates as in my json.
But the filter is not working.
Please Help me on this.
Thanks
Sathish
First of all, use the DatePicker Control for date fields in your view if you aren't using it already.
You can obtain the value of your date picker as a Date object using the method GetDateValue(). You can then use these date objects to create a filter for a datetime field of your data model.
var dateFrom = this.getView().byId("filterDateFrom").getDateValue();
var dateTo = this.getView().byId("filterDateTo").getDateValue();
if (dateFrom != null && dateTo != null) {
filter = new sap.ui.model.Filter(
"CM_EventList>CREATEDON",
sap.ui.model.FilterOperator.BT,
dateFrom,
dateTo
);
}
By the way: Note that both date objects will actually represent the moment at the beginning of the day (0:00:00) while the timestamps in your database will often be some point in time throughout the day. So when you want to search between two dates inclusively, you need to add one day to dateTo:
dateTo.setDate(dateTo.getDate() + 1);
Another problem you might or might not have to deal with are timezones... and of course all the other falsehoods programmers believe about time.
I think you should check the value of the following. The format should be different than your json value "CREATEDON": "10.08.2014".
var CM_FDATEVAL = sap.ui.getCore().byId("EV_AE_DATE1").getValue();
var CM_TDATEVAL = sap.ui.getCore().byId("EV_AE_DATE2").getValue();
Please try create a DatePicker with:
type: new sap.ui.model.type.Date({pattern: ""yyyy-MM-dd""})
Edit: to use Date as filter
var CM_FDATEVAL_DATE = new Date(sap.ui.getCore().byId("EV_AE_DATE1").getValue());
var CM_TDATEVAL_DATE = new Date(sap.ui.getCore().byId("EV_AE_DATE2").getValue());
Regards,
Allen