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">

<div class="content-wrapper">
  
  <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>
  
  <section class="content">
      
      <a href="javascript:history.back()" class="btn btn-primary" style="float:right;margin-bottom:30px; margin-right:15px;">Back</a>

<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>

<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 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>

</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>

<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>
  
</div>

});
  });

function from_batch_date() {
    $('.batch_to_date').show();
  }

function select_batch_size(str) {
    if (str == 'fixed') {
      $('.fixed').show();
      $('.range').hide();
    } else {
      $('.fixed').hide();
      $('.range').show();
    }
  }
</script>

.row {
    margin: 0 !important;
  }
</style>

$('.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() {

});
            $('.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();

} else if (response.result == 2) {
                    toastr["error"](response.message);
                    $('.course_form')[0].reset();

} 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>