1

I was doing the trailhead lightning-restaurant-locator And the trailhead is showing how to use Get request so by looping through the response, name and views are in a list. Now I want to add star for rating in each list so other contacts can also see what a person has rated the restaurant. I put the stars there but if I will refresh or go to other contacts it can remove.

enter image description here

So how can I add the star and post them for others to see the rating in lightning component. I am new to salesforce so facing some troubles.

InTheArea.cmp

<div class="slds-scrollable--y scroll-container" aura:id="scrollableArea">
      <ul class="slds-list--vertical slds-has-dividers--top-space">
          <aura:iteration items="{!v.restaurantList}" var="item" indexVar="i">
              <li class="slds-list__item" onclick="{!c.showDetails}" data-record="{!i}">
                  <h3 class="slds-text-heading--small slds-m-bottom--x-small">{!item.name} </h3>
                  <img src="{!item.ratingImg}" alt="" class="ratingStars" />
                  <div class="slds-hide" data-details="{!i}">
                      <ul class="slds-list--vertical">
                          <li class="slds-list__item">{!item.address}</li>
                          <li class="slds-list__item">{!item.city}, {!item.state}</li>
                          <li class="slds-list__item">{!item.phone}</li>
                          <ui:button class="slds-button slds-button_success" label="RateTheRestaurant" press="{!c.handleClick}" />
                      </ul>
                      <div class="slds-media slds-m-top--medium">
                          <div class="slds-media__figure">
                              <img src="{!item.image}" class="slds-avatar--large slds-avatar--circle" alt="Placeholder" />
                          </div>
                          <div class="slds-media__body">
                              <p>{!item.review}</p>
                              <img src="/img/samples/stars_000.gif" class="imgEmp"/>
                              <img src="/img/samples/stars_100.gif" />
                              <img src="/img/samples/stars_200.gif" />
                              <img src="/img/samples/stars_300.gif" />
                              <img src="/img/samples/stars_400.gif" />
                              <img src="/img/samples/stars_500.gif" />                                  
                              <input type="text" id="text1" class="slds-input" placeholder="Review" />
                                <div class="rating_bar"> 
                                    <span class="rate_1" onclick="{!c.bandleClick}">1</span>
                                    <span class="rate_2" onclick="{!c.bandleClick}">2</span>
                                    <span class="rate_3" onclick="{!c.bandleClick}">3</span>
                                    <span class="rate_4" onclick="{!c.bandleClick}">4</span>
                                    <span class="rate_5" onclick="{!c.bandleClick}">5</span>                        
                                </div>
                              <div class="rating">
                <span>☆</span><span>☆</span><span>☆</span><span>☆</span><span>☆</span>

      <ui:inputText label="Name" aura:id="fame" placeholder="First" change="{!c.getInput}"/>
        <!--<ui:outputText aura:id="nameOutput" value=""/>-->
           <ui:button aura:id="outputButton" label="Submit" press="{!c.getInput}"/>
<p>{!v.para}</p>

InTheAreaController.js

handleClick : function(cmp, event) {
        confirm("Do you Really want to save this Form");
},
    bandleClick : function(cmp, event) {
        alert("Thanks for your Feedback!");
},
  • 3
    Hi, and welcome to SFES! Please edit your question to include any code that you've written so far, so we can further assist you. Please read How to Ask and take the tour for more information. – sfdcfox May 13 '18 at 16:40
  • Hi, Thanks for replying. As I mentioned that I am new to salesforce so I added several form of stars for testing and add alert and confirm there – U. Ali May 13 '18 at 17:05
  • I am trying to get the concept that how Can I post the star rating fixed so others can also see. I feel there can be post request that can update the rest api and can fetch the star value so others can also see. However, I am not sure. Help will be highly appreciated. – U. Ali May 13 '18 at 17:06
  • 2
    You can use the Lightning Data Service to store the value back to the record. There's also a trailhead and sample you can look at, too. There's lots of information on how to do this. – sfdcfox May 13 '18 at 17:11
  • Thanks for sharing, I do this trailhead to get the complete idea. – U. Ali May 13 '18 at 17:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.