• Harish Sridhar 10
  • NEWBIE
  • 5 Points
  • Member since 2017

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 4
    Questions
  • 2
    Replies
Hello, I have two components ie. when I click on TileSample.cmp it opens up with the details page of SegmentDetail.cmp. I am facing an isue when for example when I click on a 1st recond in the tile sample it is loading the details, then when I immediately go back click on the second tile record it is only desplaying the old values and only upon the second click it is loading the actual values. Can someone help me here?

I.e. WHen I click the 1st record int he tileSample.cmp it is loading the deatils and when I go back and click on the 2nd Tile record it is showing up the old records value(1st record in the TileSample.cmp). Then when I go back again and click the 2nd record on the TileSample.cmp page then only it is showing the correct values.

tileSample.cmp
<aura:iteration items="{!v.Segments}" var="seg" indexVar="i">
                <lightning:layoutItem size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default" >
                    
                    <ul class="slds-has-dividers_around-space">
                        <li class="slds-item">
                            <lightning:tile class="slds-tile_board">
                                <h4 class="slds-tile__title slds-truncate" title="{!seg.segmentNumber}" onclick="{!c.openSegmentDetail}" id="{!i}"><a href="javascript:void(0);">{!seg.segmentNumber}</a></h4>
                                <b>Customer Name:</b>    <p class="slds-text-heading_medium">{!seg.customerName}</p>
                                <!--     <b>tourId :</b>         <p class="slds-text-heading_medium">{!seg.customerName}</p> -->
                                <b>Customer Rate:</b>    <p class="slds-truncate"><a href="#">{!seg.customerRate}</a></p>
                                <div class="slds-truncate" title="Biddable" >
                                    <div class="slds-form-element">
                                        <label class="slds-checkbox_toggle slds-grid">
                                            <span class="slds-form-element__label slds-m-bottom_none">Biddable</span>
                                            <ui:inputCheckbox value="" />
                                            <span id="toggle-desc" class="slds-checkbox_faux_container" aria-live="assertive">
                                                <span class="slds-checkbox_faux"></span>
                                            </span>
                                        </label>
                                    </div>
                                </div>
                            </lightning:tile>
                        </li>
                    </ul>
                </lightning:layoutItem>
            </aura:iteration>
TileSampeController.js
({
    doInit : function(component, event, helper) {
        var action = component.get('c.getSegments');
        // Set up the callback
        action.setCallback(this, function(actionResult) {
            console.log('segList***'+actionResult.getReturnValue()[0].customerName);
            component.set('v.Segments', actionResult.getReturnValue());
        });
        $A.enqueueAction(action);
 },
    openSegmentDetail : function(component, event, helper) {
        console.log('Enter Here');
        var index = event.currentTarget.getAttribute('id');
        console.log('index id**'+index);
        var segments = component.get('v.Segments');
        /*
        var evt = $A.get("e.force:navigateToComponent");
        console.log('evt'+evt);
        
        evt.setParams({
            componentDef: "c:SegmentDetail",
            componentAttributes :{ 
                segment:segments[index]
            }
        });
        
        evt.fire();
        */
        var navService = component.find("navService");
        var pageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__SegmentDetail",
                
            }, 
            "state": {
                "c__segment":segments[index]
                //"c__segmentIndex":index
            }
        };
         
        navService.navigate(pageReference);
        //$A.get('e.force:refreshView').fire();
    },
    
})

SegmentDetail.cmp
<aura:component controller="SegmentController" implements="flexipage:availableForAllPageTypes,lightning:isUrlAddressable" access="global" >
*******
<lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                <div class="header-column">
                    <!--<h1> <p class="field-title" title="Field 1">Customer Name</p> </h1>-->
                    <h6> <b><p>{!v.segment.customerName}</p></b> </h6>
                </div>
            </lightning:layoutItem><br/>
            
            <lightning:tabset variant="horizontal">
                <lightning:tab label="Details" >
                    <lightning:layout class="slds-scrollable" multipleRows="true">
                        <lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                            <div class="header-column">
                                <p class="field-title" title="Field 1">Customer Name</p>
                                <p>{!v.segment.customerName}</p>
                            </div>
                        </lightning:layoutItem><br/>
                        
                        <!--    <lightning:layoutItem padding="around-small">
                <div class="header-column">
                    <p class="field-title" title="Field2 (3)">Field 2 (3)
                        <lightning:buttonIcon iconName="utility:down" variant="border-filled" size="small" alternativeText="More Actions" />
                    </p>
                    <p>Eligibltiy</p>
                </div>
            </lightning:layoutItem>
        
     -->   
                        <lightning:layoutItem padding="around-small" size="12" class="slds-border_bottom slds-p-bottom_small slds-p-left_x-small slds-p-top_medium slds-theme_default">
                            <div class="header-column">
                                <p class="field-title" title="Field 1">Segment Number</p>
                                <p>{!v.segment.segmentNumber}</p>
                            </div>
                        </lightning:layoutItem><br/>
</aura:component>

SegmentDetailController.js
({
    BidDetailList : function(component, event, helper) {
        console.log('Entering Bidlevel');
        
        var navService = component.find("navService");
        var pageReference = component.get("v.pageReference");
        var newPageReference = {
            "type": "standard__navItemPage",
            "attributes": {
                "apiName": "All_Segments",
            },
            "state": {
                "c__segmentIndex":undefined
            }
        };
        navService.navigate(newPageReference);
    },
    
    segmentListComponent : function(component, event, helper) {
        console.log('Enter Here');
        /*
        var evt = $A.get("e.force:navigateToComponent");
        console.log('evt'+evt);
        evt.setParams({
            componentDef: "c:TileSample",
            componentAttributes :{ 
            }
        });
        
        evt.fire();
        */
        var navService = component.find("navService");
        var pageReference = component.get("v.pageReference");
        var newPageReference = {
            "type": "standard__navItemPage",
            "attributes": {
                "apiName": "All_Segments",
            },
            "state": {
                "c__segmentIndex":undefined
            }
        };
        navService.navigate(newPageReference);
    },
    doInit : function(component, event, helper) {
        
        console.log('Enter Segment Detail');
        var bids =component.get('v.bids');
        var bid={
            amount :"100$",
            createdDate :"07/30/2018",
            status : "OPEN",
            tourId : "Tour123",
            originCity : "Omaha",
            originState : "Nebraska",
            destinationCity : "San Francisco",
            destinationState : "California",
            Weight : "1000 lbs",
            tourStatus : "Shipped - Through Truck"
        }
        bids.push(bid);
        var bid2={
            amount :"90$",
            createdDate : "07/31/2018",
            status : "OPEN",
            tourId : "Tour123",
            originCity : "Omaha",
            originState : "Nebraska",
            destinationCity : "Los Angeles",
            destinationState : "California",
            Weight : "2000 lbs",
            tourStatus : "Awaiting Shipping - Through Airways"
            }
        bids.push(bid2);
        component.set('v.bids',bids);
        alert("No. of Bids"+bids.length);
        component.set("v.bidsCount",bids.length);
        var pageReference = component.get("v.pageReference");
        /*console.log('Page Reference***'+pageReference);
        console.log('segment***'+pageReference.state.c__segment);
        console.log('segment index#'+pageReference.state.c__segmentIndex);
        */
        component.set("v.segment",pageReference.state.c__segment);
        pageReference = Object.assign(pageReference,{"state": {
                "c__segment":undefined,
            "c__segmentIndex":undefined
        }});
        component.set("v.pageReference",pageReference);
        /*
        
          var newPageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__SegmentDetail",
                
            }, 
            "state": {
                "c__segment":undefined
            }
        };
        
        pageReference = Object.assign(pageReference,newPageReference);
        console.log('page ref updated**');
        //component.set("v.pageReference",pageReference);
        //*/
    }
})
Hello,

AM in process of creating lightning components for mobile app, my requirement is such that if I click on a lightning tile it should navigate to an another page. As far as I have checked there is no action attribute for lightning tile, could someone please let me know how to implement this?

Harish
Hello,

I am actually in a process of building lightning components for Salesforce App(For Mobile), I need to design the UI same as if like it look for Standard object(Accounts,Contacts) if opened via mobile App including the looks of related list. Should look like below.User-added image
User-added image
User-added image
 
So here the cursor & limit here I have hardcoded and is now working fine.
So my real requirement is here limit is always a constant and the cursor value increases based on the limit.

Lets take now for the first time the URL is,
https://xyz/abcHistory?apiKey=SupportApiKeyQA&wrap=true&ref=TechSupportDiagTool&cursor=1000&limit=10
the next time my cursor value must alone increase by 10. and the endpoint must be.
https://xyz/abcHistory?apiKey=SupportApiKeyQA&wrap=true&ref=TechSupportDiagTool&cursor=1010&limit=10
Here I know we need to use custom setting, can somebody please help me?
i.e. the cursor value in the custom setting alone must increase by limit value.
 
hi all
any idea how to keep a <div> fixed in lightning?
slds-is-fixed/style="position:fixed works fine in chrome desktop version to fix my footer.but not working in salesforce1.any help wud be appreciated.Thanks in advance.