1

I have a SharePoint custom list application with forms modified in SharePoint designer. I am looking for a way to hide or display questions on the form based on other form questions.

Example: Lets say the form has questions with the following list fields that are Yes, No or N/A

F01 F02 F03 F04

If F01 = No then F02, F03 and F04 dont show

If F01 = Yes and F02 = No then F03 and F04 dont show

Here is script I tried

<script src="https://sharepointex3.dcs- 
.com/sites/GSSTA/TA/LOAD/jQuery/jquery-1.3.2.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
// Show F02 , F03 , F04 when selecting "Yes"
  $("select[title='_x0046_01']").change(function() {
  if ($("select[title='_x0046_01']").val() == "Yes") {
           $('nobr:contains("_x0046_02")').closest('tr').show();
           $('nobr:contains("_x0046_03")').closest('tr').show();
           $('nobr:contains("_x0046_04")').closest('tr').show();
       }
  // hide F02 , F03 , F04 when selecting "No"
  else if($("select[title='_x0046_01']").val() == "No"){
         $('nobr:contains("_x0046_02")').closest('tr').hide();
         $('nobr:contains("_x0046_03")').closest('tr').hide();
         $('nobr:contains("_x0046_04")').closest('tr').hide();
      }
});
});
</script>

Here is the SharePoint code for the fields in question

<tr> <td valign="top" class="style15" style="width: 425px">question1td> <td valign="top" class="style15" style="width: 55px"><SharePoint:FormField runat="server" id="ff999{$Pos}" controlmode="Edit" fieldname="_x0046_01" itemid="{@ID}" __designer:bind="{ddwrt:DataBind('u',concat('ff999',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@_x0046_01')}" /></td> <td width="400px" valign="top" class="style15" style="width: 75px"><xsl:value-of select="@f01m" /></td><td width="400px" valign="top" class="style15" style="width: 275px"><SharePoint:FormField runat="server" id="ff9990{$Pos}" controlmode="Edit" fieldname="F01c" __designer:bind="{ddwrt:DataBind('u',concat('ff9990',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@F01c')}" /></td> </tr> <tr> <td valign="top" class="style15" style="width: 425px">question2td> <td valign="top" class="style15" style="width: 55px"><SharePoint:FormField runat="server" id="ff999a{$Pos}" controlmode="Edit" fieldname="_x0046_01" itemid="{@ID}" __designer:bind="{ddwrt:DataBind('u',concat('ff999a',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@_x0046_02')}" /></td> <td width="400px" valign="top" class="style15" style="width: 75px"><xsl:value-of select="@f01m" /></td><td width="400px" valign="top" class="style15" style="width: 275px"><SharePoint:FormField runat="server" id="ff9990a{$Pos}" controlmode="Edit" fieldname="F01c" __designer:bind="{ddwrt:DataBind('u',concat('ff9990a',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@F01c')}" /></td> </tr> <tr> <td valign="top" class="style15" style="width: 425px">question3td> <td valign="top" class="style15" style="width: 55px"><SharePoint:FormField runat="server" id="ff999b{$Pos}" controlmode="Edit" fieldname="_x0046_03" itemid="{@ID}" __designer:bind="{ddwrt:DataBind('u',concat('ff999b',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@_x0046_03')}" /></td> <td width="400px" valign="top" class="style15" style="width: 75px"><xsl:value-of select="@f01m" /></td><td width="400px" valign="top" class="style15" style="width: 275px"><SharePoint:FormField runat="server" id="ff9990b{$Pos}" controlmode="Edit" fieldname="F01c" __designer:bind="{ddwrt:DataBind('u',concat('ff9990b',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@F01c')}" /></td> </tr> <tr> <td valign="top" class="style15" style="width: 425px">question4</td> <td valign="top" class="style15" style="width: 55px"><SharePoint:FormField runat="server" id="ff999c{$Pos}" controlmode="Edit" fieldname="_x0046_03" itemid="{@ID}" __designer:bind="{ddwrt:DataBind('u',concat('ff999c',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@_x0046_03')}" /></td> <td width="400px" valign="top" class="style15" style="width: 75px"><xsl:value-of select="@f01m" /></td><td width="400px" valign="top" class="style15" style="width: 275px"><SharePoint:FormField runat="server" id="ff9990c{$Pos}" controlmode="Edit" fieldname="F01c" __designer:bind="{ddwrt:DataBind('u',concat('ff9990c',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@F01c')}" /></td> </tr>

1 Answer 1

0

Please check the below JQuery sample

<script src="http://code.jquery.com/jquery-1.7.2.min.js" 
type=text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){

// Show F02 , F03 , F04 when selecting "Yes"
  $("select[title='F01']").change(function() {
  if ($("select[title='F01']").val() == "Yes") {
           $('nobr:contains("F02")').closest('tr').show();
           $('nobr:contains("F03")').closest('tr').show();
           $('nobr:contains("F04")').closest('tr').show();
       } 
  // hide F02 , F03 , F04 when selecting "No"
  else if($("select[title='F01']").val() == "No"){
         $('nobr:contains("F02")').closest('tr').hide();
         $('nobr:contains("F03")').closest('tr').hide();
         $('nobr:contains("F04")').closest('tr').hide();
      }
 });
});
 </script>

=========Update===

To add the java script\jquery into your form:

  • Click the Settings Icon and click Edit Page

  • Click add a web part

  • Add a Content Editor web part
  • in the Content Editor click on Edit Source ribbon button and add your script

enter image description here

enter image description here

7
  • what else is required to implement and where in code would this go?
    – user63270
    Jun 28, 2018 at 12:02
  • Hi @pinkstonmatt , please check the updates
    – A.Saéed
    Jun 28, 2018 at 14:28
  • these pages were created using spd2010 does that matter?
    – user63270
    Jun 28, 2018 at 14:46
  • I placed the script in the code in multiple locations but it never seemed to make a difference.
    – user63270
    Jun 29, 2018 at 0:22
  • Okay here is the script I place in multiple spots...
    – user63270
    Jun 29, 2018 at 0:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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