var newOption = document.createElement('option');
var index =0;
var option=0
 document.querySelectorAll('.edit').forEach(item => {
         item.addEventListener('click', e => {
        const myArr = JSON.parse(item.dataset.options);
        for(i = 0 ;i<myArr.length;i++){
             console.log(myArr[i].answer);
             addNewOptionsUpdate(index,myArr[i].answer)
        }
        // console.log(item.dataset.exam_id);
        $('#id').val(item.dataset.id);
        $('#exId').val(item.dataset.exam_id);
        $('#quationUpdate').val(item.dataset.question_txt);
        $('#markUpdate').val(item.dataset.mark);
        $('#optionSelectUpdate').val(item.dataset.type);
        $('#updateQuestion').modal('show');
     })
 })


function addNewOptionsUpdate(index,option='')
{
 newOption.innerHTML = `
 <div class="row  border shadow-sm pt-3 single-option">
     <div class="col-1 col-md-1 fv-plugins-icon-container pt-2 pe-4">
         <input class="form-check-input radio row-option" type="radio" name="aneswerSelect[${index}][]" id="exampleRadios${index}" value="${indexOption}" >
     </div>
     <div class="col-10 col-md-10 fv-plugins-icon-container">
         <input type="text" id="email" value="${option}" name="option[${index}][]" class="form-control text optionInput row-option" placeholder="الرجاء ادخال الاختيار" required="" >
         <p id="alertemail" class="massege"></p>
         <div class="fv-plugins-message-container invalid-feedback ">
         يرجاء ادخال السؤال
         </div>

     </div>
     <div class="btn-delete-quation btn-delete-option">
         <span  onclick="deleteOption(${indexOption})" class="btn btn-danger btn-delete">
             <i class="fa fa-trash  text-danger"></i>
         </span>
     </div>
    
 </div>
 `;
 options[index].append(newOption.lastElementChild);
 radios = document.querySelectorAll('.radio');
 optionInputs = document.querySelectorAll('.optionInput');
 singleOptions = document.querySelectorAll('.single-option');
 indexOption++;
}