Adding info to the User Profile widget

tateroth
Giga Contributor

I have modified the out of box User Profile widget to customize a couple of things successfully in the past.   I am now trying to add a user created field from the sys_user table onto the widget and am having issues.   I haven't spent a ton of time here so any pointers would be greatly appreciated.   The field is essentially the cubicle information that is copied over from the fm_m2m_user_to_space table the updates via a business rule.   The field is named u_office_cubicle and I added it in the HTML code below (see the bold line).   I know that I am using location in the if statement so it shows up until I can get the custom field to populate, then I will switch to that.

<div>

  <div ng-if="data.userExists">

      <div class="panel panel-default">

          <div class="panel-body">

              <div class="row">

                  <div class="col-xs-12 col-sm-4 text-center">

                      <div class="row">

                          <div class="avatar-extra-large avatar-container" style="cursor:default;">

                              <div class="avatar soloAvatar bottom">

                                  <div class="sub-avatar mia" ng-style="avatarPicture"><i class="fa fa-user"></i></div>

                              </div>

                          </div>

                      </div>

                      <div class="row">

                         

                          <!-- file upload -->

                          <span ng-if="::data.isLoggedInUsersProfile">

                             

                          </span>

                      </div>

                  </div>

                  <div class="col-xs-12 col-sm-8">

                      <h2>{{data.name}}</h2>

                      <h4 ng-if="::(displayField('sys_user', 'title', true) || displayField('sys_user', 'company', true))">

                          <sp-editable-field ng-if="::displayField('sys_user', 'title', true)" editable-by-user="data.isLoggedInUsersProfile" table="sys_user" table-id="data.sysUserID" field-model="data.sysUserModel.title" on-change="titleOnChange" on-submit="titleOnSubmit"></sp-editable-field>

                          <span ng-if="::(displayField('sys_user', 'company', true) && displayField('sys_user', 'title', true))">at</span>

                          <span ng-if="::(displayField('sys_user', 'company', true) && !displayField('sys_user', 'title', true))">Works at</span>

                          <sp-editable-field ng-if="::displayField('sys_user', 'company', true)" editable-by-user="data.isLoggedInUsersProfile" table="sys_user" table-id="data.sysUserID" field-model="data.sysUserModel.company"></sp-editable-field>

                      </h4>

                      <p ng-if="::displayField('sys_user', 'department', true)"><strong class="pad-right">${Department}</strong><sp-editable-field editable-by-user="data.isLoggedInUsersProfile" table="sys_user" table-id="data.sysUserID" field-model="data.sysUserModel.department"></sp-editable-field></p>

                      <p ng-if="::displayField('sys_user', 'location', true)"><strong class="pad-right">${Location}</strong><sp-editable-field editable-by-user="data.isLoggedInUsersProfile" table="sys_user" table-id="data.sysUserID" field-model="data.sysUserModel.location"></sp-editable-field></p>

                      <p ng-if="::displayField('sys_user', 'location', true)"><strong class="pad-right">${Office/Cubicle}</strong><sp-editable-field editable-by-user="data.isLoggedInUsersProfile" table="sys_user" table-id="data.sysUserID" field-model="data.sysUserModel.u_office_cubicle"></sp-editable-field></p>

                      <p ng-if="::(data.liveProfileID && displayField('live_profile', 'short_description', true))"><strong class="pad-right">${Bio}</strong><sp-editable-field editable-by-user="data.isLoggedInUsersProfile" table="live_profile" table-id="data.liveProfileID" field-model="data.liveProfileModel.short_description"></sp-editable-field></p>

                  </div>

              </div>

          </div>

      </div>

      <div class="row">

          <div ng-class="{'col-md-6': teamExists(), 'col-md-12': !teamExists()}" class="col-sm-12 col-xs-12">

              <div class="panel panel-primary b" ng-if="getSysUserModelFields().length > 0">

                  <div class="panel-heading">

                      <h4 class="panel-title">

                          <i class="fa fa-info-circle m-r-sm"></i>${About}

                      </h4>

                  </div>

                  <div class="body padder-xs">

                      <div class="list-group">

                          <div ng-repeat="fieldModel in getSysUserModelFields()">

                              <div class="list-group-item">

                                  <div>

                                      <sp-editable-field block="true" table="sys_user" editable-by-user="data.isLoggedInUsersProfile" table-id="data.sysUserID" field-model="fieldModel"></sp-editable-field>

                                      <div ng-if="fieldModel.name == 'email'">

                                  <a href="mailto:{{fieldModel.value}}">Send an Email</a>

                              </div>

                                      <div ng-if="fieldModel.name == 'phone'">

                                  <a href="tel:{{fieldModel.value}}">Place a call</a>

                              </div>

                                      <div ng-if="fieldModel.name == 'mobile_phone'">

                                  <a href="tel:{{fieldModel.value}}">Place a call to mobile</a>

                              </div>

                                  </div>

                              </div>

                          </div>

                      </div>

                  </div>

              </div>

          </div>

          <div ng-if="teamExists()" class="col-md-6 col-sm-12 col-xs-12">

              <sp-widget widget="data.teamWidget"></sp-widget>

          </div>

      </div>

  </div>

  <div ng-if="!data.userExists" >

      <div class="panel panel-default">

          <div class="panel-heading"><h4 class="panel-title">${User not found}</h4></div>

          <div class="panel-body wrapper">

              <p>${This user does not exist}</p>

              <p>${Suggestions}:</p>

              <ul>

                  <li>${Contact your portal administrator}</li>

              </ul>

          </div>

      </div>

  </div>

</div>

The result looks like this when the user has information in the custom field on the sys_user table.

find_real_file.png

I haven't modified the Client or Server Script for this as I didn't need to in order to add mobile to the out of box view.   Perhaps that's what I am missing.

Thank you in advance.

3 REPLIES 3

Justin Abbott
Giga Guru

I would bet that u_office_cubicle isn't an attribute associated to data.sysUserModel.



You might have to end up modifying the Server Script to add it to the model.


This wasn't the answer, but it set me on the right path.   All I needed was the code in HTML, no need to change the server script.   I simply exposed the field in View > Service Portal and boom it was there.   I also needed to add it into the the Client Script otherwise it was showing up twice.



var fieldExcludes = {


sys_user: ['name', 'introduction', 'title', 'department', 'location', 'photo',


'manager', 'company', 'u_office_cubicle'],


live_profile: ['short_description', 'photo']


}



Thank you.


adaml
Mega Expert

You have to add the field you want to display into the Self Service Portal View of the user table. that's what view the GetForm function uses when it builds the sysUserModel.