+ Start a Discussion
raghavendra kiran 9raghavendra kiran 9 

createComponent bug Everything is Working but Data is not displaying, even onrowselection is working well

public class ContactClass {
@AuraEnabled
    public static list<contact> getCon(){
        list<contact> con =[select id,firstname,lastname,phone,email from contact ];
        return con;
    }
}
component:
<aura:component controller='ContactClass' implements='force:appHostable'>
    <aura:attribute name='myContact' type='object'/>
    <aura:attribute name='myColumn' type='list'/>
    <aura:handler name='init' value='{!this}' action='{!c.doit}'/>
    <p>Dynamically created Table</p>
    <lightning:button label='Viewdatatable' variant='inverse' onclick='{!c.done}'/>
    {!v.body}
</aura:component>
 
controller:

({
    doit : function(component, event, helper) {
        component.set('v.myColumn',[
            {label:'FirstName',field:'FirstName',type:'text'},
            {label:'LastName',field:'LastName',type:'text'},
            {label:'Phone',field:'Phone',type:'phone'},
            {label:'Email',field:'Email',type:'email'}
        ]);
       var c= component.get('c.getCon');
        c.setCallback(this,function(response){
            var state= response.getState();
            alert(state);
            if(state=='SUCCESS'){
                var result = response.getReturnValue();
                component.set('v.myContact',result);
            }else{
                alert('error');
            }
        });
        $A.enqueueAction(c);
    },
    getSelect:function(component,event,helper){
        var select= event.getParam('selectedRows');
        alert(select);
    },
    done:function(component,event,helper){
         $A.createComponent('lightning:datatable',
                           {
                               'keyField':'Id',
                               'columns':component.get('v.myColumn'),
                               'data':component.get('v.myContact'),
                               'maxRowSelection':'3',
                               'onrowselection':component.getReference('c.getSelect')
                           },
                           function(comp,status,errorMessage){
                               if(status=='SUCCESS'){
                                   alert('this'+status);
                                   var bdy = component.get('v.body');
                                   bdy.push(comp);
                                   component.set('v.body',bdy);
                               }else if(status=='INCOMPLETE'){
                                   alert('incomplete');
                               }else if(status=='ERROR')
                                   alert(errorMessage);
                           }
                           
        );
    }
})
 
Best Answer chosen by raghavendra kiran 9
Rishab TyagiRishab Tyagi
Hello raghavendra kiran,

You can update the 'field' key to 'fieldName' in your doit function:

component.set('v.myColumn',[
            {label:'FirstName',fieldName:'FirstName',type:'text'},
            {label:'LastName',fieldName:'LastName',type:'text'},
            {label:'Phone',fieldName:'Phone',type:'phone'},
            {label:'Email',fieldName:'Email',type:'email'}
        ]);

This must resolve the issue that you are facing.

All Answers

Rishab TyagiRishab Tyagi
Hello raghavendra kiran,

You can update the 'field' key to 'fieldName' in your doit function:

component.set('v.myColumn',[
            {label:'FirstName',fieldName:'FirstName',type:'text'},
            {label:'LastName',fieldName:'LastName',type:'text'},
            {label:'Phone',fieldName:'Phone',type:'phone'},
            {label:'Email',fieldName:'Email',type:'email'}
        ]);

This must resolve the issue that you are facing.
This was selected as the best answer
raghavendra kiran 9raghavendra kiran 9
Thank you  Rishab Tyagi, it has resolved ....  :)