Apex Code Development You need to sign in to do that
Don't have an account?
Saravana Bharathi 1 Lightning - Rendering is not working
Hi All,
I am a newbie to Lightning component Development.
I have written a lightning component, which holds Text Input, and a button.
When User enters some text in the text field, by clicking a button. I am calling a javascript controller, then to Javascript Handler, then to Apex Controller. I am searching and returning the result to handler, to javascript handler and then to component attribute values.
I am setting Response to Component attribute in Handler.
I am not getting the response in UI. When I debugged using Lightning Inspector - Chrome Extensions, Actions are successful, and I am getting result in the attributes.
Please let me know, whether i am missing anything.
Thanks in advance.
I am a newbie to Lightning component Development.
I have written a lightning component, which holds Text Input, and a button.
When User enters some text in the text field, by clicking a button. I am calling a javascript controller, then to Javascript Handler, then to Apex Controller. I am searching and returning the result to handler, to javascript handler and then to component attribute values.
I am setting Response to Component attribute in Handler.
I am not getting the response in UI. When I debugged using Lightning Inspector - Chrome Extensions, Actions are successful, and I am getting result in the attributes.
Please let me know, whether i am missing anything.
Thanks in advance.
Kindly add the below changes
var outputList = a.getReturnValue();
//expenses.push(a.getReturnValue());
for(var key in outputList){
console.log(outputList[key].Name);
expenses.push(outputList[key]);
}
List of contacts are displayed in the Lightning App as expected
Let me know any queries
Thanks & Regards
Parthiban OSL
Website:- https://parthibanosl.wordpress.com
Mail:- parthibanosl@gmail.com
All Answers
Did you check FLS? Also, looking at code would be helpful.
Best,
Dev
Attaching my code for your reference.
Component:
<aura:component controller="FirstController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
<ltng:require styles="/resource/slds090/assets/styles/salesforce-lightning-design-system.min.css"/>
<aura:attribute name="entervalue" type="string" />
<aura:attribute name="listOfContacts" type="Contact[]" />
<ui:inputText label="Enter some text" value="{!v.entervalue}" />
<ui:button label="Submit" press="{!c.searchtext}"/>
<aura:renderif isTrue="true">
<aura:iteration items="{!v.listOfContacts}" var="contactvalue">
{!contactvalue.Id}
</aura:iteration>
</aura:renderif>
</aura:component>
Javascript Controller
({
searchtext : function(component,event,helper) {
helper.searchMethod(component);
}
})
Helper
({
searchMethod : function(component) {
var enteredvalue = component.get("v.entervalue");
alert('What is the value '+enteredvalue);
this.searching(component,enteredvalue,function(a)
{
var expenses = component.get("v.listOfContacts");
expenses.push(a.getReturnValue());
component.set("v.listOfContacts",expenses);
})
},
searching : function(component,enteredvalue,callback)
{
alert('Before calling controller');
var action = component.get("c.getSearchResult");
action.setParams({"enteredvalue":enteredvalue});
if(callback)
{
action.setCallback(this, callback);
}
$A.enqueueAction(action);
}
})
Apex Controller:
public class FirstController
{
@AuraEnabled
public static List<Contact> getSearchResult(String enteredvalue)
{
List<Contact> listOfContacts = [Select Id,Name From Contact Where Name=:enteredvalue];
System.debug('Is it coming inside '+listOfContacts);
return listOfContacts;
}
}
Change the below line in the helper class.
component.set("v.listOfContacts",a.getReturnValue());
Best,
In these lines, I am trying to add to existing list to show in UI.
For example: For 1st time, when user enters search text and clicks search , listofcontacts will have 3 element, with the same search text, if user clicks search again, listofcontact will have 6 elements.
var expenses = component.get("v.listOfContacts");
expenses.push(a.getReturnValue());
component.set("v.listOfContacts",expenses);
Whereas, you have given the lines to set the updated result to the List to show it in UI. It will be overridden. For the same example, it will show always 3 in the listofContacts.
Can you explain, what is problem in those three lines.
Thanks
Apologies for not understanding your use case properly. Nevertheless, the issue seems to be with expenses.push(). After the push, the resulting Array Object contains a Contact Object + Array of Contact Obj and hence not rendering properly in UI
Expenses before push is -->[{"Id":"003F000001RDGkoIAH","Name":"Jack Rogers"}]
Expenses after push is -->[{"Id":"003F000001RDGkoIAH","Name":"Jack Rogers"},[{"Id":"003F000001RDGkoIAH","Name":"Jack Rogers"}]]
Best,
In VF page, it's easy to maintain variable value and we can add to it.
In lightning, Can't we achieve this?
Thanks
Kindly add the below changes
var outputList = a.getReturnValue();
//expenses.push(a.getReturnValue());
for(var key in outputList){
console.log(outputList[key].Name);
expenses.push(outputList[key]);
}
List of contacts are displayed in the Lightning App as expected
Let me know any queries
Thanks & Regards
Parthiban OSL
Website:- https://parthibanosl.wordpress.com
Mail:- parthibanosl@gmail.com