EVOLUTION-NINJA
Edit File: batch_form.php
<?php echo view('includes/admin_header.php') ?> <link rel="stylesheet" type="text/css" href="<?php echo base_url('public/assets/website_assets/css/timepicki.css'); ?>" /> <link href="<?php echo base_url('public/assets/css/jquery-ui.css'); ?>" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="<?php echo base_url('public/assets/sumoselect/sumoselect.css'); ?>" /> <script type="text/javascript" src="<?php echo base_url('public/assets/sumoselect/jquery.sumoselect.min.js'); ?>"></script> <script type="text/javascript" src="<?php echo base_url('public/assets/website_assets/js/timepicki.js'); ?>"></script> <script src="<?php echo base_url('public/assets/js/jquery-ui.js'); ?>"></script> <script src="<?php echo base_url('public/assets/ckeditor/ckeditor.js'); ?>"></script> <script src="<?php echo base_url('public/assets/ckeditor/config.js'); ?>"></script> <!-- Content Wrapper. Contains page content --> <div class="content-wrapper"> <!-- Content Header (Page header) --> <section class="content-header"> <h1 style="padding-bottom:10px;border-bottom:2px dashed #468662;margin-bottom:20px; font-weight: bold;"> ADD BATCH <small></small> </h1> </section> <!-- Main content --> <section class="content"> <a href="javascript:history.back()" class="btn btn-primary" style="float:right;margin-bottom:30px; margin-right:15px;">Back</a> <div class="middle_work"> <form class="form-horizontal course_form"> <div style="margin-right: 25%;"> <div class="form-group"> <label class="control-label col-sm-4">Course Type</label> <input class="course_type" style="width: 21% !important;margin-top: 10px;" type="radio" value="Live" name="course_type" onclick="select_course_type('live');" required="">Live</label><br class="hidden-xs hidden-md hidden-lg"> <input class="course_type" style="width: 21% !important;margin-top: 10px;" type="radio" value="Recorded" name="course_type" onclick="select_course_type('recorded');" required="">Recorded</label> </div> <div class="form-group"> <label class="control-label col-sm-4">Select Category</label> <div class="col-sm-8"> <select class="form-control" id="catagory" name="domain_id" required> <option value="">Select Category</option> <?php if ($domain) { foreach ($domain as $val) { ?> <option value="<?php echo $val->domain_id; ?>"><?php echo $val->domain_name; ?></option> <?php } } ?> </select> </div> </div> <div class="form-group sub_cate_div"> <label class="control-label col-sm-4">Select Sub Category</label> <div class="col-sm-8 "> <select class="form-control sub_category_list" id="sub_domain_id" name="sub_domain_id" required> </select> </div> </div> <div class="form-group"> <label class="control-label col-sm-4">Select Faculty</label> <div class="col-sm-8 "> <select class="form-control faculty_list" id="faculty_id" name="faculty_id" required> </select> </div> </div> <div class="form-group fac_avail_timings" style="display: none;"> <label class="control-label col-sm-4">Available Timings</label> <div class="col-sm-8 "> <select class="form-control time_list" id="from_time" name="from_time" required> </select> </div> </div> <div class="form-group duration_div"> </div> <div class="form-group timings_div" style="margin-bottom: -15px !important;"> </div> <div class="form-group multiple_fields"></div> <div class="form-group"> <label class="control-label col-sm-4">Batch Name</label> <div class="col-sm-8"> <?php if (empty($batch)) { ?> <input type="text" class="form-control" name="batch_name" value="<?php echo $batch_id; ?>" required readonly> <?php } else { ?> <input type="text" class="form-control" name="batch_name" value="<?php echo $batch_id; ?>" required readonly> <?php } ?> </div> </div> <div class="form-group"> <label class="control-label col-sm-4">Batch Size</label> <div class="col-sm-8"> <!-- <input type="number" class="form-control" name="batch_size" min="1" required> --> <input class="batch_size" style="width: 21% !important;margin-top: 10px;" type="radio" value="Fixed" name="batch_type" onclick="select_batch_size('fixed');" required="">Fixed</label><br class="hidden-xs hidden-md hidden-lg"> <input class="batch_size" style="width: 21% !important;margin-top: 10px;" type="radio" value="Range" name="batch_type" onclick="select_batch_size('range');" required="">Range</label> <!-- <input type="number" class="form-control" name="batch_size" min="1" required> --> </div> </div> <div class="form-group fixed" style="display: none;"> <label class="control-label col-sm-4">No of participants</label> <div class="col-sm-8"> <input type="number" class="form-control" name="batch_fixed_size" min="1" placeholder="Enter Batch size like 10 etc."> </div> </div> <div class="form-group range" style="display: none;"> <label class="control-label col-sm-4">Range</label> <div class="col-sm-8"> <select type="text" class="form-control" name="batch_range_size"> <option value="">Select Range</option> <option value="1 - 1">1 - 1</option> <option value="10">10</option> <option value="20">20</option> <option value="30">30</option> <option value="40">40</option> <option value="50">50</option> <option value="60">60</option> <option value="70">70</option> <option value="80">80</option> <option value="90">90</option> <option value="100">100</option> </select> </div> </div> <div class="form-group batch_from_date"> <label class="control-label col-sm-4">Start Date</label> <div class="col-sm-8"> <input type="" id="from_date" name="batch_from_date" class="form-control" required="" onfocusout="from_batch_date()" readonly /> </div> </div> <div class="form-group batch_to_date" style="display:none;"> <label class="control-label col-sm-4">End Date</label> <div class="col-sm-8"> <input type="" id="to_date" name="batch_to_date" class="form-control" required="" readonly /> </div> </div> </div> <div class="form-group" style="text-align:center;padding-top:30px;"> <button type="submit" class="btn btn-primary submit">Submit</button> </div> </form> </div> </section> <!-- /.content --> </div> <script type="text/javascript"> $(document).ready(function() { $('.batch_to_date').hide(); var dateToday = new Date(); $('#from_date').datepicker({ dateFormat: 'dd-mm-yy', minDate: dateToday, //numberOfMonths: 2, onSelect: function(selected) { $("#to_date").datepicker("option", "minDate", selected) } }); $('#to_date').datepicker({ dateFormat: 'dd-mm-yy', onSelect: function(selected) { $("#from_date").datepicker("option", "maxDate", selected) } }); }); function from_batch_date() { $('.batch_to_date').show(); } function select_course_type(str) { if (str == 'live') { $('.fac_avail_timings').show(); $('.duration_div').show(); } else { $('.fac_avail_timings').hide(); $('.duration_div').show(); } } function select_batch_size(str) { if (str == 'fixed') { $('.fixed').show(); $('.range').hide(); } else { $('.fixed').hide(); $('.range').show(); } } </script> <style> .middle_work { padding-bottom: 30px; padding-top: 30px; } .row { margin: 0 !important; } </style> <script type="text/javascript"> $(document).ready(function() { $('.fixed').hide(); $('.range').hide(); $("#catagory").change(function() { var domain_id = $("#catagory").val(); $.ajax({ url: "<?php echo site_url('get_sub_domain') ?>", type: "POST", data: { 'domain_id': domain_id }, async: false, success: function(response) { // response=jQuery.parseJSON(response); console.log(response); if (response.result == 1) { var content = ''; content += '<option value="0">Select</option>'; $.each(response.message, function(idx, vx) { content += '<option value="' + vx.sub_domain_id + '">' + vx.sub_domain + '</option>'; }); $('.sub_category_list').html(content); } else { $('.sub_category_list').empty(); } } }); }); $(document).on('change', '#sub_domain_id', function() { var sub_domain_id = $('#sub_domain_id').val(); var domain_id = $('#catagory').val(); $.ajax({ url: "<?php echo site_url('get_faculty') ?>", type: "POST", data: { 'sub_domain_id': sub_domain_id, 'domain_id': domain_id }, async: false, success: function(response) { // response = jQuery.parseJSON(response); console.log(response); if (response.result == 1) { var content = ''; content += '<option value="0">Select</option>'; $.each(response.message, function(idx, vx) { content += '<option value="' + vx.faculty_id + '">' + vx.faculty_name + '</option>'; }); $('.faculty_list').html(content); } else { $('.faculty_list').empty(); } } }); }); $(document).on('change', '#faculty_id', function() { var domain_id = $('#catagory').val(); var sub_domain_id = $('#sub_domain_id').val(); var fac_id = $("#faculty_id").val(); $.ajax({ url: "<?php echo site_url('get_not_enrolled_fac_timings') ?>", type: "POST", data: { 'id': fac_id, 'sub_domain_id': sub_domain_id, 'domain_id': domain_id }, async: false, success: function(response) { // response = jQuery.parseJSON(response); console.log(response); if (response.result == 1) { var content = ''; content += '<option value="0">Select Time</option>'; $.each(response.message, function(idx, vx) { if (vx.available_type == 'timings') { content += '<option value="' + vx.from_time + ' - ' + vx.to_time + '">' + vx.from_time + ' - ' + vx.to_time + '</option>'; } else { content += '<option value="full_day">Full Day</option>'; } }); $('.time_list').html(content); $.ajax({ url: "<?php echo site_url('get_training_plan_duration') ?>", type: "POST", data: { 'faculty_id': fac_id, 'sub_domain_id': sub_domain_id, 'domain_id': domain_id }, async: false, success: function(response) { // response = jQuery.parseJSON(response); console.log(response); if (response.result == 1) { var content = ''; //$.each(response.message,function(idx,vx){ content += '<label class="control-label col-sm-4">Duration(In hrs)</label>'; content += '<div class="col-sm-8">'; content += '<input type="text" class="form-control duration" name="batch_duration" value="' + response.message + '" readonly>'; content += '</div>'; //}); $('.duration_div').html(content); } else { } } }); } else { toastr["error"](response.message); $('.course_form')[0].reset(); $('.duration_div').hide(); $('.fixed').hide(); $('.range').hide(); $('.fac_avail_timings').hide() setInterval(function() { //location.reload(); }, 2000); } } }); }); $('.course_form').submit(function(e) { e.preventDefault(); var duration = $(".duration").val(); if (duration != '00:00') { formdata = new FormData($(this)[0]); $.ajax({ type: 'post', url: '<?= site_url("add_batch") ?>', // Use site_url() function to generate the correct URL data: formdata, contentType: false, processData: false, success: function(response) { console.log(response); if (response.result == 1) { toastr["success"](response.message); $('.course_form')[0].reset(); $(".submit").text("Submit"); $(".submit").removeAttr('disabled'); $('.duration_div').hide(); $('.fixed').hide(); $('.range').hide(); $('.fac_avail_timings').hide() setInterval(function() { location.reload(); }, 2000); } else if (response.result == 2) { toastr["error"](response.message); $('.course_form')[0].reset(); $(".submit").text("Submit"); $(".submit").removeAttr('disabled'); $('.duration_div').hide(); $('.fixed').hide(); $('.range').hide(); $('.fac_avail_timings').hide() setInterval(function() { location.reload(); }, 2000); } else if (response.result == 3) { toastr["error"](response.message); $('.course_form')[0].reset(); $(".submit").text("Submit"); $(".submit").removeAttr('disabled'); $('.duration_div').hide(); $('.fixed').hide(); $('.range').hide(); $('.fac_avail_timings').hide() setInterval(function() { location.reload(); }, 2000); } else { toastr["error"](response.message); $('.course_form')[0].reset(); $(".submit").text("Submit"); $(".submit").removeAttr('disabled'); $('.duration_div').hide(); $('.fixed').hide(); $('.range').hide(); $('.fac_avail_timings').hide() setInterval(function() { location.reload(); }, 2000); } } }); } else { toastr["error"]('Duration is not added by faculty in training plan!'); setInterval(function() { location.reload(); }, 2000); } }); }); </script> <?php echo view('includes/admin_footer.php') ?> <style> .content-wrapper{ background-image: url(public/assets/website_assets/images/banner.png); background-size:cover; } .available_timings { padding-left: 0 !important; padding-right: 0 !important; } .available_timings input { width: 99%; } .form-control{ border-radius: 5px; } @media only screen and (min-width:320px) and (max-width:640px) { .available_timings input { width: 100%; margin-top: 5px; } } @media only screen and (min-width:641px) and (max-width:991px) { .available_timings input { width: 96%; } } @media only screen and (min-width:992px) and (max-width:1258px) { .available_timings input { width: 98%; } } </style>