• Ricardo Coutinho 7
  • NEWBIE
  • 40 Points
  • Member since 2016

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 7
    Questions
  • 8
    Replies
Hi,
When we work on VisualForce pages we can hide the header and the sidebar for the Salesforce Classic.
I'm developing Lightning Components, how can i hide the sidebar of the Lightning Experience?
Hi :)

I'm developing some Lightning Components and i have a big project in VisualForce Pages.
I want to replace some of the features for Lightning Components, for instance, i have a search system, and the ideia is to replace that search with a lightning component search.
Can i combine a lightning component search with results in VisualForce Pages?
My doubt is: If i search something, the results will appear in the VisualForce Pages like normal? Or i need to create another component to show the results?

Thanks
Hi,
I'm trying to replace a checkbox with an image in lightening components.
I'm following the exact same code on Lightening Developer Guide but it's not working the same way, because my code hides the checkbox but doesn't replace the label for an image.

I'm following this: https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/ui_checkbox.htm

My checkbox on component:
<ui:inputCheckbox value="{!v.Artigos.Publicado__c}" labelClass="check" label="Select?" click="{!c.update}"/>

My CSS:
.THIS input[type="checkbox"] {
    display:none;
}

.THIS input[type="checkbox"]+label {
    display: inline;
    width:80px;
    height:auto;
    background: url('http://www.clker.com/cliparts/a/e/7/2/1314063744989836278red%20ball.png') top left;
	cursor:pointer;
}

.THIS input[type="checkbox"]:checked+label {
    background:url('http://www.happypinguins.nl/en/web_pictures/Green%20ball-01.png') bottom left;
    width:80px;
    height:auto;
    cursor:pointer;
 }
The result of this is: "Select?" i tried to inspect the element and there's no css associated with the label, so my first line of code it's working because the checkbox is hidden, but the other CSS it's not working, am i doing something wrong? Because i'm using the exact same code from the developer guide.

 
Hi,

I'm making a lightning component that list the contacts and we can search them or add new ones.
I'm following the Lightning Developer Guide, they have a lightning component for expenses and i'm just addapting to contacts.

Everything works fine, but when i try to add a new contact it gives me an error in the Developer Console logs:
"Attempted to upsert a null list"

I already tested the apex class and i see the debug, so i don't know exactly what's happening.

 Apex Class
@AuraEnabled
    public static Contact SaveContacts(Contact contact) {
    system.debug('Yes');
    upsert contact;
    return contact;
    }

My Input Form component
<aura:component implements="force:appHostable" controller="ContactsApexClass">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:handler event="c:SearchKey" action="{!c.SearchKey}"/>
  <ltng:require styles="{!$Resource.SLDS + '/assets/styles/salesforce-lightning-design-system.css'}"/>
  <aura:attribute name="contacts" type="Contact[]"/>
  <aura:attribute name="NewContact" type="Contact"
         default="{ 'sobjectType': 'Contact',
                         'Name': '',
                         'Birthdate': '',
                         'MailingStreet': '', 
                         'Email': ''
                       }"/>
 
  <!-- Attributos do Contador -->
  <aura:attribute name="exp" type="Double" default="0" />
    
   <ui:button label="JQuery Test"
                		class="slds-button slds-button--neutral"
                		labelClass="label"
                		press="{!c.teste}"/> 
    
    <!-- Contador -->
  <div class="container slds-p-top--medium">
        <div class="row">
            <div class="slds-tile ">
                <div class="slds-notify slds-notify--toast slds-theme--alert-texture">
                      <p class="slds-tile__title slds-truncate">Número de Contactos</p>
                      <ui:outputNumber class="slds-truncate" value="{!v.exp}"/>
                  </div>
            </div>
        </div>
    </div>
    
  <!-- Input Form -->
  <div class="container">
    <form class="slds-form--stacked">
      <div class="slds-form-element slds-is-required">
        <div class="slds-form-element__control">

          <ui:inputText aura:id="contactname" label="Nome"
                        class="slds-input"
                        labelClass="slds-form-element__label"
                        value="{!v.NewContact.Name}"
                        placeholder="Nome" required="true"/>
         </div>
       </div>
       <div class="slds-form-element slds-is-required">
         <div class="slds-form-element__control">
           <ui:inputDate aura:id="contactbirth" label="Data de Nascimento"
                           class="slds-input"
                           labelClass="slds-form-element__label"
                           value="{!v.NewContact.Birthdate}"
                           required="true"/>
          </div>
        </div>
        <div class="slds-form-element">
          <div class="slds-form-element__control">
            <ui:inputText aura:id="contactadress" label="Morada"
                          class="slds-input"
                          labelClass="slds-form-element__label"
                          value="{!v.NewContact.MailingStreet}"
                          placeholder="Avenida Cidade BL2, 1D" required="true"/>
           </div>
         </div>
          <div class="slds-form-element">
          <div class="slds-form-element__control">
            <ui:inputText aura:id="contactemail" label="Email"
                          class="slds-input"
                          labelClass="slds-form-element__label"
                          value="{!v.NewContact.Email}"
                          placeholder="nome@dominio.com"/>
           </div>
         </div>
        <br></br>
                        <ui:button label="Submit"
                		class="slds-button slds-button--neutral"
                		labelClass="label"
                		press="{!c.CreateContact}"/>
    </form>
  </div><!-- ./container-->
<br></br>
    <aura:iteration items="{!v.contacts}" var="contact">
        <c:ContactsList contact="{!contact}"/>
 </aura:iteration>
</aura:component>

My controller
({		      
    	doInit : function(component, event, helper) {
       helper.getContacts(component);
    	},
    
    	CreateContact : function(component, event, helper) {
            var fields = ["contactname", "contactbirth", "contactadress"];
            var errors = ["Introduza um nome válido.","Introduza uma data de nascimento válida.","Introduza uma morada válida."  ];
            var erro = 0;
    			for (var i = 0; i < fields.length; i++){
                var field = component.find(fields[i]);
                var fieldValue = field.get("v.value");
                	if (fieldValue == ''){
                    field.set("v.errors", [{message:errors[i]}]);
                    erro = 1;
               		} else {
                    field.set("v.errors", null); 
                	}
				}
            		if (erro == 0){
                	var NewContact = component.get("v.NewContact");
                	helper.CreateContact(component, NewContact);
            		}
		},
    
    	updateEvent : function(component, event, helper) {
    	helper.upsertContact(component, event.getParam("contact"));
		},
    	
    	SearchKey: function(component, event) {
    	var searchKey = event.getParam("searchk");
    	var action = component.get("c.findByName");
    	action.setParams({
      	"searchKey": searchKey
    	});
    	action.setCallback(this, function(a) {
        component.set("v.contacts", a.getReturnValue());
    	});
    	$A.enqueueAction(action);
		}

})

My Helper:
({
    getContacts: function(component) {
		var action = component.get("c.getContacts");
		action.setCallback(this, function(response) {
		var state = response.getState();
			if (component.isValid() && state === "SUCCESS") {
			component.set("v.contacts", response.getReturnValue());
			this.updateTotal(component);
			}
		});	
		$A.enqueueAction(action);
	},		
  
    updateTotal : function(component) {
		var contacts = component.get("v.contacts");
			for(var i=0; i<contacts.length; i++){
			var e = contacts[i];
			}
		//Update contador
		component.set("v.exp", contacts.length);
	},	

	CreateContact: function(component, contact) {
    	this.upsertContact(component, contact, function(a) {
        var contacts = component.get("v.contacts");
        contacts.push(a.getReturnValue());
        component.set("v.contacts", contacts);
        this.updateTotal(component);
      	});
		},

    upsertContact : function(component, contact, callback) {
    	var action = component.get("c.SaveContacts");
   		action.setParams({ 
        "Contact": contact
    	});
   	 		if (callback) {
      		action.setCallback(this, callback);
    		}
    			$A.enqueueAction(action);
	}  
})




 
Hi Guys,
I created a field for contacts name: "image" and now i'm trying to import the image to a lightning component.
I have this code:
<tbody>
    <tr>
      <td data-label="Picture" title="Pic">
         <p>{!contact.Image__c}</p>
      </td>
      <td data-label="Name" title="Name">
        <p>{!contact.Name}</p>
      </td>
      <td data-label="birthdate" title="birthdate">
        <p>{!contact.Birthdate}</p>
      </td>
      <td data-label="Steet" title="street">
          <p>{!contact.MailingStreet}</p>
      </td>
      <td data-label="Email" title="email">
        <p>{!contact.Email}</p>
      </td>
    </tr>
  </tbody>
But the final import is this:

User-added image
As you can see, he is importing the field but i don't know why the image is not showing, instead he show's the code...
 
Hello,
I'm designing a lightening component and i have a table with my own CSS, now i added a button but i cant style him, i already tried a few things but he is always with the standard style.
<ui:button aura:id="button1" label="Filter" class="FirstButton"/>
I already tried this:
.THIS FirstButton {
    background-color: #3A84C2;
    color:#fff;
}
.THIS.uiButton FirstButton {
    background-color: #3A84C2;
    color:#fff;
}
FirstButton.THIS {
    background-color: #3A84C2;
    color:#fff;
}


I already tried to add !Important but nothing seems to work...


 
Hi,
I just finished the "Handle Actions with Controllers" challenge but i can't get the component to work on the app that we use on this module (harnessApp).

My App:
<aura:application >
    <c:campingListItem/>
</aura:application>
This error appear's
"Something has gone wrong. [NoErrorObjectAvailable] Aura.loadComponent(): Failed to initialize application. An internal server error has occurred Error ID: 1922741726-25604 (1683235083) . Please try again."

My component:
<aura:component >
    <aura:attribute name="item" type="Camping_Item__c" required="true"/>
        <p>Name:
        <ui:outputText value="{!v.item.Name}"/>
    </p>
    <p>Price:
        <ui:outputCurrency value="{!v.item.Price__c}"/>
    </p>
    <p>Quantity:
        <ui:outputNumber value="{!v.item.Quantity__c}"/>
    </p>
    <p>Status:
        <ui:outputCheckbox value="{!v.item.Packed__c}"/>
    </p>
    
    <ui:button label="Packed!" press="{!c.packItem}"/>
</aura:component>
My controller:
({
    packItem: function(component, event, helper) {
		var a = component.get("v.item",true);
 		a.Packed__c = true;
 		component.set("v.item",a);
        var btnClicked = event.getSource();
        btnClicked.set("v.disabled",true);
    }
})

What am i doing wrong?
Hi,
When we work on VisualForce pages we can hide the header and the sidebar for the Salesforce Classic.
I'm developing Lightning Components, how can i hide the sidebar of the Lightning Experience?
Hello Everyone,

I want to change image src in lightning component from lightning controller.
 
<aura:component >
    <img aura:id="imgid" src="/files/image_name.jpg" ></img>
    <ui:inputCheckbox aura:id="checkbox" label="Select?" change="{!c.onCheck}"/>
</aura:component>
 
({
        onCheck: function (cmp, event, helper) {
            var checkCmp = cmp.find("imgid");
            checkCmp.set("v.value", "/files/new_image_name.jpg");
        }
    })

But with cmp.find("imgid") not able to change the src of image. Any one have a syntax example that they know works.
 
Thanks!
Hi all,

I am trying out lightning quick start app. I have been following instructions from the guide. I copy pasted the code from quickstart guide into my development org. But I could not figure out what is wrong with lightning design system css. Did anyone come across this before(see image below)? Trying to resolve the issue, I tried creatting the static resource for lightning design system css in my dev org but that does not seem to work either. How do I import the stylesheet in the app? is there any specific way that I am completely missing.

User-added image
Hi Guys,
I created a field for contacts name: "image" and now i'm trying to import the image to a lightning component.
I have this code:
<tbody>
    <tr>
      <td data-label="Picture" title="Pic">
         <p>{!contact.Image__c}</p>
      </td>
      <td data-label="Name" title="Name">
        <p>{!contact.Name}</p>
      </td>
      <td data-label="birthdate" title="birthdate">
        <p>{!contact.Birthdate}</p>
      </td>
      <td data-label="Steet" title="street">
          <p>{!contact.MailingStreet}</p>
      </td>
      <td data-label="Email" title="email">
        <p>{!contact.Email}</p>
      </td>
    </tr>
  </tbody>
But the final import is this:

User-added image
As you can see, he is importing the field but i don't know why the image is not showing, instead he show's the code...
 
I want to show formula field that is in Lead Object,And this formula field contains Image. when i call this field in component in OutputText it show url of Image. please help me. I don't know how to use OUTPUTRICHTEXT
Component:

<aura:component controller="LeadLightningContoller">
	 <ltng:require styles="/resource/SLDS103/assets/styles/salesforce-lightning-design-system.min.css"/>
    <aura:attribute name="Leads" type="Lead[]"/>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

 <aura:iteration items="{!v.Leads}" var="lead">

 <ui:outputText value="{!lead.Rating_Image__c}"/>

 </aura:iteration>
 
helper Class

({
	getLeadList : function(component) {
        
        var action=component.get("c.ShowLead");
        action.setCallback(this,function(res){
           
            var status=res.getState();
            if(status=="SUCCESS"){
                component.set("v.Leads",res.getReturnValue());
            }
        });
		$A.enqueueAction(action);
	}
})
Controller


public class LeadLightningContoller {
    
    @AuraEnabled
    public static List<Lead> ShowLead(){
        
        List<Lead> leadList=new List<Lead>();
        
        leadList=[select Name,Email,Status,Phone,No_of_days_Open__c,Rating,Fax,Rating_Image__c from Lead limit 10];
        return leadList;
       
    }

}
Application

<aura:application >
  <c:LeadData />
</aura:application>