wecuro_blog/application/modules/onboarding/views/quizExam.php

<section class="qusA ptb">
    <div class="container">
      <div class="innerqusA">
        <div class="row">

          <?php //pre($quizQuestion); ?> 
          <input type="hidden" id="token" value="<?=$token?>">
          <input type="hidden" id="user_id" value="<?=$user->id?>">
          <input type="hidden" id="video_id" value="<?=$vid?>">

          <div class="col-sm-12">
            <?php 
            if($quizQuestion){
            $i = 1; 
            foreach ($quizQuestion as $qa) {  ?>
            <div class="questionBlock" style="display: <?php if($i == 1){ echo "block"; } else { echo "none"; }  ?>;">
                <div class="wizardForm">
                    <h2>Question <?=$i?>:</h2>
                    <div class="insideqa">
                        <span class="question_text"><?=$qa['question']->question_text?></span>
                        <span class="question_id" attr_que_id = "<?=$qa['question']->id?>" ></span>
                    <ul>
                        <?php foreach($qa['answer'] as $ans) { ?>
                            <li>
                                <input type="radio" name="<?php echo $qa['question']->id; ?>" id="<?=$ans->id?>" ans_text="<?=$ans->answer_text?>" class="regular-checkbox big-checkbox" />
                            <label for="<?=$ans->id?>"><?=$ans->answer_text?></label>
                            </li>
                        <?php } ?>
                    </ul>
                    </div>
                </div>

                <div class="next">
                  <a href="#" class="reset" id="reset" data-toggle="tooltip" title="Reset"></a>
                  <ul>
                    <?php  if($i > 1 ) { ?>      
                    <li>
                      <!-- <button class="previousbt" id="previousbt">Previous</button> -->
                      <button class="btn btn-md btn-color-line mr-15 prevsbt ntpvbutton" id="previousbt" page="<?=$i?>" name="button">Previous</button>
                    </li>
                    <?php } ?>
                    <?php if(count($quizQuestion) > $i) { ?>
                    <li>
                      <button class="btn more-btn read-more service_btn netbt ntpvbutton" id="nextbt" page="<?=$i?>">Next</button>
                    </li>
                    <?php } ?>
                    <?php if(count($quizQuestion) == $i) { ?>
                    <li>
                      <a href="#" class="btn more-btn read-more service_btn netbt" total_q="<?=$i?>" id="finishbt_temp">Finish</a>
                    </li>
                    <?php } ?>
                  </ul>
                </div>
            </div>

            <?php $i++; } }else{?>
             
              <div class="center"><h2 class="text-center">Questions Not Available</h2></div>  
              <a class="btn more-btn read-more service_btn mt-10 float-right" href="<?=base_url()?>onboarding/process/<?=$token?>">Back</a>
              <?php }?>


          </div>
        </div>
      </div>
    </div>
  </section>

<script>
  
$(function(){
    $(".ntpvbutton").click(function(){
        var type = $(this).attr("id");
        var page = parseInt($(this).attr("page"));
        var curPage = page;
        var nextPage = page+1;
        var prevPage = page-1;
        if(type == 'nextbt')
        {
            // alert(nextPage+" "+curPage);
            $(".questionBlock").hide();
            $( ".questionBlock" ).slice( curPage, nextPage ).show();
        }
        else if(type == "previousbt")
        {
          
          $(".questionBlock").hide();
          // alert(prevPage+" "+curPage);
          $( ".questionBlock" ).slice(prevPage-1, curPage-1).show();
        }
    });

    $("#finishbt_temp").click(function(){

      var tnQuestion = $(this).attr('total_q');
      let examdata = [];
      let unAnswered = 0;
      let unAnsList = [];
      for (let $i = 0; $i < tnQuestion; $i++) {
        let token = $("#token").val();
        let user_id = $("#user_id").val();
        let video_id = $("#video_id").val();
        let q_id = $( ".questionBlock" ).slice( $i, $i + 1  ).find('.question_id').attr("attr_que_id");        
        let q_text = $( ".questionBlock" ).slice( $i, $i + 1  ).find('.question_text').html();
        let a_id = $( ".questionBlock" ).slice( $i, $i + 1  ).find('input[type="radio"]:checked').prop('checked', true).attr('id');
        let a_text = $( ".questionBlock" ).slice( $i, $i + 1  ).find('input[type="radio"]:checked').prop('checked', true).attr('ans_text');
        let tempObj =  {token:token,user_id:user_id,video_id:video_id,q_id:q_id,q_text:q_text,a_id:a_id,a_text:a_text};
        if(a_id == undefined)
        {
            unAnsList.push(q_id);
            unAnswered = unAnswered + 1;
        }
        examdata.push(tempObj);
      }
      

      if(unAnswered > 0)
      {
          alert("Please answer all the questions");
          return 0;
      }

      if (confirm("are you sure want to submit")) {
      } else {
        return 0;
      }


      
      $.ajax('<?=base_url()?>onboarding/saveExamData', {
                type: 'POST',  // http method
                data: { examdata: examdata,<?php echo $this->security->get_csrf_token_name(); ?>:'<?php echo $this->security->get_csrf_hash(); ?>'},  // data to submit
                async: false,
                success: function (data, status, xhr) {
                    // $('p').append('status: ' + status + ', data: ' + data);  
                    if(data=='saved')
                    {
                      window.location.href = "<?=base_url()?>onboarding/quizResult/<?=$vid?>";
                    }
                    
                    
                },
                error: function (jqXhr, textStatus, errorMessage) {
                        // $('p').append('Error' + errorMessage);
                    alert("error duc");
                    
                }

            });
      


    });
})
</script>