How to get internal value of Dojo DateTextBox widget? - javascript

I have a dijit/form/DateTextBox on a form, from which I need to get the internal hidden value (formatted as yyyy-MM-dd) and add that to the URL for an AJAX request.
How do I do this? Will any single method of DateTextBox give me that value?
My HTML for the field is:
<input id="ialFromDate">
I'm creating the widget with a fixed display format with this javascript:
var fDate1=new DateTextBox({constraints:{datePattern:'dd/MM/yyyy'}},'ialFromDate');
fDate1.startup();
If I use the browser UI to set the value to 1 September 2015, it displays as "01/09/2015", and there's a hidden input element with the value "2015-09-01", as expected.
I want to get the exact value of that hidden input element.
I've used the following code for testing:
var date1=fDate1.get('value');
console.log('date1='+date1);
And the console output is:
date1=Tue Sep 01 2015 00:00:00 GMT+1000 (AUS Eastern Standard Time)
This is not what I need, and not what I'd expect.

This seems to be the easiest way to get the date value in the desired format:
var date1=fDate1.valueNode.value;
It works, though I couldn't find any mention of valueNode in the Dojo documentation for dijit/form/DateTextBox.
Someone else posted this solution as either an answer or a comment to my question several hours ago, but that seems to have since been deleted.

You can try fDate1.valueNode.value. fDate1 is the DateTextBox Object which contains this hidden DOM Node(fDate1.valueNode). If you get the value of that hidden DOM Node you can have the string value you see in the DateTextBox.

The value you receive via get('value') is actually a full-blown Date object, which should effectively enable you to get whatever format you want, in various ways. For example:
var date1 = fDate1.get('value');
// stamp = dojo/date/stamp
console.log(stamp.toISOString(date1).slice(0, 10));

Related

Symfony 3 Get the timezone from users without asking them in a form

I have an announce website, at the moment, I have a Subscribe form who ask the user to give me his timezone
$builder->add('timezone', ChoiceType::class, array(
'choices' => $choices
));
but I would like to change and take this information directly without asking the user in a form.
It's important for me because I will have a lot of users who will certainly not know their timezone and will choose a bad one.
Actually, I have announced who is the store with a date in GMT timezone but I would like to display them in the timezone from someone who is registered or not on my website.
For display i have two function:
{{ clanwar.rendezvous|localizeddate('full', 'short') }}
{{ clanwar.rendezvous|date("d F Y, G:i e P", user.timezone)}}
The first one gives a date with the default timezone and it takes the timezone from the server. (i can change by defining it manually)
The second one needs to have a timezone from a registered user.
So both option can't be used for what I want to do.
I think I need to use a Javascript function. I would like to store the user timezone in my session and calculated all date with this information.
But I didn't find a good function who can just find this element.
Do you know something who can help me?
Thanks
{{ clanwar.rendezvous|date("d F Y, G:i e P", user.timezone)}}
In this way you clearly would need to store the timezone in a User entity or something like that. But this is prone to change, as user can tend to travel/move they might not be so disciplined when it comes to changing the timezone each time.
What I would suggest to is to display ISO formatted date in UTC in a, for example, <div> element with a special class:
<div class="user_timezone_container">{{ clanwar.rendezvous|localizeddate('full', 'short') }}</div>
And then do a little bit of JS scripting:
$('.user_timezone_container').each(function(){
var m = moment($(this).text()); //example: "2018-04-03T09:30:26Z"
$(this).text(m.local().format('YYYY-MM-DD HH:mm:ss'));
})
I pieced the example above from the SO question Moment Js UTC to Local Time
Obviously, you don't need neither jQuery not MomentJS, but I used them here for convenience...

Auto calculate todays date when doc opens and add days to date in another field

I am using Adobe XI Standard and have a pdf document with a text field “Today” with a Mouse Up Java script of
var f = this.getField("Today");
f.value = util.printd("mmm/d/yyyy", new Date());
Problem 1) I want this to automatically update when the document opens instead of when the mouse enters it but I dont know how or where to place the script in the proper place.
I have a text field labeled “text11” formatted to be a date mm/dd/yyyy
I have another text field labeled “21stDay” which I want to calculate 21 days from the date in the “text11” field.
Problem 2) I have not been able to get any script to work. Can anyone please tell me how to make this work properly and where to exactly place the scripts as I am just a novice at doing this.
Thank you in advance!
I believe that there are two potential ways to do this:
An OpenAction entry in the Catalog root with an Action dictionary of S(ub)type JavaScript
Named JavaScripts seem to be executed when the document is first opened in Acrobat.
For the fomer see table 3.25 in section 3.6.1 and section 8.5 in the PDF v1.7 Reference, and section 3.6.3 for the latter.
The first thing you can do with a Document-level script containing just that single line:
this.getField("Today").value = util.printd("mmm/d/yyyy", new Date()) ;
If you encounter timing issues (meaning that the field does not get filled reliably, use the PageOpen event of the page on which the document opens. This makes sure that the script is run only when the document is properly loaded.
For the second question, this should work (not I have not verified the code):
var now = new Date() ;
var then = new Date() ;
then.setDate(now.getDate+21) ;
this.getField("text11").value = util.printd("mm/dd/yyyy", then) ;
Note that the Date object is smart enough to properly convert a date number greater than the date of the end of month.

Angular and Breeze edit Date object

I have an AngularJS application where I want to edit a Date object that is being exposed by ASP Web API through BreezeJS. When I try to edit this field in a HTML form it doesn't quite work. It seems to edit part of the object, or doesn't bind to the date input type at all.
I am wondering what the best way would be to edit Date fields in HTML forms with BreezeJS. I can't find any resources about how one would solve this problem in a proper way.
My own guesses would be:
Extend the Breeze entity with an extra field that is based on the original date with a getter/setter.
Not using a date field in the WebAPI, but that doesn't feel right.
Code
In my Angular controller I'm getting the object from Breeze through a repository pattern:
datacontext.session.getById(id)
.then(function (data) {
return vm.session = data;
});
After that the vm.session is filled with the Breeze object, like this:
[{
"$id":"1",
"$type":"TestApp.Model.Session, TestApp.Model",
"Id":3,
"Name":"Second session",
"StartDate":"2014-10-12T00:00:00.000",
}]
Now in my HTML form I'm binding like this:
<input type="date" ng-model="vm.session.startDate" placeholder="Start Date">
It's currenyly showing this date as "Sun Oct 12 2014 02:00:00 GMT+0200 (Romance Daylight Time)" if I use a type "text" instead of "date" in the input field.
And the casing of the ng-model field is correct since I'm using this to create camelCase fields:
breeze.NamingConvention.camelCase.setAsDefault();
So this is fairly straightforward... I'll try to make a JSFiddle or Plunker asap
Breeze maintains date properties as JavaScript Date objects when that's what you say they are in your metadata.
Breeze does not have its own Date type.
The HTML5 <input type="date" .../> date picker is not widely supported yet (see here) so I'm assuming you're relying on the Angular directive to help you.
That directive is designed to bind to a string, not a date object. This probably explains why the wheels are coming off.
I am sorely tempted to argue that the Ng directive should be smarter than this. It should do what it takes to bind to a Date object as well as a date string. I just might file that as a bug.
As you discovered, the HTML input tag "just works" if the type is "text". Obviously the date display and data entry are not what you want.
I think the ideal solution would be to have a directive that translates between date object and string value seamlessly. Probably could be done by decorating the existing Ng directive itself. Something to look into; we can always use your help; this is open source :-).
Meanwhile, you can create a defined property on your customSession type constructor.
See "Custom Constructors" in the documentation. Such a property would wrap the startDate property (startDateAsString?), parsing text in and formatting as string on the way out.
Here is a general purpose function to produce a Date wrapper property:
// Example: addDateWrapperProperty(SessionCtor, 'startDate', 'startDateAsString');
function addDateWrapperProperty(ctor, propName, wrapperPropName) {
Object.defineProperty(ctor.prototype, wrapperPropName, {
get: function () { return this[propName].toString(); },
set: function (value) { this[propName] = value; },
enumerable: true,
configurable: true
});
}
Use it to define your startDateAsString wrapper property and then bind to this property when editing (bind to the real property for readonly display).
Because you don't want Breeze to serialize this, add it to the ctor AFTER registering that ctor with Breeze metadata as shown below.
I don't know for certain that this will give you the behavior you're looking for. I'd need to see your jsFiddle or plunkr to be sure. But I think it will do the trick. Let us know!
I'm certainly not saying this is the ultimate answer. I'm not sure what that answer is ... although I'm thinking about a directive as I said.
Hope this gets you out of the jam for now. Sorry it's such a PITA. Who knew Ng wouldn't understand Date objects?
Example
Here's an example extracted from an actual Breeze test:
///// Test it //////
var OrderCtor = function () { }; // do-nothing custom constructor
// register the ctor FIRST, then add the property
manager.metadataStore.registerEntityTypeCtor('Order', OrderCtor);
addDateWrapperProperty(OrderCtor, 'orderDate', 'orderDateAsString');
// create new order with a test date
var testDate = new Date(2014,0,1,13,30); // 1/1/2014 1:30 pm
var order = em.createEntity('Order', {
companyName: "test cust",
orderDate: testDate
});
// confirm can read the date through the wrapper property
expect(order.orderDate.value).to.equal(testDate.value,
"'order.orderDate' should return " + testDate);
expect(order.orderDateAsString).to.equal(testDate.toString(),
"'order.orderDateAsString' should return " + testDate.toString());
var testDate2 = new Date();
// update orderDate by way of the wrapper property
order.orderDateAsString = testDate2.toString();
// confirm the update worked
expect(order.orderDate.value).to.equal(testDate2.value,
"after update, 'order.orderDate' should return " + testDate2);
expect(order.orderDateAsString).to.equal(testDate2.toString(),
"after update, 'order.orderDateAsString' should return " + testDate2.toString());
// confirm it is not a breeze-tracked property
var propInfo = order.entityType.getProperty('orderDateAsString');
expect(propInfo).to.equal(null, "'Order.orderDateAsString' is not known to metadata ");

Save the actual date in a variable (only date, no time)

I want to save the actual date in a variable. only the date, no time
var a = #Date(#Now());
datasource.replaceItemValue("variable", a)`
And
var a = #Date(#Now());
var b = new Date(a.getYear(), a.getMonth(), a.getDay());
datasource.replaceItemValue("variable", b)
Are returning 28.10.14 00:00
var dt:NotesDateTime = #Date(#Now());
datasource.replaceItemValue("variable", dt.getDateOnly());
Is throwing me an error
Isn't there a simple way to get only the actual date without the time?
Use setAnyTime() metohd of NotesDateTime class to remove time component.
If you want to save only the date use a textfield and convert the text to date, if you need it in your code
#Now uses a java.util.Date, which includes time portions. .getDateOnly() is probably throwing an error because that returns a String.
The underlying session.createDateTime() method accepts either text, a java.util.Date or a java.util.Calendar. I think all of them need to include a time element.
If you're only storing the value for reference, I'd agree with brso05 to not worry.
If you're ever likely to use #Adjust (or an equivalent), then not worrying about the time is a recipe for disaster, because every time you try to adjust, you need to remember to take into account Daylight Savings Time.
One option is to set the time to 12:00 midday. That means DST will not be a problem.
java.sql.Date is specifically designed to only include the Date portion, without a time element. Jesse Gallagher talks about java.sql.Date in the context of his frostillic.us framework https://frostillic.us/f.nsf/posts/32A63DD640D868D885257D18006659A9 and he was the one I found out about java.sql.Date from. I'm not sure how he stores those values though.
I'm not sure if the OpenNTF Domino API will allow you to just pass a java.sql.Date to a field and so store just the date portion.

Set Timezone offset programatically in AnyTime datepicker

I've been using AnyTime datepicker: http://www.ama3.com/anytime/ and I now need to set the TimeZone and update AnyTime datepicker with javascript. Only I can't seem to find the option to do this, And I'm not exactly a Javascript Hero.
I think I've narrowed it down to the function askOffset: function( event ) on line 1919 But can't exactly figure it out what to do next. I don't know what the abbreviated variables mean and I've been randomly trying things and can't figure it out.
The reason I'm doing this is because I have the select dropdown somewhere else on the screen (looks fancier) and I also want the ability to load the saved timezone from cookies.
I've also found some documentation that might be useful: utcFormatOffsetImposed and utcParseOffsetAssumed on the AnyTime page.
The picker automatically parses the timezone from the value in the input field, so if you want to set a specific timezone, just initialize the input field with a value that uses the same timezone.
utcFormatOffsetImposed and utcParseOffetAssumed can be used to force specific time zone conversion in AnyTime.Converter, so if you want to use the converter to initialize the field, you can do something like this:
<input type="text" id="myField"/>
<script>
$(function(){
var myFormat = '%r %#';
var myConv = new AnyTime.Converter({format:myFormat});
myConv.utcFormatOffsetImposed( -330 );
$('#myField').
AnyTime_picker({format:myFormat}).
val( myConv.format(new Date()) );
});
</script>
Of course, replace the format string with whatever you want, as long as it contains %#, %+, %-, %;, %; or %# for the timezone information.

Categories

Resources