ok
Mini Shell
<?php include "header.php";?>
<style>
.btn-success.hover, .btn-success:active, .btn-success:hover{
background-color: darkred;
border-color: darkred;
}
.btn-success {
background-color: darkviolet;
border-color: #9400d3;
/*border-radius: 20px;*/
}
.btn-primary {
background-color: chocolate;
border-color: #d2691e;
}
.btn-warning {
background-color: tomato;
border-color: #ff6347;
}
</style>
<div class="content-wrapper" style="background:white;">
<div class="clearfix"></div>
<section class="content">
<div class="row">
<div class="col-xs-12">
<div>
<div class="box-header">
<h3 class="box-title"><b>Add New Question: </b></h3>
</div>
<div class="box-body">
<div class="col-lg-12">
<div id="loading-div" style="display: none;">
<img src="images/gif/successfull.gif" style="margin-left: 37%;width: 25%;padding-bottom: 5%;">
</div>
<div id="content-div">
<form action="" id="add_question" enctype="multipart/form-data" method="post" accept-charset="utf-8" >
<div class="row" >
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Select Subject</label>
<select name="subject" id="subject" class="form-control tip select2">
<option>-- Select Subject --</option>
<?php
$statement = $pdo->prepare("SELECT * FROM tbl_subject");
$statement->execute();
$result = $statement->fetchAll(PDO::FETCH_ASSOC);
foreach($result as $subject){
?>
<option value="<?=$subject['id']?>"><?=$subject['subject_name']?></option>
<?php } ?>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Select Standard</label>
<select name="standard" id="standard_type" class="form-control tip select2">
<option>-- Select Standard --</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Select Topics</label>
<select name="topic_id" id="select_topics" class="form-control tip select2">
<option>-- Select Topics --</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Select Question Type</label>
<select name="questions_type" id="questions_type" class="form-control tip select2">
<option >Select Questions Type</option>
<option value="1">Questions Type 1</option>
<option value="2">Questions Type 2</option>
</select>
</div>
</div>
<div id="row_questions"></div>
</div>
<!--<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Question</label>
<input type="Text" name="question[]" id="question" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Option (A) </label>
<input type="text" name="option_a[]" id="option_a" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Option (B)</label>
<input type="text" name="option_b[]" id="option_b" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Option (C)</label>
<input type="text" name="option_c[]" id="option_c" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Option (d)</label>
<input type="text" name="option_d[]" id="option_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Correct Answer</label>
<select class="form-control tip select2" name="answer[]" id="answer">
<option>--- Select Correct Option ---</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Youtube Video Link</label>
<input type="text" name="video[]" id="video" value="" placeholder="Enter URL" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Upload Link</label>
<input type="file" name="photo[]" id="photo" value="" placeholder="" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label class="required" for="file">Question Explanation</label>
<textarea type="text" name="explanation[]" id="explanation" value="" placeholder="Enter Explanation" class="form-control tip" autocomplete="off" required="required" style="height:100px;"/></textarea>
</div>
</div>-->
<!--<span id="add_row" class="btn btn-success" style="background: #6bc5fa;font-weight: 800;border: 1px solid beige;border-radius: 20px;">
<i class="bi bi-plus"></i>Add Row
</span>-->
<div id="sections"></div>
<div class="col-md-12" style="display: flex;justify-content: center;margin-top: 3%;">
<div class="form-group">
<input type="submit" id="add_question" name="add_question" value="Add Questions" class="btn btn-success" />
</div>
</div>
</form>
</div>
<div class="form-group" style="text-align:center;">
<a href="questions-add.php"><button class="btn btn-primary" ><i class="fa fa-refresh"></i> Reset Form</button></a>
<a href="question.php"><button class="btn btn-warning" ><i class="fa fa-chevron-left"></i> Back to List</button></a>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</section>
<script src="https://cdn.ckeditor.com/4.8.0/full-all/ckeditor.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$('#subject').on('change',function(){
subject();
});
function subject(){
$("#standard_type").empty();
var subject = $("#subject").val();
$.ajax({
url:'api/select_standard.php',
type:'POST',
data:{type:'standard',subject:subject},
success:function(data)
{
$("#standard_type").append(data);
}
});
}
$('#standard_type').on('change',function(){
topics();
});
function topics(){
$("#select_topics").empty();
var standard = $("#standard_type").val();
var subject = $("#subject").val();
$.ajax({
url:'api/select_standard.php',
type:'POST',
data:{type:'topics',standard:standard,subject:subject},
success:function(data)
{
$("#select_topics").append(data);
}
});
}
$('#questions_type').on('change', function() {
//alert("venkat");
$("#sections").empty();
$("#row_questions").empty();
var appen_value = $('#questions_type').val();
var questions_type1 =`<div class="row">
<div class="col-md-12">
<div class="form-group">
<label class="required" for="file">Question</label>
<textarea name="questions[]" class="form-control" cols="30" rows="6" required="required" ></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (A) </label>
<textarea name="option_a[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (B)</label>
<textarea name="option_b[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (C)</label>
<textarea name="option_c[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (d)</label>
<textarea name="option_d[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Correct Answer</label>
<select class="form-control tip select2" name="answer[]" id="answer">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="file">Youtube Video Link</label>
<input type="text" name="video[]" id="video" value="" placeholder="Enter URL" class="form-control tip" autocomplete="off" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="file">Upload Link</label>
<input type="file" name="photo[]" id="photo" value="" placeholder="" class="form-control tip" autocomplete="off" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="file">Question Explanation</label>
<textarea name="explanation[]" class="form-control" cols="30" rows="6"></textarea>
</div>
</div>
<span id="add_row" class="btn btn-success" OnClick="questions_type_1()" style="background: #6bc5fa;font-weight: 800;border: 1px solid beige;border-radius: 20px;">
<i class="bi bi-plus"></i>Add Row
</span>
</div>`;
var questions_type2 = `<div class="row">
<div class="col-md-6">
<h4 style="text-align: center;">Questions 1</h4>
</div>
<div class="col-md-6">
<h4 style="text-align: center;">Questions 2</h4>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question A</label>
<input type="Text" name="question_a[]" id="question_a" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer for Question A (1)</label>
<input type="Text" name="correct_answer_a[]" id="correct_answer_a" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question B</label>
<input type="Text" name="question_b[]" id="question_b" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question B (2)</label>
<input type="Text" name="correct_answer_b[]" id="correct_answer_b" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question C</label>
<input type="Text" name="question_c[]" id="question_c" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question C (3)</label>
<input type="Text" name="correct_answer_c[]" id="correct_answer_c" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question D</label>
<input type="text" name="question_d[]" id="question_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question D (4)</label>
<input type="text" name="correct_answer_d[]" id="correct_answer_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (A)</label>
<input type="text" name="option_a[]" id="option_a" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (B)</label>
<input type="text" name="option_b[]" id="option_b" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (C)</label>
<input type="text" name="option_c[]" id="option_c" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (d)</label>
<input type="text" name="option_d[]" id="option_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Correct Answer</label>
<select class="form-control tip select2" name="answer[]" id="answer">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Youtube Video Link</label>
<input type="text" name="video[]" id="video" value="" placeholder="Enter URL" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Upload Link</label>
<input type="file" name="photo[]" id="photo" value="" placeholder="" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="file">Question Explanation</label>
<textarea type="text" name="explanation[]" id="explanation" value="" placeholder="Enter Explanation" class="form-control tip" autocomplete="off" style="height:100px;"/></textarea>
</div>
</div>
<span id="add_row" class="btn btn-success" OnClick="questions_type_2()" style="background: #6bc5fa;font-weight: 800;border: 1px solid beige;border-radius: 20px;">
<i class="bi bi-plus"></i>Add Row
</span>
</div>`;
if(appen_value==1){
$('#row_questions').append(questions_type1);
}else{
$('#row_questions').append(questions_type2);
}
// Get all elements with the class 'editor'
// var editorElements = document.querySelectorAll('.editor');
// Iterate over each element and initialize CKEditor
// editorElements.forEach(function (element) {
// CKEDITOR.replace(element, {
// skin: 'moono',
// enterMode: CKEDITOR.ENTER_BR,
// shiftEnterMode: CKEDITOR.ENTER_P,
// toolbar: [
// { name: 'basicstyles', groups: ['basicstyles'], items: ['Bold', 'Italic', 'Underline', "-", 'TextColor', 'BGColor'] },
// { name: 'styles', items: ['Format', 'Font', 'FontSize'] },
// { name: 'scripts', items: ['Subscript', 'Superscript'] },
// { name: 'justify', groups: ['blocks', 'align'], items: ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'] },
// { name: 'paragraph', groups: ['list', 'indent'], items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent'] },
// { name: 'links', items: ['Link', 'Unlink'] },
// { name: 'insert', items: ['Image'] },
// { name: 'spell', items: ['jQuerySpellChecker'] },
// { name: 'table', items: ['Table'] }
// ],
// });
// });
});
</script>
<script>
$(document).on('click', '.remove_class', function() {
$(this).closest('.row').remove();
});
function questions_type_2() {
$("#questions_type_2").empty();
var row_2 = `<div class="row">
<div class="row">
<div class="col-md-6">
<h4 style="text-align: center;">Questions 1</h4>
</div>
<div class="col-md-6">
<h4 style="text-align: center;">Questions 2</h4>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question A</label>
<input type="Text" name="question_a[]" id="question_a" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer for Question A (1)</label>
<input type="Text" name="correct_answer_a[]" id="correct_answer_a" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question B</label>
<input type="Text" name="question_b[]" id="question_b" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question B (2)</label>
<input type="Text" name="correct_answer_b[]" id="correct_answer_b" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question C</label>
<input type="Text" name="question_c[]" id="question_c" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question C (3)</label>
<input type="Text" name="correct_answer_c[]" id="correct_answer_c" value="" placeholder="Enter Question" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Question D</label>
<input type="text" name="question_d[]" id="question_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Correct Answer For Question D (4)</label>
<input type="text" name="correct_answer_d[]" id="correct_answer_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (A)</label>
<input type="text" name="option_a[]" id="option_a" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (B)</label>
<input type="text" name="option_b[]" id="option_b" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (C)</label>
<input type="text" name="option_c[]" id="option_c" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="required" for="file">Option (d)</label>
<input type="text" name="option_d[]" id="option_d" value="" placeholder="Enter option" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Correct Answer</label>
<select class="form-control tip select2" name="answer[]" id="answer">
<option>--- Select Correct Option ---</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Youtube Video Link</label>
<input type="text" name="video[]" id="video" value="" placeholder="Enter URL" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Upload Link</label>
<input type="file" name="photo[]" id="photo" value="" placeholder="" class="form-control tip" autocomplete="off" required="required" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="file">Question Explanation</label>
<textarea type="text" name="explanation[]" id="explanation" value="" placeholder="Enter Explanation" class="form-control tip" autocomplete="off" style="height:100px;"/></textarea>
</div>
</div>
</div>
<span class="remove_class btn btn-danger" style="font-weight: 800;border: 1px solid beige;border-radius: 20px;">Delete Row</span>
</div>`;
$("#sections").append(row_2);
}
function questions_type_1() {
$("#questions_type_1").empty();
var row = `<div class="row">
<div class="col-md-12">
<div class="form-group">
<label class="required" for="file">Question</label>
<textarea name="questions[]" class="form-control" cols="30" rows="6" required="required" ></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (A) </label>
<textarea name="option_a[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (B)</label>
<textarea name="option_b[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (C)</label>
<textarea name="option_c[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="required" for="file">Option (d)</label>
<textarea name="option_d[]" class="form-control" cols="30" rows="6" required="required"></textarea>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="required" for="file">Correct Answer</label>
<select class="form-control tip select2" name="answer[]" id="answer">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="file">Youtube Video Link</label>
<input type="text" name="video[]" id="video" value="" placeholder="Enter URL" class="form-control tip" autocomplete="off" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="file">Upload Link</label>
<input type="file" name="photo[]" id="photo" value="" placeholder="" class="form-control tip" autocomplete="off" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="file">Question Explanation</label>
<textarea name="explanation[]" class="form-control" cols="30" rows="6" ></textarea>
</div>
</div>
<span class="remove_class btn btn-danger" style="font-weight: 800;border: 1px solid beige;border-radius: 20px;">Delete Row</span>
</div>`;
$("#sections").append(row);
// Get all elements with the class 'editor'
// var editorElements = document.querySelectorAll('.editors');
// Iterate over each element and initialize CKEditor
// editorElements.forEach(function (element) {
// CKEDITOR.replace(element, {
// skin: 'moono',
// enterMode: CKEDITOR.ENTER_BR,
// shiftEnterMode: CKEDITOR.ENTER_P,
// toolbar: [
// { name: 'basicstyles', groups: ['basicstyles'], items: ['Bold', 'Italic', 'Underline', "-", 'TextColor', 'BGColor'] },
// { name: 'styles', items: ['Format', 'Font', 'FontSize'] },
// { name: 'scripts', items: ['Subscript', 'Superscript'] },
// { name: 'justify', groups: ['blocks', 'align'], items: ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'] },
// { name: 'paragraph', groups: ['list', 'indent'], items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent'] },
// { name: 'links', items: ['Link', 'Unlink'] },
// { name: 'insert', items: ['Image'] },
// { name: 'spell', items: ['jQuerySpellChecker'] },
// { name: 'table', items: ['Table'] }
// ],
// });
// });
}
$('#add_question').on('submit', function(e){
console.log("Click And Form Working");
e.preventDefault();
$('#loading-div').show();
$('#content-div').hide();
var formData = new FormData(this);
formData.append('type', 'add_question');
$.ajax({
url: 'add-api/add-question-form.php',
type: 'post',
dataType: 'json',
data: formData,
cache: false,
contentType: false,
processData: false,
enctype: 'multipart/form-data',
success: function (response) {
if(response['status']==200){
alert(response['message']);
$("#add_shifts .close").click();
$('#shift_add_form').trigger("reset");
emp_datas();
$('#loading-div').hide();
$('#content-div').show();
}else{
alert(response['message']);
$('#loading-div').hide();
$('#content-div').show();
}
}
});
});
</script>
<?php include "footer.php";?>
Zerion Mini Shell 1.0