0

I'm working on the customization of the DispForm and I need to check if the "Enhanced Rich Text" field is empty -> hide, if not empty -> show (column in the DispForm).

I don't have a problem with hiding the field, but I'm struggling with IF statement(to check if the enhanced rich text field is empty or not). Below IF statement works perfectly for the NewForm and the EditForm, but not for DispForm.


$(document).ready(function(){
    if($(".ms-rtestate-field[id^='EnhancedRichTextField']")[0].innerHTML=="

"){ $("td.ms-formlabel:contains('EnhancedRichTextField')").parent().hide(); }else{ $("td.ms-formlabel:contains('EnhancedRichTextField')").parent().show(); } $("td.ms-formlabel:contains('HideCalculatedField1')").parent().hide(); $("td.ms-formlabel:contains('HideCalculatedField2')").parent().hide(); $("td.ms-formlabel:contains('HideCalculatedField3')").parent().hide(); $("td.ms-formlabel:contains('HideCalculatedField4')").parent().hide(); });

Any idea? I also tried: if($("td.ms-formbody[id^='SPFieldNote']").val()=="")

Many thanks!

  • Can you inspect the enhanced rich text box by clicking on it and selecting inspect element and share the screenshot of the html of that rich text? – harshal gite Oct 31 '18 at 19:21
  • if field is empty html looks like this: <tr><td nowrap="true" valign="top" width="113px" class="ms-formlabel"><h3 class="ms-standardheader"><a name="SPBookmark_EnhancedRichTextField"></a>EnhancedRichTextField</h3></td> <td valign="top" class="ms-formbody" width="350px" id="SPFieldNote"> <!-- FieldName="EnhancedRichTextField" FieldInternalName="EnhancedRichTextField" FieldType="SPFieldNote" --> </td> </tr> – Bara Sretr Nov 2 '18 at 9:48
  • if field is NOT empty: <tr><td nowrap="true" valign="top" width="113px" class="ms-formlabel"><h3 class="ms-standardheader"><a name="SPBookmark_EnhancedRichTextField"></a>EnhancedRichTextField</h3></td> <td valign="top" class="ms-formbody" width="350px" id="SPFieldNote"> <!-- FieldName="EnhancedRichTextField" FieldInternalName="EnhancedRichTextField" FieldType="SPFieldNote" --> <div class="ms-rtestate-field"><div dir=""><div class="ExternalClass59318174FD784FF7A23ED3CDF3460E4E">dolorem ipsum<br><p>​</p></div></div></div></td></tr> – Bara Sretr Nov 2 '18 at 9:49
  • This is not the complete html of the rich text field. The field should be an editable div element. – harshal gite Nov 2 '18 at 9:53
  • There should be a div ending with "$TextField_inplacerte" – harshal gite Nov 2 '18 at 9:54
1

IF statement -> check if Enhanced Rich Text field on DispForm is empty -> hide, else -> show


$(document).ready(function(){
  var textField =  $('td.ms-formlabel:contains("EnhancedRichTextField")').siblings(".ms-formbody").text().trim();  
  if(textField.length==0){
        $("td.ms-formlabel:contains('EnhancedRichTextField')").parent().hide();
  }else{
        $("td.ms-formlabel:contains('EnhancedRichTextField')").parent().show();
       }
});  
0

Here is the javascript solution to hide the td.

document.querySelectorAll('td[id=SPFieldNote]').forEach(function(element){
    var fieldTitleElement = element.previousElementSibling;
    if(fieldTitleElement.innerText.indexOf("EnhancedRichTextField") > -1){
        if(!element.innerText.trim()){
            element.style.display = "none";
        }
    }
});

If you want to hide the whole row (), then you just need to add .parrent to the element while hiding (shown below).

document.querySelectorAll('td[id=SPFieldNote]').forEach(function(element){
    var fieldTitleElement = element.previousElementSibling;
    if(fieldTitleElement.innerText.indexOf("EnhancedRichTextField") > -1){
        if(!element.innerText.trim()){
            element.style.display = "none";
        }
    }
});
  • Many thanks Harshal! It didn't work for my case...but you shown me the right direction -> I've found the solution. – Bara Sretr Nov 2 '18 at 14:47

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.