formatting dijit.form.DateTextBox - dojo

I am working with the Dojo dijit.form.DateTextBox widget.
My customer would like to display the dates as dd-MMM-yyyy (13-Dec-2012). This is not a problem. However, he would like to be able to use the keyboard to make entries using ddMMyyyy format. Anyone know how to do this?

how about setting the constraints-property of the dijit.form.DateTextBox like that when instaciationg it:
var dateTextBox = new dijit.form.DateTextBox({
value: new Date(), // or what ever
constraints: {datePattern: 'ddMMyyyy'}
});

Related

How to add working query box to portfolioitemstreegrid app

We wanted to use the portfolioitemstreegrid(https://github.com/RallySoftware/app-catalog/tree/master/src/apps/portfolioitemstreegrid) app since there was an issue with the old PortfolioDrilldownApp. we were able to add the edit app setting options by adding:
getSettingsFields: function () {
var fields = this.callParent(arguments);
fields.push({
type: 'query'
});
return fields;
},
but that doesn't filter anything it just shows the box.
What do we need to add to get the query box to work. The app has a filter already but it isn't flexible enough for us to run the queries we need.
I hoped too that doing something like this will allow wiring up of query into the treegrid filter, but it does not work. There is no storeConfig on a treegrid:
if (this.getSetting('query')) {
config.storeConfig.filters = [Rally.data.QueryFilter.fromQueryString(this.getSetting('query'))];
}
In a month or so a new hierarchical tree grid app will become available, and it will take a query from the app settings dialog. I would not suggest extending this portfolioitemstreegrid, also because it is using the head (unstable) version 'x' of AppSDK2.

Bootstrap DatePicker setDate method not updating calendar

I'm setting the value of a bootstrap datepicker by making use of the setValue method provided.
For example
tripToDatePicker.setValue(tripFromDatePicker.date);
But for some reason the calendar is not updated
'setValue' is replaced by 'setDate'.
Using a string as input for setDate can be tricky. It has to match with the dateformat, else you can get unexpected results. It is more safe to create a 'new Date(y,m,d)' from your input, e.g. new Date(2015,3,10) for '10 Apr 2015'. This will always work.
When using a date representation in seconds, e.g. 1428659901, then use 'new Date(value*1000)'. Note that datepicker will eat any value here, but only show the selected date in the calendar if hours, minutes and seconds are equal to 0. Took me a while to figure that out....
Edit:
http://www.eyecon.ro/bootstrap-datepicker/ is not much documented, you should try http://eternicode.github.io/bootstrap-datepicker/.
anyway the code below will work for you
$("#dp1").datepicker("update", "02-16-2012");
or
$("#dp1").datepicker("setValue", "02-17-2012");
where "#dpi" is the id of the text field on whcih datepicker is used.
After trying many things, I ended up using "update" method. The $("#dp1").datepicker("update", "02-02-2012") or $("#dp1").datepicker("update", "02/02/2012") works for me. Surprisingly no document about this method at author website. Thanks.

Bootstrap datepicker toggle disable

I am using bootstrap-datepicker and getting an issue.
When I click a day, it works well,but when I click the same day again. The selection gets cancelled
The boostrap datepicker demo works well.
I had found the example for bootstrap date picker from the above link.
It's a known issue. Here is a workaround for this issue.
https://github.com/eternicode/bootstrap-datepicker/issues/816
jsfiddle the issue: http://jsfiddle.net/antonkruger/fpgseobz/
Once I've tried it, I'll post an update.
Update:
Yes it works.
In the defaults # line 1394, add a new option, allowDeselection
var defaults = $.fn.datepicker.defaults = {
allowDeselection: false,
...
};
In the _toggle_multidate function # line 1015, modify the "else if (ix !== -1)" statement to:
else if (ix !== -1 && this.o.allowDeselection){
this.dates.remove(ix);
}
I came across this issue myself so if you still need this. trick is to store the current date in a variable each time a new date is created. If the new date is undefined (empty) update date with the temporary variable. I know its a dirty solution, but hey atleast its working.
I wrote a little fiddle enter code herehttp://jsfiddle.net/d86msex1/
Goodluck!
There's now an official way to accomplish this:
$element.datepicker('remove');
source: http://bootstrap-datepicker.readthedocs.org/en/release/methods.html#remove

Disable Validation in Dojo datetextbox

Is there a way to turn off or disable client site validation in dojo's form widget datetextbox. I would like users to be able to type the date in if they want and support most common date formats
Your question is not quite clear at "disable client site validation". If I understand you correct, you are asking to be able input any value manually and also be able to use date dropdown pickup.
There is an _isInvalidDate method you can try to overwrite like:
new DateTextBox({
value: "31-DEC-2009",
name: "oracle",
_isInvalidDate: function(){return false;}
onChange: function(v){ }
}, "oracle");
Since this is an internal(private) method, it is not suggested but may work.
There is another method you can feel free to overwrite to use your own validation Regexp in constrints:
validator: function(/*anything*/ value, /*__Constraints*/ constraints){

FilteringSelect text alignment

Using Dojo 1.6.1
I have a FilteringSelect that looks like:
When an address is selected, it looks like:
What I'd really like to see instead is:
Any ideas on how this could be accomplished?
When you select a value in a Filtering select, the caret position is at the end of the text, so it's not CSS that will help you there.
You have to move the cursor to the beginning of the text.
I see no other option than javascript here.
If you look at the template of dijit.form.FilteringSelect, you will see that the input node is bound to the property "focusNode" of the widget. So you could use that to move the caret, like this :
dijit.byId('your_filteringSelect_id').onChange = function(evt) {
this.focusNode.setSelectionRange(0,0);
}
This appears to be an IE & FF issue see this listed bug:
http://bugs.dojotoolkit.org/ticket/8298
and also this test case (issue seen in IE7-9):
http://jsfiddle.net/snover/96Ud8/
The work around suggested is to set the function _setCaretPos to do notthing e.g
dijit.byId('your_filteringSelect_id')._setCaretPos = function() {};
.setSelectionRange doesn't work at IE
Use dijit.selectInputText(widget.focusNode,0,0); instead