+ Start a Discussion
Sachin Bhalerao 17Sachin Bhalerao 17 

Objective type question test Project in Lightning Component?

Dear Team ,

Thank you for your continous support!!!

I have to create one project on lightning component in which i have to create Objective type test in which there are 4 options for single questions and user have to select one right answers . And data get stored in Custom object and i need to display result also when user click on submit button . (For Eg 6 answer correct out of 10)

Please provide me any link or overview how can i start this project .

Thanks & Regards
Sachin Bhalerao
Best Answer chosen by Sachin Bhalerao 17
Danish HodaDanish Hoda
Hi Sachin,
You can use below lines of code:
String defaultValForDoes_Lightning_Component_uses_Javascript__c ='';
Schema.DescribeFieldResult res = Question__c.Does_Lightning_Component_uses_Javascript__c .getDescribe();
List <Schema.PicklistEntry> pickVals = res.getPicklistValues();
for (Schema.PicklistEntry av: pickVals) {
      if (av.isDefaultValue()) {
           defaultValForDoes_Lightning_Component_uses_Javascript__c = av.getValue();
      }
}

 

All Answers

Danish HodaDanish Hoda
Hi Sachin,
You can start with this approach - 

Create a custom object with custom fields of type picklist with the default value as the correct answer.
On lightning component, show the values in lightning:radiogroup.
On Submit button, send the data to save the record and check the values selected with those of default (correct) values, if it matches add 1 else add 0, and show the result on Save on a pop-up (modal) window.
Sachin Bhalerao 17Sachin Bhalerao 17
Hi Danish ,

Thank you for your reply !!!

You mentioned show the values in lightning:radiogroup , i have to bind that values from database or i have to code on component . Would you plz give me small example for this.

Thanks & Regards
Sachin Bhalerao
Sachin Bhalerao 17Sachin Bhalerao 17
Hi Danish ,

I wrote following code . Would you plz help me to achieve this functionality. Please have a look on attached image of my custom object

Component :

<aura:component controller="BISPController">
            <aura:attribute name="NewCon" Custom object Image

            type="Contact"

            default="{ 'sobjectType': 'Questions__c',

                     
                     
                     'Does_Lightning_Component_uses_Javascript__c    ' : '',
                     
                     'Which_file_not_part_of_lightning_comp__c' : '',}" />
    
      <form>
                 <div class="slds-form-element">
          <div class="slds-form-element__control">
              <label class="slds-form-element__label" for="form-element-01">Does Lightning Component uses Javascript</label>
            <div style="background-color:white; height:33px; border:solid; border-color:rgb(217,219,221); border-radius:4px;">
                  <force:inputField value="{!v.NewCon.Does_Lightning_Component_uses_Javascript__c    }" class="form-control" />
              </div>
               
    </div>
  </div>  
          
          <div class="slds-form-element">
          <div class="slds-form-element__control">
              <label class="slds-form-element__label" for="form-element-01">Which file not part of lightning comp</label>
            <div style="background-color:white; height:33px; border:solid; border-color:rgb(217,219,221); border-radius:4px;">
                  <force:inputField value="{!v.NewCon.Which_file_not_part_of_lightning_comp__c}" class="form-control" />
              </div>
               
    </div>
  </div>          
           </form>
    
</aura:component>

APEX class

public with sharing class BISPController {

        @AuraEnabled

public static Questions__c Submitans (Questions__c con) {

    upsert con;

    return con;

}
}

Lightning APP

<aura:application extends="force:slds">
    <c:Questions/>
</aura:application>

Visual force page

<apex:page controller="BISPController">
      
 <apex:includeLightning />
<apex:pageBlock >
     <apex:pageBlockSection >
           <div id="Con" />
    </apex:pageBlockSection>
     </apex:pageBlock>
      

         <script>
  
            $Lightning.use("c:submitAns", function() {
                
              
                $Lightning.createComponent(

                    "c:Questions",

                    {},

                    "Con",

                    function(cmp) {

                        console.log("Component is created!");

                        console.log(cmp);

                    });

                });

        

          </script>

</apex:page>
Danish HodaDanish Hoda
Hi Sachin,
Please use type="Questions__c" in aura:attribute
Sachin Bhalerao 17Sachin Bhalerao 17
Hi Danish ,

I mentioned type="Questions__c" but no changes . One more thing plz let me know how can i use <Lightning:radiobutton > . Right now m using Lightning input . M using this component on my Visual force page.

M still unable to understand how can i match value of radio button with the default value of picklist (Correct Answer) . I attached image of output of my component .User-added image
Sachin Bhalerao 17Sachin Bhalerao 17
User-added image

My Domain is not yet deployed
Danish HodaDanish Hoda
Hi Sachin,
You will not be able to fetch picklist values as radio group in lightning, what you can do is :

<aura:attribute name="ques" type="Question__c" access="global" default="{'sobjectType' : 'Question__c'}" /> 

<aura:attribute name="options" type="List" default="[
                                                        {'label': 'Yes', 'value': 'Yes'},
                                                        {'label': 'No', 'value': 'No'},
                                                         {'label': 'No Idea', 'value': 'No Idea'}
                                     ]"/>

<div class="displayInline">
    <lightning:radioGroup name="radioGroup"
                          label="Question 1"
                          options="{!v.options }"
                          value="{!v.soft.Does_Lightning_Component_uses_Javascript__c }"
                          type="radio"/>
</div>
Sachin Bhalerao 17Sachin Bhalerao 17
Thnak you Danish for your reply . M adopted same technique ,i will submit selected value into database but how i will match the radio button values to picklist default values.
Danish HodaDanish Hoda
Hi Sachin,
You can use below lines of code:
String defaultValForDoes_Lightning_Component_uses_Javascript__c ='';
Schema.DescribeFieldResult res = Question__c.Does_Lightning_Component_uses_Javascript__c .getDescribe();
List <Schema.PicklistEntry> pickVals = res.getPicklistValues();
for (Schema.PicklistEntry av: pickVals) {
      if (av.isDefaultValue()) {
           defaultValForDoes_Lightning_Component_uses_Javascript__c = av.getValue();
      }
}

 
This was selected as the best answer
Sachin Bhalerao 17Sachin Bhalerao 17
Hi Danish ,

Thank you for your continous support !!!

Still m facing problem in matching radiobutton with picklist default value . I created one more column in table (Match__c) . It value of radiobutton matches with default value of picklist Match__c should be 1 else 0 . Please have a look on my code and suggest some solutions .
Component :

<aura:component controller="Matchpick" >
	 <aura:attribute name="options" type="List" default="[

       {'label': 'Yes', 'value': 'Yes'},
       {'label': 'No', 'value': 'No'},
       {'label': 'Sometime', 'value': 'Sometime'},  
       {'label': 'Partially', 'value': 'Partially'}, 
       ]"/>


  <aura:attribute name="optionChoosenRadio" type="String" default=""/>




 <div class = "slds-col slds-size--2-of-2 " style="display: inline;">
 <lightning:radioGroup name="radioGroup"
    label="Does Lightning Component uses Javascript"
    variant="label-inline"
    options="{!v.options }"
    value="{!v.optionChoosenRadio }"
    type="radio"
    required="true"/>
</div>

     <lightning:button label="Submit Ans" 
                                          class="slds-m-top--medium"
                                          variant="brand"
                                          onclick="{!c.handleChange}"/>   

</aura:component>

Controller.js


({
	handleChange : function(component, event, helper) {
		//alert('hello');
		var a = component.get('v.options');
        var b = component.get('v.optionChoosenRadio');
         helper.saveAccount(component, event);

	}
})

Helper.js

({
	 saveAccount : function(component, event) {

        var acc = component.get("v.optionChoosenRadio");

        var action = component.get("c.createAccount");

        action.setParams({

            objacc : acc

        });

        action.setCallback(this,function(response){

            var state = response.getState();

            if(state === "SUCCESS"){

                alert('Record is Created Successfully');

            } else if(state === "ERROR"){

                var errors = action.getError();

                if (errors) {

                    if (errors[0] && errors[0].message) {

                        alert(errors[0].message);

                    }

                }

            }else if (status === "INCOMPLETE") {

                alert('No response from server or client is offline.');

            }

        });      

        $A.enqueueAction(action);

    }
})

Apex class

public class Matchpick {
    
      @AuraEnabled
    public static Map<String, String> getques(){

        Map<String, String> options = new Map<String, String>();

        //get Account Industry Field Describe

        Schema.DescribeFieldResult fieldResult = Questions__c.Does_Lightning_Component_uses_Javascript__c.getDescribe();

        //get Account Industry Picklist Values

        List<Schema.PicklistEntry> pList = fieldResult.getPicklistValues();

        for (Schema.PicklistEntry p: pList) {

            //Put Picklist Value & Label in Map

            options.put(p.getValue(), p.getLabel());

        }

        return options;

    }
    
    
    
 @AuraEnabled //Save Questions Data

    Public static void createAccount(Questions__c objacc)
    {

        try{

            //Insert Questions Record

            insert objacc;

             

        }catch(Exception e){

            //throw exception message

            throw new AuraHandledException(e.getMessage());

        }

        finally {

        }

    }

}

APP

<aura:application access="GLOBAL">
    <c:Radioeg/>
</aura:application>

Thanks & Regards
Sachin Bhalerao​​​​​​​