0

I have below table where the headers and data are showing perfectly but in a same column. Instead I need to show them in a proper table format. Unfortunately, I am unable to do so.

Can someone please help me?

Please find the image how it looks like now. Validation Rule Table needs to look like Field Names table

This is my code for Field Names table which is fine.

<div style = "margin:0px 200px 0px 50px;">

                              <apex:dataTable style="background-color: #9e9494;" id="Randomtext" value="{!fieldMap[key1]}" var="listElementelements2" border="1">
                                 <apex:column width="100" style="background-color: #ffffff;"   headerClass="headerStyle"  headerValue="Field Name" value="{!listElementelements2.Name}"/>
                                 <apex:column width="100" style="background-color: #ffffff;"   headerClass="headerStyle"  headerValue="Field Type" value="{!listElementelements2.Field_Type__c}"/>
                                 <apex:column width="500" style="background-color: #ffffff;"  headerClass="headerStyle" headerValue="Object Name" value="{!listElementelements2.Object_Name__c}"/>
                                 <apex:column width="100" style="background-color: #ffffff;"  headerClass="headerStyle"  headerValue="Dependency Name" value="{!listElementelements2.Dependency__c }"/>
                                 <apex:column width="100" style="background-color: #ffffff;"  headerClass="headerStyle"  headerValue="Picklist Values" value="{!listElementelements2.Picklist_Values__c}"/>

                              </apex:dataTable>
                           </div>

HTML Code for Validation Rule table

<table id="contacttable">
                           <tr> 
                            <apex:repeat value="{!$ObjectType.Configuration__c.Fieldsets.Validation_Rule}" var="varFieldName"> 

                              <div id="Randomtext">

                                <th style="background-color: #9e9494;border-width: thick thick;">{!varFieldName.Label}</th>

                              </div>

                              <div>
                                <apex:repeat value="{!configMap[key1][key2]}" var="listElement">
                                    <apex:repeat value="{!listElement}" var="listElementelements"  >

                                    <tr>  
                                       <td style="background-color: #ffffff;border-width: thick thick;">{!listElementelements[varFieldName]}</td>   
                                     </tr> 
                                </apex:repeat>
                              </apex:repeat>
                              </div>

                            </apex:repeat>
                           </tr>
                          </table>

After Tushar's solution it managed to be in a row but second set of data gets into same problem.

Scrrenshot:

enter image description here

4
  • Are you saying that you want to put a table into a table cell of another table?
    – Keith C
    Jun 30, 2018 at 8:53
  • I just want to create a table as in picture. The dataset needs to fit in vertically. Jun 30, 2018 at 10:17
  • Hi @KeithC. Can you please help me here? salesforce.stackexchange.com/questions/223590/… I have tried using overflow-wrap as said here but I am not getting my desired output. css-tricks.com/almanac/properties/o/overflow-wrap Jul 3, 2018 at 7:25
  • Please don't add comments directed at an individual that are just saying "please help"; it is really up to contributors to choose to help. Sounds like you should post another question (linked back to this one) detailing the new problem. Or un-accept the answer if that did not solve the original problem.
    – Keith C
    Jul 3, 2018 at 7:47

1 Answer 1

2

To get the table Header in a row. You need just this. You just need to use Tr, th tag to make it work.

<tr> 
<apex:repeat value="{!$ObjectType.Configuration__c.Fieldsets.Validation_Rule}" var="varFieldName"> 
    <th style="background-color: #9e9494;border-width: thick thick;">{!varFieldName.Label}</th>
</apex:repeat>
</tr>

As I am not aware how you are filling the data but I think you need to change your code to make it work.

<table id="contacttable">
    <tr> 
    <apex:repeat value="{!$ObjectType.Configuration__c.Fieldsets.Validation_Rule}" var="varFieldName"> 
        <th style="background-color: #9e9494;border-width: thick thick;">{!varFieldName.Label}</th>
    </apex:repeat>
    </tr>


    <apex:repeat value="{!configMap[key1][key2]}" var="listElement">
        <apex:repeat value="{!listElement}" var="listElementelements"  >
    <tr>
            <apex:repeat value="{!$ObjectType.Configuration__c.Fieldsets.Validation_Rule}" var="varFieldName">
                <td style="background-color: #ffffff;border-width: thick thick;">{!listElementelements[varFieldName]}</td>   
            </apex:repeat>
    </tr>
        </apex:repeat>
    </apex:repeat>

</table>

I have changed the position of fieldset repeat to make it works.

6
  • Thanks Tushar! But now though the row is fine the second set of data gets into same kind of problem. I have attached the image in question. Can you please have a look? Jun 30, 2018 at 9:59
  • 1
    @user3919803 Changed the position of tr. Check now. Jun 30, 2018 at 12:17
  • @TusharSharma Just one small issue I find the table data in a row not showing in full content as it exceeds page size in width. I find like shrinking the table data to fit in one page should be fine with width:100% in style but seems this not working in my case. Can you please suggest any way out? Jul 2, 2018 at 11:30
  • 1
    @Testing_SFDC I suggest you post a new question with code and UI screenshots. To get the better answer. Jul 2, 2018 at 11:32
  • Hi Tushar please find separately asked the question here. Jul 3, 2018 at 2:29

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.