How can I display Description text in DispForm view

Question

I have a list where some of the column names are very long because they contain question text for the user to answer in the field type element (choice, single line of text, etc). If I move the question text into the 'Description' property for the column I'll see it in EditForm and NewForm views, but I won't see it in DispForm view - and I really need to :(

Is there script I can insert on the DispForm.aspx page that will display the 'Description' property text there? Then I can just use column names like "Question #1" etc., and put the question text in 'Description' and it will be visible across all form views.

Answer 1

Nice use of the CSR Venkat - I learned something.

The old fashioned way - you can use a REST call to get the list of fields for the list.

/SITENAME/_api/web/lists/getbytitle('LIST NAME')/Fields

Then loop through the d.results - there are attributes for the Description, and for each field with a description you could use the Title to match up with the display name of the field on the page, and append the information to the row .

An example:

<script type="text/javascript" src="/Javascript/JQuery/JQueryMin-1.11.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    displayDescriptions();
});
function displayDescriptions() {
    var options = "";

    $.ajax({
    url: _spPageContextInfo.webServerRelativeUrl +
    "/_api/web/lists/getbytitle('LIST_TITLE_HERE')/Fields" ,
    type: "GET",
    headers: {
        "accept": "application/json;odata=verbose",
        "content-type": "application/json;odata=verbose",
     },
    success: function (data) {
        $.each(data.d.results, function(index, value) {
            if(value.Description != '') {
                $('h3:contains("' + value.Title + '")').eq(0).parents('tr:first').find('td').eq(1).prepend('<b>' + value.Description + '</b><br />');

            }
        });

     },
    error: function (err) {
        alert('Error in retrieving descriptions: ' + JSON.stringify(err));
     }
});
}


</script>

Answer 2

In the display form, you won`t get the field description which you can manage with simple javascript. But you can achieve using CSR (JS Link Concept).

Here is SharePoint column

Here is how I am displaying description in the Display Form

To achieve this the steps I have followed using below JavaScript

Code in my JavaScript File

SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
  Templates: {
    Fields: {
      'Question1': {
        DisplayForm: function(ctx) {
          return (ctx.CurrentFieldSchema.Description) + " - " + (ctx.CurrentItem.Question1);
        }
      }
    }
  }
});

Steps you have to follow to apply this script

1. Upload your script file into one of your assets library.
2. Go to your list item DispForm.aspx page and Edit the page.
3. Edit web part properties.
4. Under "Miscellaneous" section you have to refer the file path under "JS Link".
5. Save changes.

The above is a sample I am using for my POC. You have to modify according to your requirement.

If you are new to the CSR you can refer this article for an additional explanation.

Answer 3

Looks like the Description is not outputted by the DispForm, so its not in the page, you would have to load it yourself (takes a lot of script)

Maybe add CSS to prevent your Question (Column Title) from getting to wide??

.ms-formtable > tbody > tr > td:first-child {/* first column */
    background: pink;
    width:100px;
}