{"id":10945,"date":"2017-12-29T16:28:49","date_gmt":"2017-12-29T10:58:49","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=10945"},"modified":"2017-12-29T16:28:49","modified_gmt":"2017-12-29T10:58:49","slug":"how-to-show-the-field-label-along-with-the-value-in-list-view-in-resco-project","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2017\/12\/how-to-show-the-field-label-along-with-the-value-in-list-view-in-resco-project\/","title":{"rendered":"How to Show the Field Label along with the value in List view in Resco Project"},"content":{"rendered":"

Introduction: <\/strong><\/h2>\n

Recently, we had a business requirement where we need to show the Field Label in List view in the mobile app.<\/p>\n

Generally, when we create the List view<\/strong> in the Resco Woodford mobile project, Only the values of the fields added in that View are displayed on the mobile app whereas the label of the fields are not display in the view.<\/p>\n

For example, we have created the following view in the Resco Woodford mobile project.<\/p>\n

\"List<\/p>\n

And when we see this view in the mobile app then it looks as seen in the below screenshot.<\/p>\n

\"List<\/p>\n

So from the above screen, we can\u2019t easily identify the Field Labels from its value, or in other words, we didn\u2019t know which fields are displaying what in the above view.<\/p>\n

So if we display the Field Label in the view it is easy to understand fields and their values.<\/p>\n

However, we wanted to do this in Resco.<\/p>\n

After some research and playing around in Resco, we found an effortless way to achieve the requirement.<\/p>\n

Steps to show the Field Label in the List view in Resco:<\/strong><\/h2>\n

Step 1: Open the view in the Resco Woodford and click on the \u201cEdit Style\u201d button as shown in below screenshot.<\/p>\n

\"List<\/p>\n

After clicking on \u201cEdit Style\u201d button the \u201cGlobal Style Manager\u201d window gets open as seen below.<\/p>\n

\"List<\/p>\n

Select the \u201cprimary\u201d tab and then click on the \u201c+ Add\u201d button as shown in the above screenshot.<\/p>\n

By Clicking on the \u201c+ Add\u201d button you can add a new style and the following window will open. Configure the style as shown in the below screenshot.<\/p>\n

\"List<\/p>\n

In Order to configure the newly created style, we would need to provide the value for two highlighted fields in the above image.<\/p>\n

Regarding FormatString: <\/strong>Format string provide a way, how we would display the field label in the view.<\/p>\n

For example, Format string in the above screen contains two-part \u201cAccount Name:\u201d<\/em><\/strong> and {0}.<\/strong><\/p>\n

\u201cAccount Name:<\/strong>\u201d this is the constant value same as the filed label<\/strong> which will display in the view. Text added here will be display as a field label in mobile app.<\/p>\n

{0}:<\/strong> this is a place holder and contain the actual field value.<\/p>\n

Regarding Name:<\/strong><\/p>\n

Name:<\/strong> this is the name of newly created style, user can put any name as per user convenience. For example we put Name of style as \u201cStyle Name<\/strong>\u201d in above image.<\/p>\n

To apply this style to our List View:<\/strong><\/h2>\n

Select the field in the list view and apply a newly created style to this field as shown in the below screenshot.<\/p>\n

\"List<\/p>\n

Save and close the List View and published the project.<\/p>\n

Open the Mobile app sync it. Then open the List view of account for which we made the configuration.<\/p>\n

We can see the below screen.<\/p>\n

\"List<\/p>\n

Conclusion:<\/strong><\/h2>\n

So in order to display the Field Label in the view, you would need to create a style for each field which is displayed in the view and set the style for each field accordingly.<\/p>\n

\"Integrate<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Introduction: Recently, we had a business requirement where we need to show the Field Label in List view in the mobile app. Generally, when we create the List view in the Resco Woodford mobile project, Only the values of the fields added in that View are displayed on the mobile app whereas the label of\u2026 Read More »<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":10955,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[27,48],"tags":[1447],"class_list":["post-10945","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-field-service-2","category-resco-mobile-crm","tag-resco-mobile-crm"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/10945","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=10945"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/10945\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media\/10955"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=10945"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=10945"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=10945"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}