-1

I am unable to trigger the action for radio button in lightning component.

Here is the code for the radio button:

<aura:attribute name="opportunities" type="Opportunity[]" />
<aura:attribute name="page" type="integer"/>
<aura:attribute name="pages" type="integer"/>
<aura:attribute name="total" type="integer"/>
<aura:attribute name="searchKey" type="String" default=""/>

<aura:handler name="init" value="{!this}" action="{!c.doInit}" /> 
<aura:handler event="c:SearchBarEvent" action="{!c.searchKeyFunction}"/>
<aura:handler event="c:PageChange" action="{!c.pageChange}"/>
<div class="slds-grid slds-grid--align-spread">
    <c:SearchBarCmpt />

    <fieldset class="slds-form-element">
        <div class="slds-form-element__control">
            <label class="slds-radio">
            <input type="radio" name="options" onClick="{!myOpps}"/>
            <span class="slds-radio--faux"></span>
            <span class="slds-form-element__label">My Opportunities</span>
            </label>
            <label class="slds-radio">    
            <input type="radio" name="options"/>
            <span class="slds-radio--faux"></span>
            <span class="slds-form-element__label">All Oportunities</span>
            </label>
        </div>
    </fieldset>

    <div class="slds-form-element">
        <div class="slds-form-element__control">
            <label class="slds-checkbox">
            <input type="checkbox" name="options" id="checkbox-01" />
            <span class="slds-checkbox--faux"></span>
            <span class="slds-form-element__label">Open Opportunities</span>
            </label>
        </div>
    </div>

    <div>
        <button class="slds-button slds-button--neutral">New Opportunity</button>
    </div>

</div>
<table class="slds-table slds-table--bordered slds-table--striped">
    <thead>
        <tr class="slds-text-heading--label">
            <th width="20%"><span class="slds-truncate"><strong>Owner</strong></span></th>
            <th width="35%" scope="col"><span class="slds-truncate"><strong>Name</strong></span></th>
            <th width="10%" scope="col"><span class="slds-truncate"><strong>CloseDate</strong></span></th>
            <th width="15%" scope="col"><span class="slds-truncate"><strong>Stage</strong></span></th>
        </tr>
    </thead>
    </table>

    <aura:iteration items="{!v.opportunities}" var="opportunities">
       <c:AccOppListItem opportunities="{!opportunities}"/>  
    </aura:iteration>


<c:Paginator page="{!v.page}" pages="{!v.pages}" total="{!v.total}"/>

In the action of radio I am calling controller function called myopps.

myOpps: function(component, event, helper) {    
    var page = 1;
    helper.getMyOpps(component,event, page);
}

helper

({
  getOpps: function(component, event, page) {
    page = page || 1;
    var action = component.get("c.findByPage");
    action.setParams({
        "pageNumber": page
    });
    action.setCallback(this, function(a) {
        var result = a.getReturnValue();
        component.set("v.opportunities", result.entries);
        component.set("v.page", result.page);
        component.set("v.total", result.total);
        component.set("v.pages", Math.ceil(result.total/result.pageSize));
    });
    $A.enqueueAction(action);
},

getMyOpps: function(component, event, page) {
    page = page || 1;
    var action = component.get("c.getMyOpps");
    action.setParams({
        "pageNumber": page
    });

    action.setCallback(this, function(a) {
        var result = a.getReturnValue();
            component.set("v.opportunities", result.entries);
            component.set("v.page", result.page);
            component.set("v.total", result.total);
            component.set("v.pages", Math.ceil(result.total/result.pageSize));           
            $A.get('e.force:refreshView').fire();

    });
    $A.enqueueAction(action);
  }   
})

This helper will call the apex controller method.

Apex controller method:

public class AccOppRLController {

  @AuraEnabled
  public static PagedResult getMyOpps(Decimal pageNumber) {
    Integer pageSize = 5;
    //String name = '%' + searchKey + '%';
    Integer offset = ((Integer)pageNumber - 1) * pageSize;
    system.debug('offset==='+offset+'  pageNumber===='+pageNumber);
    PagedResult r =  new PagedResult();
    r.pageSize = pageSize;
    r.page = (Integer) pageNumber;
    r.total = [SELECT Count() FROM Opportunity];
    r.entries = [SELECT Id, name, Owner.Name, CloseDate, StageName FROM Opportunity where Owner.Id = :UserInfo.getUserId() LIMIT :pageSize OFFSET :offset];
    system.debug('my opps===='+ r.entries);
    return r;
  }
}

I dont understand where I am wrong.

closed as off-topic by glls, Pranay Jaiswal, Raul, Mohith Shrivastava, Boris Bachovski May 6 at 0:03

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions on problems in code you've written must describe the specific problem and include valid code to reproduce it. For help writing short, self-contained syntactically-valid examples, see: SSCCE.org" – glls, Pranay Jaiswal, Raul, Mohith Shrivastava, Boris Bachovski
If this question can be reworded to fit the rules in the help center, please edit the question.

  • 1
    Could you share your component code also ? @ Srinivas – Junaid P Khader Jul 27 '16 at 7:03
  • @Srinivas your question is too vague, you have not described what exactly is not working and what you have tried to do. You just provided a lot of code and said it's not working. In addition, an answer was provided. – citizen conn Nov 25 '16 at 15:48
1

There is a tag named ui:inputRadio which can be used for radio buttons.

Your component part can be changed to following code:-

<fieldset class="slds-form-element">
    <div class="slds-form-element__control">
        <ui:inputRadio label="My Opportunities" change="{!c.myOpps}"/>
        <ui:inputRadio label="All Oportunities"/>
    </div>
</fieldset>

Also please note that whenever you call a method from component, use {!c.functionName}.

  • Thanks for response, can you let me know How to refresh the component like If you take a look the component , it includes a component called "c:Paginator" . I need to refresh that component when the user clicked on My Opportunities. – Srinivas Jul 27 '16 at 9:53
  • @Srinivas you can use force:refreshView event. See developer.salesforce.com/docs/atlas.en-us.lightning.meta/… . If this solves your issue, please mark it as the best answer. – Junaid P Khader Jul 27 '16 at 11:41
  • This is what I have updated in the helper class as per your suggestion:: action.setCallback(this, function(a) { var state= a.getState(); var result = a.getReturnValue(); component.set("v.opportunities", result.entries); component.set("v.page", result.page); component.set("v.total", result.total); component.set("v.pages", Math.ceil(result.total/result.pageSize)); if(state === 'SUCCESS') { $A.get('e.force:refreshView').fire(); } I got an error like:Error in $A.getCallback() [TypeError: $A.get(...) is undefined]Failing descriptor – Srinivas Jul 28 '16 at 6:36
  • @Srinivas Could you please the full code in helper ? – Junaid P Khader Jul 28 '16 at 9:00
  • 1
    @Srinivas I think you haven't noticed the change in component I mentioned in my answer. Please have a look at using ui:inputRadio in the component. – Junaid P Khader Jul 28 '16 at 9:56

Not the answer you're looking for? Browse other questions tagged or ask your own question.