sharepoint field radio button onclick

Question

We have a custom list with choice radio button field with values (Yes,No) and a Checkbox field. We want to hide the Checkbox when user click no, how we can achieve this in SPD?

what is the best way to do this?

<tr>
  <td width="190px" valign="top" class="ms-formlabel">
    <H3 class="ms-standardheader">
       <nobr>Test1  Assigned?<span class="ms-formvalidation"> *</span></nobr>
    </H3>
  </td>
  <td width="400px" valign="top" class="ms-formbody">
    <SharePoint:FormField  runat="server" id="ff29{$Pos}"
                           ControlMode="Edit" FieldName="Test1_x0020_PM_x0020_Assig"
                           __designer:bind="{ddwrt:DataBind('u',concat('ff29',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Test1_x0020_PM_x0020_Assig')}"
                           />
    <SharePoint:FieldDescription runat="server" id="ff29description{$Pos}"
                                 FieldName="Engineering_x0020_PM_x0020_Assig"
                                 ControlMode="Edit" />
    <H3 class="ms-standardheader"><nobr>Test2 PM Name</nobr></H3>
    <SharePoint:FormField runat="server" id="ff4{$Pos}" ControlMode="Edit"
                          FieldName="Test2_x0020_PM_x0020_Name"
                          __designer:bind="{ddwrt:DataBind('u',concat('ff4',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Test2_x0020_PM_x0020_Name')}"
                          />
    <SharePoint:FieldDescription runat="server" id="ff4description{$Pos}" FieldName="Engineering_x0020_PM_x0020_Name" ControlMode="Edit" /></div></td>
</tr>

Answer 1

I like to use jQuery for this sort of operation. you can also use XSLT Conditional Formatting in the form, but I feel it is far harder to read and debug than jQuery.

1. Add jQuery to your page.

2. View the page's source in IE and get the id of the control you wish to monitor for changes in value..

3. Add an id='some_text' attribute to the table row you wish to show/hide using SP Designer.

4. Learn to use jQuery to attach a change event to the control whose value determines what is being shown/hidden.

   $(document).ready(

   function(){
        //Select the very long GUID of the control and attach the change event handler
       $('#ctl00_m_g_96b4d1be_781c_44eb_941f_c01b7ae00ede_ff371_ctl00_Lookup').change(
           function(){
              //Run a function to evaluate what to do when the value is changed.
              doWork();
            })
     }
   );
   

5. Within the function you are using to do all the work, set the visibility of the table row.

   $('#existing-tr').css('visibility','hidden');

And that should do it. The XSLT written by designer is exceptionally hard to read and, IMO, next to impossible to change after you have it set. So jQuery is really the option to work with for these sorts of tasks.

Answer 2

i did this recently.the trick here is to attach an onchange event to your yes/no field on page load, use this code :

<script type="text/ecmascript">
   if (window.attachEvent){
       window.attachEvent('onload', OnLoad);
   }else if (window.addEventListner){
       window.addEventListner('load', OnLoad, false);  
   }else{
       window.onload = OnLoad;
   }

   function OnLoad(){
      //Attach the onchange event to your yes/no field  
      document.querySelector("span[title=yesnofieldname]").onchange=function(){
          // this code is executed everytime the yes/no value changes
          // do wathever you want here to manage
          var el = document.querySelector("span[title=yesnofieldname]");
          if (el.value == 'No'){
             document.querySelector("span[title=otherfieldname]").style.display = 'none';
          }
      }
   }
</script>

i hope this is what your are looking for.