Skip to main content
26 votes
Accepted

Lightning Web Component for table rows and cells

Building on the answer provided already by @sfdcfox, this following seems to be working for me and allows me to componentize the entire row (much easier to emit events this way). parent.html <...
tsalb's user avatar
  • 3,735
17 votes
Accepted

SLDS table with fixed header

The SLDS table header row can be fixed using standard classes. There are two classes that are important slds-table–header-fixed_container and slds-cell-fixed and i created a working example on github ...
kanwalpreet singh's user avatar
10 votes

Lightning Web Component for table rows and cells

Ideally, you shouldn't use table; lightning-layout and lightning-layout-item work as tables for all practical purposes. If that doesn't work for you, then you'd want to simply apply the appropriate ...
sfdcfox's user avatar
  • 497k
7 votes
Accepted

Overlapping data while using print functionality over VF page

I believe this is happening due to the table falling on a page-break-zone. You can add the following style style="page-break-inside: avoid;" to your div inside the apex:repeat, it will ensure no ...
Santanu Halder's user avatar
6 votes
Accepted

Create PageBlockTable With Two Types Of SObject

Just use a List<SObject> property. Your controller should look something like: public with sharing class MyController { public List<SObject> tasksAndNotes { get; private set; } ...
Adrian Larson's user avatar
  • 151k
6 votes

Lightning Web Component for table rows and cells

I agree with most statements from the comments where there are better choices than a table but another option I found is to use the following CSS in your "row" component: :host{ display: contents;...
KoenVM's user avatar
  • 2,426
5 votes
Accepted

Visualforce table column headers of headers

Very first link from my google results has it all: <apex:facet name="header"> <table border="1" width="100%"> <tr> <td width="50%" rowspan="2">Other ...
o-lexi's user avatar
  • 3,094
5 votes
Accepted

wrapper data not showing in lightning component

Instead of e.g.: value="{!v.con.janTotal}" for your case it is just e.g.: value="{!con.janTotal}" Inconsistently, the v. prefix is required to access aura:attribute values but not to access the ...
Keith C's user avatar
  • 136k
5 votes
Accepted

Combine two lists in to one visualforce table

Create a wrapper class to represent the object they share in common. That seems to be the Commission__c field. public class CommissionWrapper { // May need to be lists public ...
battery.cord's user avatar
  • 8,845
5 votes
Accepted

Display Tables side by side in Visualforce - Render As PDF

This is getting a bit cross-discipline, as this is primarily a html/css/layout issue. I'll skip going over details about the "box model". In short, tags get rendered as boxes. From outside ...
Derek F's user avatar
  • 62.7k
4 votes
Accepted

Perform actions on a table in a Lightning Component

you may use tabindex to get index from Lighting:button <lightning:button tabindex="{!index}" class="deleteButtons" label="del" iconName="utility:delete" iconPosition="left" onclick="{!c.deleteRow}...
vignesh's user avatar
  • 2,704
4 votes

Rowspan with apex repeat

Examples such as this one HTML rowspan Attribute reduce the number of td elements in the following rows (as rowspan is effectively saying use the content from the previous row). So you need to ...
Keith C's user avatar
  • 136k
4 votes
Accepted

Justify text based on width of column width lightning design grid (slds)

You can use the Hyphenation from SLDS. The hyphenation class should be placed on text that might be served in narrow width containers and is not truncated. <div class="slds-grid slds-gutters"> ...
Tushar Sharma's user avatar
4 votes
Accepted

lightning:input vertical alignment in table cell

Use <lightning:input variant="label-hidden"> to have lightning input without a space in front.
Ranga's user avatar
  • 1,722
4 votes
Accepted

Lightning: <table> with dynamic column count, want fixed width columns and scrolling instead of automatic resizing

Table elements always expand to take up all available space. Instead, you'll want to use normal div elements. I'm not going to try and build a perfectly working example, but you'll want to start off ...
sfdcfox's user avatar
  • 497k
4 votes
Accepted

For each in HTML not working

It looks like your variable references are not quite right. Please use different variable names for each reference to avoid confusion. Existing: There is no rn nor rn.contracts. <tbody> <...
gale-force-wizard's user avatar
3 votes

VF page Datepicker position Issue for ScrollableTable

tl;dr: I wasn't able to keep the datepicker position adjusted, but I did find an explanation for why the standard datepicker is behaving the way it is. It took an amount of searching and luck, but I ...
Derek F's user avatar
  • 62.7k
3 votes

SLDS table with fixed header

I based this off of the LEX source for reports ;) : helper: handleScroll : function(cmp) { //var thePage = cmp.getElement().getBoundingClientRect(); var tables = cmp.find('table');...
wellmstein's user avatar
  • 1,821
3 votes
Accepted

Unable to add new row in Lightning

If you want to create aura:html components dynamically you want to do like this insertNewRow : function(component, event, helper) { $A.createComponents([ ["aura:html", {"tag":"tr", "...
vignesh's user avatar
  • 2,704
3 votes
Accepted

Pageblocktable to be rendered as table in PDF

The PDF renderer sensibly skips a lot of styling as the usual Visualforce look isn't something that you're going to want on paper. The pageBlockTable should work but in these situations I do prefer ...
Matt Lacey's user avatar
  • 25.7k
3 votes
Accepted

Visualforce as PDF with table format

A couple of things here - Try set a width on the table and avoid using visualforce styling elements as they're not fully supported by the PDF renderer. Try to stick as much as you can to plain HTML ...
Boris Bachovski's user avatar
3 votes
Accepted

How to center lightning:select components in a table

I think that can be solved by adding the variant. <lightning:select aura:id="selectField" name="selectField" label="" variant="label-hidden" onchange="{!c.fieldSelected}" > The space you see ...
manjit5190's user avatar
  • 8,043
3 votes

How to center lightning:select components in a table

You might need to make use of the STYLE file of the lightning component bundle to overwrite any standard SLDS styles. You need to find the correct CSS tag by Inspecting Element on any web browser and ...
SatyaV's user avatar
  • 1,533
3 votes
Accepted

jQuery append not working on custom lightning component

When you are not using native lightning javascript APIs to get elements from DOM (like jQuery), it will cross the component boundary and get all the elements matching the identifications. For example, ...
salesforce-sas's user avatar
3 votes
Accepted

How to get the width of a table inside a LWC to adapt to the widths of its columns?

This is actually a function of SLDS, not Aura or LWC specifically. Try this in a new Lightning Application: <aura:application> <table> <tr> <td>...
sfdcfox's user avatar
  • 497k
3 votes

Visualforce components disappeared after an action

I'm not sure about the "why" your problem happens, but I would try solving it by narrowing the scope of the rerender, e.g. try to rerender a panel around your <table> element: <apex:...
Francesco Pitzalis's user avatar
3 votes

Make onclick row in table LWC

Here you can use data_table_custom_types which Lighting data table provides. Just for opening records with onClick option no need of going full custom. We can extend Lighiting datatable and build an ...
Nagendra Singh's user avatar
3 votes
Accepted

How can I get the value of the selected radio button?

id attributes are usually changed in lightning. You can use another attribute probably accessKey or any other data-attribute that could tell you which row was actually checked. You can maintain it as ...
Sachin Hooda's user avatar
  • 1,642
2 votes
Accepted

Dynamically control table style (height, width etc.)

It's failing to compile because it doesn't like the standalone {!a}, but with a small change it should work: public class Cntl_DynamicTableWidth { String a{set; get;} public ...
Phil Hawthorn's user avatar
2 votes

Create PageBlockTable With Two Types Of SObject

Although I like Larson's answer above, I think it is better to organize the data in the Apex layer, and minimize the logic in the presentation/VF layer. In this case, you could make a custom object ...
SeanW's user avatar
  • 702

Only top scored, non community-wiki answers of a minimum length are eligible