<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker3.css">
<script src="http://14.139.184.228/mis/plugins/jquery/dist/jquery.js"></script>
<script src="http://14.139.184.228/mis//plugins/bootstrap/dist/js/bootstrap.min.js"></script>
<div class="col-md-12">
<div class="box box-primary">
<form id="" action="<?= base_url() ?>admin/new_notification" method="post">
<div class="box-body">
<!-- text input -->
<div class="row form-group">
<span class="text-danger" style="margin-left: 1%;"><b>*</b> All Fields are Mandatory</span>
</div>
<div class="row">
<div class="form-group col-md-6">
<input type="text" class="form-control" placeholder="Title ( No longer than 25 words )" name="title" required>
</div>
<div class="form-group col-md-2">
<select class="form-control " name="list1" id="countySel" required>
<option value="" disabled selected hidden>Student/Faculty</option>
</select>
</div>
<div class="form-group col-md-2">
<select class="form-control " name="list2" id="stateSel" required>
<option value="" disabled selected hidden>Year/Permanant or Adhoc</option>
</select>
</div>
<div class="form-group col-md-2">
<select class="form-control " name="list3" id="districtSel" required>
<option value="" disabled selected hidden>Branch/list</option>
</select>
</div>
<div class="form-group col-md-12">
<textarea type="text" height="175px" class="form-control" placeholder="Description ( No longer than 100 words )" name="description" required></textarea>
</div>
</div>
</div>
<div class="box-footer">
<button type="reset" class="btn btn-default btn-flat" style="float: right;">Reset</button>
<button type="submit" class="btn btn-primary btn-flat" style="float: right;margin-right: 1%;">Add Notification</button>
</div>
</form>
</div>
</div>
var stateObject = {
"Students": {"BTech First Year": ["ECE 1", "ECE 2", "CSE","EEE","ME"],
"BTech Second Year": ["ECE 1", "ECE 2", "CSE","EEE","ME"],
"BTech Third Year": ["ECE 1", "ECE 2", "CSE","EEE","ME"],
"BTech Fourth Year": ["ECE 1", "ECE 2", "CSE","EEE","ME"],
"MTech First Year": ["CSE", "ECE"],
"MTech Second Year": ["CSE", "ECE"]
},
"Faculties": {
"Permanant": ["List1", "List2"],
"Adhoc": ["list3", "Euroa"]
}
}
window.onload = function () {
var countySel = document.getElementById("countySel"),
stateSel = document.getElementById("stateSel"),
districtSel = document.getElementById("districtSel");
for (var country in stateObject) {
countySel.options[countySel.options.length] = new Option(country, country);
}
countySel.onchange = function () {
stateSel.length = 1; // remove all options bar first
districtSel.length = 1; // remove all options bar first
if (this.selectedIndex < 1)
return; // done
for (var state in stateObject[this.value]) {
stateSel.options[stateSel.options.length] = new Option(state, state);
}
}
countySel.onchange(); // reset in case page is reloaded
stateSel.onchange = function () {
districtSel.length = 1; // remove all options bar first
if (this.selectedIndex < 1)
return; // done
var district = stateObject[countySel.value][this.value];
for (var i = 0; i < district.length; i++) {
districtSel.options[districtSel.options.length] = new Option(district[i], district[i]);
}
}
}
$(document).ready(function () {
$('#date').mask('00/00/0000');
});
$('#datepicker').datepicker({
todayBtn: "linked",
language: "it",
autoclose: true,
todayHighlight: true,
format: 'dd-mm-yyyy'
});