- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-23-2020 11:28 AM
Hi all,
I have a widget on a Service Portal page that uses fill out. One of the fields is a date field. I want the field to auto populate with "todays" date. Below is the code that I have, but not sure how to get the date field to auto populate.
<label for="dateRequested">Date of Request:</label>
<input type="date" id="dateRequested" ng-required="data.dateRequested" ng-model="data.dateRequested">
Solved! Go to Solution.
- Labels:
-
Service Portal Development

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-23-2020 12:26 PM
Hi,
Why don't you use sp_date_picker directive.
<sp-date-picker ng-model="your.model.value" sn-change="your_function()"></sp-date-picker>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-04-2020 04:48 AM
Asifnoor,
Thanks for the help. Here is the code I used to get the date field to auto populate with "todays" date.
HTML:
<li>
<label>Date of Request:</label>
<sp-date-picker field="data.dateRequested"
value-field="data.dateRequested"
ng-model="data.dateRequested"
sn-change="">
</sp-date-picker>
</li>
Server Script:
gdt = new GlideDate();
data.dateRequested = gdt.getDisplayValue();
if (input)
{
if (input.check == 'workOrder')
{
var record = new GlideRecord('"MY TABLE NAME');
record.initialize();
record.request_by = gs.getUserDisplayName();
record.date_of_request = input.dateRequested;
<more code>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-23-2020 01:49 PM
Set the default value in the server script for your widget. Something like this should work:
if (!input.dateRequested) {
var gd = new GlideDate();
data.dateRequested = gd.getByFormat('yyyy-MM-dd');
}
I'm not 100% sure that condition will work, but I think it should.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-27-2020 06:04 AM
Tony,
I have the below for the server script. I can see in the logs that the "dateRequested before:" is undefined. The "dateReqeusted after:" shows todays date "2020-07-27". But the field on the page does not show todays date has "mm/dd/yyy". I assume I need to refresh the page some how to get the date "2020-07-27" to show?
gs.warn("dateRequested before: " + data.dateRequested);
if (!data.dateRequested)
{
var gd = new GlideDate();
data.dateRequested = gd.getByFormat('yyyy-MM-dd');
gs.warn("dateRequested after: " + data.dateRequested);
}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-27-2020 09:41 AM
Sorry. Lack of knowledge on my part. ngModel apparently will not update automatically if you change the value programmatically.
Before fixing that, though, there is an issue with your server script. Your if condition really does need to check the value of "input.dateRequested", not "data.dateRequested" because "data.dateRequested" will always be initially undefined in the server script.
When the client script calls the server script, it passes in the client version of "data" to the server as "input". To try and clarify that: "input" is the data as it was on the client side, but "data" in the server script is the new data that is being built to pass back to the client. The "data" object on the server does not automatically inherit the values from "input", so you have to specifically assign them.
So your server script should be something like this:
if (!input.dateRequested || input.dateRequested == "") {
var gd = new GlideDate();
data.dateRequested = gd.getByFormat('yyyy-MM-dd');
data.refreshDateRequested = true;
} else {
data.dateRequested = input.dateRequested;
}
Then you should be able to force the ngModel to update by adding this to your client script to trigger an input event:
if (c.data.refreshDateRequested) {
angular.element("#dateRequested").trigger('input');
angular.element("#dateRequested").scope().data.dateRequested;
}