<%@ Page Title="" Language="C#" MasterPageFile="~/module/dashboardPage.master" AutoEventWireup="true" CodeFile="Class-information.aspx.cs" Inherits="module_Class_information" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <script src="../assets/js/jquery.min.js"></script>
    <script type="text/javascript">

        $(document).ready(function () {
            $("#btnadd").click(function () {
                if ($("#btnadd").val() == "Submit") {
                    SaveData();
                }
                else if ($("#btnadd").val() == "Update") {
                    updatedata();
                }
            });
            datatable();
        });


        function SaveData() {

            var obj = {};
            obj.classtype = $('select[id$=ddlclassty]').val()
            obj.stream = $('select[id$=ddlstream]').val()
            obj.classinfo = $('select[id$=ddlclass]').val()
            obj.division = $('select[id$=ddldivision]').val()
            obj.subject = $('select[id$=ddlsubject]').val()

            $.ajax({
                type: "POST",
                url: "Class-information.aspx/savedata", //It calls our web method.
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(obj),
                dataType: "json",
                success: function (data) {
                    console.log(JSON.stringify(data));

                    noty({ text: 'Insert Successfully', layout: 'topRight', type: 'information' });
                    setTimeout(function () { $.noty.closeAll(); }, 3000);

                    datatable();
                    clear();
                },
                error: function (error) {
                    console.log(JSON.stringify(error));
                    //alert("Error in insert");
                    noty({ text: 'Error in insert', layout: 'topRight', type: 'information' });
                    setTimeout(function () { $.noty.closeAll(); }, 3000);

                }
            });

        }
        function datatable() {
            $.ajax({
                type: "POST",
                url: "Class-information.aspx/GetData",
                contentType: "application/JSON; charset=utf-8",

                datatype: "JSON",
                success: function (data) {
                    var table = $('#dataemp').DataTable();
                    data = JSON.parse(data.d);
                    table.clear();
                    for (var i = 0; i < data.length; i++) {
                        table.row.add([
                             data[i].id, data[i].classtype, data[i].stream, data[i].classinfo, data[i].division, data[i].subject,
                             "<button  style='height:35px; width: 35px; padding-left:7px;' type='button' onclick=editdata('" + data[i].id + "') id='btnedit' class='btn btn-success'  ><i class='bx bx-message-square-edit'></i></button> <button  style='height:35px; width: 35px; padding-left:7px;' type='button' onclick=deletedata('" + data[i].id + "') id='btndelete' class='btn btn-danger'><i class='fadeIn animated bx bx-trash-alt'></i></button> <button  style='height:35px; width: 35px; padding-left:7px;' type='button' class='btn btn-primary'><i class='lni lni-save'></i></button> <button  style='height:35px; width: 35px; padding-left:7px;' type='button' class='btn btn-dark'><i class='bx bx-x'></i></span></button>"

                        ]).draw(true);

                    }
                }
            });
        }

        var id1 = "";
        function editdata(id) {
            $.ajax({

                url: "Class-information.aspx/EditData",
                contentType: "application/JSON; charset=utf-8",
                method: "post",
                datatype: "JSON",
                data: "{id:'" + id + "'}",
                success: function (data) {
                    data = JSON.parse(data.d);
                    console.log(data);
                    

                    $("select[id$=ddlclassty]").val(data[0].classtype).change();
                    $("select[id$=ddlstream]").val(data[0].stream).change();

                    $("select[id$=ddlclass]").val(data[0].classinfo).change();

                    $("select[id$=ddldivision]").val(data[0].division).change();

                    $("select[id$=ddlsubject]").val(data[0].subject).change();


                    id1 = id;

                    datatable();
                    $("#btnadd").val('Update');

                }
            });
        }

        function updatedata() {

            var obj1 = {};
            obj1.id = id1;
            obj1.classtype = $('select[id$=ddlclassty]').val()
            obj1.stream = $('select[id$=ddlstream]').val()
            obj1.classinfo = $('select[id$=ddlclass]').val()
            obj1.division = $('select[id$=ddldivision]').val()
            obj1.subject = $('select[id$=ddlsubject]').val()

            $.ajax({
                url: "Class-information.aspx/UpdateData",
                contentType: "application/JSON; charset=utf-8",
                method: "post",
                datatype: "JSON",
                data: JSON.stringify(obj1),
                success: function (data) {
                    datatable();
                    clear();
                    $("#btnadd").val("Update");
                    noty({ text: 'Update Successfully', layout: 'topRight', type: 'information' });
                    setTimeout(function () { $.noty.closeAll(); }, 3000);

                }
            });
        }

        function deletedata(id1) {

            $.ajax({
                url: "Class-information.aspx/DeleteData",
                contentType: "application/JSON; charset=utf-8",
                method: "post",
                datatype: "JSON",
                data: "{id:'" + id1 + "'}",
                success: function (data) {
                    datatable();
                    noty({ text: 'Delete Successfully', layout: 'topRight', type: 'information' });
                    setTimeout(function () { $.noty.closeAll(); }, 3000);
                }
            });
        }

        function clear() {
            $('select[id$=ddlclassty]').val("");
            $('select[id$=ddlstream]').val("");
            $('select[id$=ddlclass]').val("");
            $('select[id$=ddldivision]').val("");
            $('select[id$=ddlsubject]').val("");
        }

    </script>
    
    <div class="page-wrapper">
			<div class="page-content">
				<div class="row">
					<div class="col-md-12 mx-auto" >
					
				<div class="card">
					<div class="card-body">
						<div class="card-title d-flex align-items-center">

							<h6>Class Information</h6>
						</div>
						<hr>
						
						
						<form class="row g-2">
							<div class="col-md-2">
								<label>Class Type</label>
								<select id="ddlclassty" class="form-select mb-3" aria-label="Default select example">
									<option selected>Select</option>
									<option >First</option>
									<option >Second</option>
									
									
							
								</select>
							</div>
							
							
							<div class="col-md-2">
								<label>Stream</label>
								<select id="ddlstream" class="form-select mb-3" aria-label="Default select example">
									<option selected>Select</option>
									<option >IT</option>
									<option >Civil</option>

									</select>
							</div>
							<div class="col-md-2">
								<label>Class</label>
								<select id="ddlclass" class="form-select mb-3" aria-label="Default select example">
									<option selected>Select</option>
									<option >B.Pharma</option>
									<option >M.Pharma</option>
                                    <option >BSC</option>
									<option >MSC</option>
                                    <option >D.Pharma</option>

									</select>
							</div>
							<div class="col-md-2">
								<label>Divison</label>
								<select id="ddldivision" class="form-select mb-3" aria-label="Default select example">
									<option selected>Select</option>
									<option >1st Year</option>
									<option>2nd Year</option>
                                    <option >3rd Year</option>
									<option>4th Year</option>

									</select>
							</div>
							<div class="col-md-2">
								<label>Subject</label>
								<select id="ddlsubject" class="form-select mb-3" aria-label="Default select example">
									<option selected>Select</option>
									<option >Chemestry</option>
									<option >Maths</option>

									</select>
							</div>
                            <div class="col-md-2" style="margin-top: 4.7vh;">
							<button type="button" id="btnadd" value="Submit" class="btn btn-primary"><i class='bx bx-plus-circle'></i>Add</button>
							
											
						   </div>
						   
                           </form>
                       </div>
                   </div>

				   <div class="overlay toggle-icon"></div>
				   <hr/>
				   <div class="col-md-12 mx-auto">
				   <div class="card">
					   <div class="card-body">
						   <div class="table-responsive">
							   <table id="dataemp" class="table table-striped table-bordered">
								   <thead>
									<tr>
										<th>Sr.no</th>	
										<th>Class Type</th>
										<th>Stream</th>  
										<th>Class</th>
										<th>Divison</th>
										<th>Subject</th>	   
										<th style="background-color: white;">Action</th>
									</tr>
								</thead>
								<%--<tbody>
									<tr>
										<td>1</td>
										<td>Second</td>	
										<td>IT</td>
										<td>4th</td>
										<td>2nd</td>
										<td>Maths</td>
										<td style="background-color: white;">
																	 
										 <button  style="height:35px; width: 35px; padding-left:7px;" type="button" class="btn btn-success"  ><i class='bx bx-message-square-edit'></i>
										 </button>&nbsp;<button  style="height:35px; width: 35px; padding-left:7px;" type="button" class="btn btn-danger"><i class="fadeIn animated bx bx-trash-alt"></i>
										 </button>
										 
										 </td>
									 </div>	
									 </div>		
									 </div>								
										</tr>
									   </tbody>--%>
							   </table>
						   </div>
					   </div>
				   </div>
			   </div>
			   </div>
</asp:Content>

