Service Portal date field

stevethomas
Giga Contributor

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">

1 ACCEPTED SOLUTION

asifnoor
Kilo Patron

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>

View solution in original post

8 REPLIES 8

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>

Tony DiRienzo
Giga Guru

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.

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);
}

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; 
}