I'm trying to add javascript to the dispform.aspx page of my form to hide certain columns/fields based on a dropdown menu. When I add the code to the CEWP it simply adds text above the fields; the javascript/jquery completely doesnt work. Even when I saved the code as a text file and tried using it as a content link it just added text above the form containing the code and now I cant get ride of it. Here's the code:

<script src="/sites/Newsite1/SiteAssets/jquery-1.9.0.min.js" type="text/javascript"></script><script type="text/javascript">
// Execute the following JavaScript after the page has fully loaded, when it's ".ready"
$(document).ready(function() {
    //Define which columns to show/hide by default

    //Show/hide columns based on Drop Down Selection 
    $("select[title='test']").change(function() {
        if ($("select[title='test']").val() == "none") {

        } else if ($("select[title='test']").val() == "hide") {

        } else($("select[title='test']").val() == "show") {

  • Ive created a much simpler version and it still completely doesnt work. I've followed this example exactly chakradhar5465.blogspot.co.uk/2013/06/… I've added the jquery library to a new document library. I've also added the script from that example but changed the header and also placed it in the new library. I've then gone to the dispform.aspx and added CEWP, then inputted the content link and nothing. any help would be greatly appreciated. – robert Oct 28 '14 at 14:09
  • Are user scripts enabled in your configuration? – Chris Romp Jun 25 '16 at 11:33

Make sure that src="/sites/Newsite1/SiteAssets/jquery-1.9.0.min.js" is a correct path or replace it with src="https://code.jquery.com/jquery-1.9.1.min.js"

Also, you can upload Jquery file to style library of your site collection and create a new folder like js then upload the file inside it then use the following URL


You can also check full steps at Show / Hide fields based on choice field selection using Jquery in SharePoint

Hope it helps you


Create seprate .js file for your javascript code and give reference of that .js file in your content editor webpart along with "jquery-1.9.0.min.js" reference like:

<script src="/sites/Newsite1/SiteAssets/jquery-1.9.0.min.js" type="text/javascript"></script> 

<script src="/sites/Newsite1/SiteAssets/Test.js" type="text/javascript"></script>

Use Script Editor Web part to insert script inside a page.
Insert your javascript/jquery code inside <script type='text/javascript'></script> tag.
Now it will not render the script as text in the page.


Instead of adding code in Content Editor WebPart add in Script Editor WebPart. In Script Editor WebPart add following code. Create formaction.js file and add your js code in this file.

  1. Add script editor WebPart after your display form WebPart.
  2. Give reference of jQuery plugin
  3. Create formaction.js file give reference of that file after jQuery reference.

Another way you can do it by giving reference of both .js files on your page. Add both jquery.js and formaction.js file reference inside

<asp:Content ContentPlaceHolderId="PlaceHolderTitleAreaClass" runat="server">
<script type="javascript/text" src="[Path of jquery]"></script>
<script type="javascript/text" src="[Path of formaction.js]"></script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.