Jump to content
  • 0

Hide Columns In Grid Edit - Tabular Report


kpcollier
 Share

Question

Hello,

I've got several fields and HTML blocks in my tabular report that are just for displaying information, they cannot be edited. I am trying to hide these specific columns when the user enters Grid Edit mode, but keep them visible when the user is just viewing the report normally. 

Anyone have any ideas how to do this? I've tried a couple different approaches, including the one below, to no avail. 

div[class="HeadCtnr"] th:nth-child(5) {
display: none !important;
}

div[class="BodyCtnr"] th:nth-child(5){
display: none !important;
}

 

Link to comment
Share on other sites

8 answers to this question

Recommended Posts

  • 0

Seems there is an easy way to get rid of the non-editable data cells, as they all have the .cbResultSetGridNonEditableColumnNumberDate class. However, the headers prove to be more difficult, as they do not have a specific class singling them out.  

tr[class="cbResultSetGridTableHeader"] td:nth-child(5) {
  display: none !important;
} 

Not too sure how to do these css 'queries' or whatever you call them but this didn't do anything either. 

Link to comment
Share on other sites

  • 0
10 minutes ago, futurist said:

Hi @kpcollier,

You can also use this: 

td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(3), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(3) {
  display: none;
}

Thank you for the help!

I can't get this to work, for some reason. I've tried adding important as well, with no luck. 

td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(5), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(5) {
  display: none !important;
}
td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(7), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(7) {
  display: none !important;
}

 

Link to comment
Share on other sites

  • 0
10 minutes ago, kpcollier said:

Thank you for the help!

I can't get this to work, for some reason. I've tried adding important as well, with no luck. 

td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(5), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(5) {
  display: none !important;
}
td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(7), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(7) {
  display: none !important;
}

 

Hi Keith,

It seems to be working as expected on my end. Here's my DataPage URL: https://c1hch576.caspio.com/dp/db26a000d0678790228b4fb593fd

 

And here are my css that hides the fields HTML BLOCK 1 and 2 (nth child 3 and 6, respectively):

td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(3), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(3) {
  display: none !important;
}

td[class="Cell cbResultSetGridHeaderCell cbResultSetLabel"]:nth-child(6), td[class="Cell cbResultSetGridDataCell cbResultSetData cbResultSetGridNonEditableColumn"]:nth-child(6) {
  display: none !important;
}
 

 

Link to comment
Share on other sites

  • 0

Hi @kpcollier , you may also try this code. Just change the number based on the position order of the field you want to hide.

<style>
form[action*='[@cbAppKey]'] tr.Row.cbResultSetGridDataRow td:nth-child(9),
form[action*='[@cbAppKey]'] tr.Row.cbResultSetGridTableHeader td:nth-child(9)
{
display:none !important;
}
</style>

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...