sp-date-picker Format

[spike]

Can anyone tell me what the date format is meant to be for passing into the directive sp-date-picker? I'm writing a widget and I just cannot get it to work.

I cannot find anything to tell me and for the life of me I cannot get it to work. All I get is an error on the console and the popup doesn't work:

TypeError: Cannot read properties of undefined (reading 'label') at Object.link ( <then lots of script links>

From my server script:

data.end_date = grChange.end_date.getByFormat('yyyy-MM-dd HH:mm');

From my HTML:

<sp-date-picker ng-if='edit' ng-model="data.end_date" sn-change="" sn-include-time="true" ></sp-date-picker>

Any and all help would be appreciated..

[spike]

This is what my HTML looks like:

      <div>
        <label class="m-t-xs m-b-none text-muted"><b>Planned End Date</b></label>
        <br>
        <span ng-if='!edit'>{{data.end_date}}</span>
        <sp-date-picker
            ng-if='edit'
            field="c.fromDate"
            ng-model="cFromDate.value"          
            sn-include-time="true"
            ng-model-options="{getterSetter: true}" >
        </sp-date-picker>
      </div>

Thanks.

[Community Alums · Accepted solution]

Hi @spike ,

It works for me please have a look on below script 

HTML 

<div>
        <label class="m-t-xs m-b-none text-muted"><b>Planned End Date</b></label>
        <br>
        <span ng-if='!edit'>Test{{data.end_date}}</span>
        <sp-date-picker
            field="c.saveRecord"
            ng-model="c.fromDate.value"          
            sn-include-time="true"
            sn-change="c.saveRecord()"
            ng-model-options="{getterSetter: true}" >
        </sp-date-picker>
      </div>

</div>

Client Controller

api.controller=function($scope) {
  /* widget controller */
  var c = this;
		
	c.saveRecord = function(){
		
$scope.data.end_date = c.data.end_date;
c.server.update().then(function(){
//window.location.reload();
});
		
	}
};

Server Side

(function() {
  /* populate the 'data' object */
  /* e.g., data.table = $sp.getValue('table'); */
	
	data.end_date = [];
	var gr = new GlideRecord('change_request');
	gr.addQuery('sys_id', '87b1682a0a0a2c3e75af785bd9073d70');
	gr.query();
	if(gr.next()){
		data.users.push(gr.getValue('number'));
		data.end_date = gr.getValue('end_date');
	}
	
		console.log('input =' + input.end_date);
	if(input){
		
			var uptChange = new GlideRecord('change_request');
			uptChange.get('87b1682a0a0a2c3e75af785bd9073d70');
			uptChange.end_date = input.end_date;
			uptChange.update();
		}

})();

Note: In Server Side please replace the hardcoded sysId with your dynamic variables 

Result : 

Please mark my answer correct and helpful if this works for you

Thanks and Regards 

Sarthak

[spike]

It did work but it took me a while to get it working. The issue I had is that the page was refreshing before the database call had completed and so the refreshed (so not changed) values were being picked up and written to the database. Rather than refreshing the page async I added a record watcher to do the refresh after the record was updated.

[ghzelmed]

Hi ,

please could you explain why  there is no varible declaration  for c.fromDate variable?

cordially,

[spike]

In the client controller you'll see c declared:

  /* widget controller */
  var c = this;

HTH