Edit Widget - time not visible when DateTime field has time enabled

[LizDaRos]

I need to be able to edit the time in the date field using the edit widget. The edit widget only displays a calendar and does not populate the time. The web map I am using with the feature service has the pop-up configured already for the date field to be formatted as shortDate and show the time. With this configuration I'm able to edit the time using the ArcGIS Online Edit but unfortunately this functionality does not carry over into the edit widget on the Web App Builder.
I found someone with the same issue as this but they are using the Network Trace widget and the code they altered to fix this is not the same in the edit widget. There's the link to their solution.

If anyone has a solution for editing the time with the edit widget and/or adding a button to the calendar to set today's date, it would greatly be appreciated.

Thanks

[RobertScheitlin__GISP · Accepted solution]

Liz,

  Here is the code change for WAB 1.3 edit widget Widget.js function _converConfiguredLayerInfos (line 27-36):

_converConfiguredLayerInfos: function (layerInfos) {
        array.forEach(layerInfos, function (layerInfo) {
          // convert layerInfos to compatible with old version
          if (!layerInfo.featureLayer.id && layerInfo.featureLayer.url) {
            var layerObject = getLayerObjectFromMapByUrl(this.map, layerInfo.featureLayer.url);
            if (layerObject) {
              layerInfo.featureLayer.id = layerObject.id;
            }
          }

          // convert fieldInfos
          var newFieldInfos = [];
          var webmapFieldInfos =
            editUtils.getFieldInfosFromWebmap(layerInfo.featureLayer.id, this._jimuLayerInfos);
          array.forEach(layerInfo.fieldInfos, function (fieldInfo) {
            if ( /*fieldInfo.isEditable &&*/
              // only for compitible with old version of config.
              // 'globalid' and 'objectid' can not appear in new app's config.
              fieldInfo.fieldName !== "globalid" &&
              fieldInfo.fieldName !== "objectid") {
              var webmapFieldInfo = getFieldInfoFromWebmapFieldInfos(webmapFieldInfos, fieldInfo);

              if (webmapFieldInfo) {
                if (webmapFieldInfo.isEditable ||
                  webmapFieldInfo.isEditableSettingInWebmap ||
                  webmapFieldInfo.visible) {
                  if (webmapFieldInfo.format != null) {
                    if (webmapFieldInfo.format.dateFormat != null) {
                      if (webmapFieldInfo.format.dateFormat === "shortDateShortTime" ||
                        webmapFieldInfo.format.dateFormat === "shortDateShortTime24" ||
                        webmapFieldInfo.format.dateFormat === "shortDateLEShortTime" ||
                        webmapFieldInfo.format.dateFormat === "shortDateLEShortTime24") {
                        webmapFieldInfo.format.time = true;
                      }
                    }
                  }
                  newFieldInfos.push(webmapFieldInfo);
                }
              } else {
                newFieldInfos.push(fieldInfo);
              }
            }
          }, this);

          if (newFieldInfos.length !== 0) {
            layerInfo.fieldInfos = newFieldInfos;
          }
        }, this);
        return layerInfos;

        function getFieldInfoFromWebmapFieldInfos(webmapFieldInfos, fieldInfo) {
          var resultFieldInfo = null;
          if (webmapFieldInfos) {
            for (var i = 0; i < webmapFieldInfos.length; i++) {
              if (fieldInfo.fieldName === webmapFieldInfos.fieldName) {
                webmapFieldInfos.label = fieldInfo.label;
                webmapFieldInfos.isEditableSettingInWebmap = webmapFieldInfos.isEditable;
                webmapFieldInfos.isEditable = fieldInfo.isEditable;
                resultFieldInfo = webmapFieldInfos;
                // resultFieldInfo.label = fieldInfo.label;
                // resultFieldInfo.isEditableSettingInWebmap = webmapFieldInfos.isEditable;
                // resultFieldInfo.isEditable = fieldInfo.isEditable;
                break;
              }
            }
          }
          return resultFieldInfo;
        }

        function getLayerObjectFromMapByUrl(map, layerUrl) {
          var resultLayerObject = null;
          for (var i = 0; i < map.graphicsLayerIds.length; i++) {
            var layerObject = map.getLayer(map.graphicsLayerIds);
            if (layerObject.url.toLowerCase() === layerUrl.toLowerCase()) {
              resultLayerObject = layerObject;
              break;
            }
          }
          return resultLayerObject;
        }
      },

[LizDaRos]

Great, thanks so much for your help!
Is this the same area I would auto-populate other fields with and/or auto-populate those date fields?? I was trying this but it doesn't seem to work-

if(webmapFieldInfo) {
                if( webmapFieldInfo.isEditable ||
                    webmapFieldInfo.isEditableSettingInWebmap ||
                    webmapFieldInfo.visible) {
                    if (fieldInfo.fieldName == "RPKEY") {
                    feature.attributes["RPKEY"] = "testing auto-populate";
                    //alert("test");
                    }
                    //rscheitlin edit widget time update
                    if (webmapFieldInfo.format != null) { 
                    if (webmapFieldInfo.format.dateFormat != null) {

[RobertScheitlin__GISP]

Liz,

   If my reply answered your original question then please mark the question as answered. I will have to look into your follow-up question as I have not had a need to do this yet.

To mark the question as answered all you have to do is open the thread (you can not see the correct answer link from inside your inbox) and then you will see the green star with correct answer link. Just click that link on the thread that answered your question.

[RobertScheitlin__GISP]

Liz,

  Here is what I figured out for auto-populating fields:

_worksAfterCreate: function () {
        // add close button to atiInspector
        this._addButtonToInspector();
        // resize editPopup
        this.editPopup.resize(500, 251);
        // update templatePicker for responsive.
        this.editor.templatePicker.update();
//Add the autopopulate field value
        this.editor.templatePicker.on("selection-change", lang.hitch(this, function() {
          var selected = this.editor.templatePicker.getSelected();
          if (selected) {
            var featureLayer = selected.featureLayer;
            on.once(featureLayer, "before-apply-edits", lang.hitch(this, function(evt){
              if(evt.adds && evt.adds.length > 0){
                if(evt.adds[0].attributes.hasOwnProperty('Begin_Date_Occ')){
                  evt.adds[0].attributes.Begin_Date_Occ = new Date(Date.now());
                }
                this.editor.attributeInspector.refresh();
              }
            }));
          }
        }));
//End add
        //just for BoxTheme
        setTimeout(lang.hitch(this, this._update), 900);
        // // reset default selectionSymbol that change by Editor dijit.
        // array.forEach(this.editor.settings.layerInfos, function(layerInfo) {
        //   layerInfo.featureLayer.setSelectionSymbol();
        // }, this);
      },

[LizDaRos]

Thank you once again Robert! I really appreciate everything you have done, it is very helpful.

If you get a chance, no rush, how could I make your code auto-populate fields for features that have already been created? I have users that will just be updating attributes on features that are already created and it would be helpful for them if some fields auto-populated such as the date field.

I've been trying to look for a _worksAfterUpdate event to edit but I can't figure out where I'd have to make these changes to.
Well thank you and if you don't have time, I understand.

Happy Holidays!

[CraigPrisland2]

This is great information and very helpful.  I was wondering if anyone was able to successfully auto populate the current date in a specific field using the Smart Editor widget instead of the Edit widget?  I posted an original question here:

https://community.esri.com/thread/222796-populate-current-date-into-field-in-smart-editor-widget 

Thanks,

Craig