Hi..

I have a next button which moves from one step to another..Based on aura conditions the next button should work..the indicator step is working fine but the content is not properly aligned.

                     <lightning:progressStep label="Open Tasks" value="1" onclick="{!c.selectStep1}"/>
                                                       
                          <aura:if isTrue="{!v.ticket.Billable__c}">

                            <lightning:progressStep label="Billing Details" value="2" onclick="{!c.selectStep2}"/>
                              </aura:if>
                           <aura:if isTrue="{!!or(v.ticket.Information_Request_Type__c =='BIS License Request',v.ticket.Information_Request_Type__c=='RSS Admin')}">
                            <lightning:progressStep label="Work Time" value="3" onclick="{!c.selectStep3}"/>
                            </aura:if>
                            <lightning:progressStep label="Ticket Details" value="4" onclick="{!c.selectStep4}"/>
                            <lightning:progressStep label="KB/Problem" value="5" onclick="{!c.selectStep5}"/>
                               
                        
                           
                        </lightning:progressIndicator>
 <lightning:button variant="brand" label="Next" onclick="{!c.handleNext }" aura:id="disableenable" disabled="false"/>
Here {!v.ticket.Billable__c} is true step 1 moves to step 2 if  not it should move to step 3
<aura:if isTrue="{!!or(v.ticket.Information_Request_Type__c =='BIS License Request',v.ticket.Information_Request_Type__c=='RSS Admin')}">
for this condition:step 2 moves to step 4 if not moves to step 3
 so these conditions didnt work properly when i click next button
next button controller code:
var getselectedStep = component.get("v.currentStep");
 
) ;                        
 if(getselectedStep == "1" && component.get("v.ticket.Billable__c")){
           component.set("v.currentStep","2");
               
               }
         else if(getselectedStep == "1"){
             component.set("v.currentStep", "3"); 
         }
             

                          

           else if(getselectedStep == "2" && component.get("v.ticket.Information_Request_Type__c")){
            component.set("v.currentStep", "4");
              
              
        }
           
  else if(getselectedStep == "2"){
      component.set("v.currentStep", "3");
      event.preventDefault(); //Prevent default submit
        var eventFields = event.getParam("fields"); //get the fields
        
        component.find('leadCreateForm').submit(eventFields);
  }
        
     else if(getselectedStep == "3"){
            component.set("v.currentStep", "4");
           }
        else if(getselectedStep == "4"){
            component.set("v.currentStep", "5");
               event.preventDefault(); //Prevent default submit
        var eventFields1 = event.getParam("fields"); //get the fields
        
        component.find('leadCreateForm1').submit(eventFields1); 
           }
           

and also how to validate fields ..required fields shouldnt be empty..now it submits the null value how to achieve it below.


thanks