none
Changing the location of "Description" field in Custom List? RRS feed

  • Question

  • Hello Forum,

    In my Office 365 (SharePoint Online) I have a very simple Custom List which has a few columns/fields, and I added some description to add clarity to users. The problem is that the description's text gets added on the right-side underneath. Also,The company are not allowing using InfoPath nor any third-party solution. So, My only options are: SharePoint Designer & JavaScript.

    Is there any way in SharePoint Designer or JavaScript to move the "Description" field under its column's text itself? Something like the screenshot below: 

    Placing the Description field under the field name itself

    Could you please guide me how to accomplish this?

    I would sincerely appreciate any help in this, Please !

    Thank you very much !

    Friday, December 23, 2016 12:42 AM

Answers

  • Hi Asker 2013, 

    We can add custom Jquery code to make the text under the field name text like below:

    <script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    $( document ).ready(function() {
       $('tr:has(td:contains("Options"))').after("Make sure to pick a value");       
     });
    
    </script>
    

    Thanks

    Best Regards


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    • Marked as answer by Asker2012 Friday, December 23, 2016 2:40 PM
    Friday, December 23, 2016 7:34 AM

All replies

  • Hi,

    Please move the div corresponding below using sharepoint designer

    http://sharepoint.stackexchange.com/questions/120167/modify-the-default-list-view-to-expand-the-description-field-insdie-the-view-t


    Please remember to click Mark as Answer on the answer if it helps you

    Friday, December 23, 2016 6:36 AM
  • Hi Asker 2013, 

    We can add custom Jquery code to make the text under the field name text like below:

    <script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    $( document ).ready(function() {
       $('tr:has(td:contains("Options"))').after("Make sure to pick a value");       
     });
    
    </script>
    

    Thanks

    Best Regards


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    • Marked as answer by Asker2012 Friday, December 23, 2016 2:40 PM
    Friday, December 23, 2016 7:34 AM
  • Just find the corresponding html/css selector for the description text using the browser developer toolbar. Then, write simple Javacsript/JQuery to perform DOM manipulation by moving the corresponding html section from ms-formbody to formlabel.

    Hope this helps!


    Friday, December 23, 2016 7:35 AM
  • I think the solution above is applicable to SharePoint List Views

    The solution for SharePoint Forms is similar in that you need to:

    1. Open the site in SharePoint Designer
    2. Create a new "New Form" or "Edit Form" or "Display Form".
    3. The new form that you create will allow you to see all the tags related to your different controls that you have on your SharePoint Form.
    4. You need to move all the description fields to the right location below the Column name field and save
    5. And make the modified form as the default New/Edit/Display form respectively.



    Regards, Huzefa Mala, MCPD, MCT Please mark the post that answered your question as the answer, and mark other helpful posts as helpful, so they will appear differently to other users who are visiting your thread for the same problem.

    Friday, December 23, 2016 8:10 AM
  • Hi,

    Its not the best practice to modify the list's new form through SPD or manipulating the rendered markup tag through jQuery.

    You have the best class approach in SharePoint 2013 is JSLink or Display Template.

    I soon update the code this scenario.


    Murugesa Pandian | MCPD | MCTS | SharePoint 2010 |


    Friday, December 23, 2016 2:35 PM