The words you are searching are inside this book. To get more targeted content, please make full-text search by clicking here.
Home Explore คู่มือ Line Hackathon27
View in Fullscreen

คู่มือ Line Hackathon27

Like this book? You can publish your book online for free in a few minutes!
Share

Related Publications

Discover the best professional documents and content resources in AnyFlip Document Base.
Search
Published by PSN Chanel, 2023-09-06 02:55:47

คู่มือ Line Hackathon27

คู่มือ Line Hackathon27

<!-- ---- logo หนวยงาน ---- --> <div class="d-flex justify-content-center"> <img id="logo_pic1" src="https://sv1.picz.in.th/images/2023/08/11/MMBDPI.png" width="45" height="45" class="brand me-2"> <h5 class="navbar-brand me-auto ms-lg-0 ms-3 text-warning fw-bold">ระบบการนิเทศการสอน</h5> </div> <div class="d-flex"> <!-- ---- ปุม Home ---- --> <button id="btn-home2" class="btn btn-warning icon-small mx-2 border-0" onclick="reLoad_Page()" style="display: none;"> <i class="fa fa-home"></i> </button> <!-- ---- ปุม Home ---- --> <button id="btn-logout" class="btn btn-danger icon-small mx-2 border-0" onclick="reLoad_Page()" style="display: none;"> <i class="fa-solid fa-right-from-bracket"></i> </button> <!-- ---- ปุม Settings ---- --> <button id="btn-admin" class="btn btn-warning icon-small mx-2 border-0" onclick="teachSet()" style="display: none;" > <i class="fa fa-cogs"></i> </button> </div> </div> </div> </nav> </section> teach_score.html <!-- Modal --> <div class="modal" id="modal_teach" tabindex="-1"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header">


<h5 class="modal-title"><img src="https://www.freeiconspng.com/thumbs/login-icon/user-login-icon29.png" width="30px" height="30px" /> การตั้งคาระบบออนไลน </h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-footer"> <button type="button" id="btn_set" onclick="check_passprin()" class="btn btn-danger"><img src="https://cdn-icons-png.flaticon.com/512/3603/3603959.png" width="25px" height="25px" /> ตั้งคาระบบ </button> </button> </div> </div> </div> </div> <script> /************************** Check_Password ********************* */ function check_passprin(){ event.preventDefault(); var setting = document.getElementById('idsetting').value; $('#modal_teach').modal('hide') pw() async function pw(){ const { value: password_setprin } = await Swal.fire({ title: 'การตั้งคาระบบออนไลน', confirmButtonText: 'ตกลง', confirmButtonColor: 'blue', input: 'password', inputLabel: 'กรอกรหัสผานเพื่อดำเนินการตอ', inputPlaceholder: 'กรุณากรอกรหัสผาน', inputAttributes: { maxlength: 6, autocapitalize: 'off', autocorrect: 'off' }


}) if (password_setprin===setting) { google.script.run.withSuccessHandler(()=> { Swal.fire({ position: 'center', icon: 'success', title: 'เขาสูระบบการตั้งคา', showConfirmButton: false, timer: 2000 }) }) $('#md_setting').modal('show') } else{ Swal.fire({ position: 'top', icon: 'error', title: 'รหัสผานผิด', showConfirmButton: false, timer: 2000 }) } } } </script> <script> function showclass(){ document.querySelector('#keysearch').value = $('#searchtext1').val(); } </script> <script> /** ******* เปด/ปด Loader ******** **/ function startloader(){ document.getElementById('loader').style.display = ""; }


function endloader(){ document.getElementById('loader').style.display = "none"; } // แสดงหนาตารางปกติ // google.script.run.withSuccessHandler(showtb).getDatatable_Std1(); function showtb(item){ endloader() if(item){ var result = "<div>"+ "<table class='table table-sm' style='font-size:1em'>"+ "<thead style='white-space: nowrap' class='bg-info'>"+ "<tr>"+ "<th style='width: 5px;'>ที่</th>"+ "<th style='width: 10px;'>รหัส</th>"+ "<th style='width: 300px;'>ชื่อ - สกุล</th>"+ "<th style='width: 100px;'>กลุมสาระ</th>"+ "<th style='width: 50px;'>รหัสวิชา</th>"+ "<th style='width: 50px;'>วิชา</th>"+ "<th style='width: 60px;'>ไฟล</th>"+ "<th style='width: 100px;'>รายงาน</th>"+ "</tr>"+ "</thead>"; for(var i=0; i<item.length; i++) { result += "<tr>"; result += '<td>'+ (item[i][0]) + '</td>'; result += '<td>'+ (item[i][1]) + '</td>'; result += '<td>'+ (item[i][2]) + '</td>'; result += '<td>'+ (item[i][3]) + '</td>'; result += '<td>'+ (item[i][4]) + '</td>'; result += '<td>'+ (item[i][5]) + '</td>'; var fileP = item[i][6]; if(fileP !=''){ result += "<td>" ; result += "<a href='" + (item[i][6]) +"'target='_blank'><i class='bx bxs-file-pdf bx-md'></i></a>" ; result += "</td>" ;


}else{ result += "<td></td>" ; } result += "<td><a type='button' data-bs-toggle='modal' data-bs-target='#formModal' class='btn btndanger btn-sm editBtn' onclick='editData2(this);'><i class='fa-solid'></i>ประเมิน</button></a></td>"; result += "</tr>"; } //สิ้นสุด for loop result += "</table></div>"; var div = document.getElementById('datatable').innerHTML = result; $(document).ready(function() { $('#datatable').DataTable({ destroy: true, //ซอนคอลัม searching:false, "paging": false, "ordering": false, "info": false, rowGroup: { // startRender: null, startRender: function ( rows, group ) { return group +' ('+rows.count()+')'; }, dataSrc: 2 } }); }); } } </script> <script> function editData2(el){ var id = el.parentNode.parentNode.cells[1].innerHTML; //สำหรับดึงคา id จาก table มาเพื่อหาขอมูล var nametech = el.parentNode.parentNode.cells[2].innerHTML; //สำหรับดึงคา id จาก table มาเพื่อหา ขอมูล document.getElementById('stdID').value = id


document.getElementById('nameStd').innerHTML = nametech } function showData(el){ let idpdf = el.getAttribute("data-url") var preview = idpdf.split('/view')[0]+"/preview" Swal.fire({ html: '<iframe src='+preview+' allow="true" width="100%" height="650px"></iframe>', showConfirmButton: false, showCloseButton: true, showClass:{popup: 'animate__animated animate__fadeInDown'}, hideClass:{popup: 'animate__animated animate__fadeOutUp'} }) } </script> <link href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css"> <link href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.dataTables.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" /> <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script> <script src="https://cdn.datatables.net/responsive/2.2.9/js/dataTables.responsive.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script> <link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'> <link href='https://cdn.datatables.net/buttons/2.3.2/css/buttons.dataTables.min.css' rel='stylesheet'> <script src="https://cdn.datatables.net/buttons/2.3.2/js/dataTables.buttons.min.js"></script> <script src="https://cdn.datatables.net/buttons/2.3.2/js/buttons.print.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script> <script src="https://cdn.datatables.net/buttons/2.3.2/js/buttons.html5.min.js"></script>


Setting.html <!-- Modal --> <div class="modal fade" id="md_setting" tabindex="-1" aria-labelledby="exampleModalLabel" ariahidden="true"> <div class="modal-dialog "> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title"><img src="https://cdn-icons-png.flaticon.com/512/216/216898.png" width="25px" height="25px" /> Setting </h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <form id="formsetting" onsubmit="savesetting(this)"> <div class="row"> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text1"><b>ID FOLDER :</b></span> <input type="text" class="form-control" id="set_pi" name="set_pi" placeholder="ไอดี เก็บไฟลรูปภาพ" > </div> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text1"><b>ID Sheet :</b></span> <input type="text" class="form-control" id="set_sheet" name="set_sheet" placeholder="ไอดี Sheet" > </div> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text1"><b>ID Slide :</b></span> <input type="text" class="form-control" id="set_slide" name="set_slide" placeholder="ไอดี Slide" > </div> <div class="input-group mb-3 ">


<span class="input-group-text text-light bg-primary" style="width:120px;" id="text1"><b>ID Token :</b></span> <input type="text" class="form-control" id="set_token" name="set_token" placeholder="ไอดี Token" > </div> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text2"><b>LINK LOGO :</b></span> <input type="text" class="form-control" id="set_lo" name="set_lo" placeholder="URL ลิ้งโลโก หนวยงาน " > </div> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text3"><b>SCHOOL :</b></span> <input type="text" class="form-control" id="set_sch" name="set_sch" placeholder="ชื่อหนวยงาน" > </div> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-primary" style="width:120px;" id="text4"><b>DEV NAME :</b></span> <input type="text" class="form-control" id="set_dev" name="set_dev" placeholder="ผูพัฒนา" > </div> <hr /> <h5 class="modal-title"><img src="https://cdn-icons-png.flaticon.com/512/216/216898.png" width="25px" height="25px" /> Password Setting </h5> <div class="input-group mb-3 "> <span class="input-group-text text-light bg-danger" style="width:120px;" id=""><b>Pass Setting</b></span> <input type="text" class="form-control" name="set_pssall" maxlength="10" placeholder="รหัสผาน เขาระบบตั้งคา" > </div> <div class="modal-footer"> <button type="submit" id="setbtn1" class="btn btn-warning "><img src="https://cdn-iconspng.flaticon.com/512/3603/3603959.png" width="25px" height="25px" /> Setting</button> <button class="btn btn-warning" type="button" id="setbtn2" style="display:none" disabled>


<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> <img src="https://cdn-icons-png.flaticon.com/512/3603/3603959.png" width="25px" height="25px" /> Loader...</button> </div> </div> </form> </div> </div> </div> <script> $(function(){ $('#btn-home2').click(function(){ reLoad_Page() }) }) </script> <script> function settingall(){ google.script.run.withSuccessHandler(addSuccess_setting2).readDatasetting() ; } function addSuccess_setting2(data){ try{ data = JSON.parse(data) } catch{} $('#logo_pic').attr('src', data[5][0]); $('#sch_n1').html(data[6][0]); $('#dev_n1').html(data[7][0]); } </script> <script> function savesetting(obj) { event.preventDefault(); document.getElementById('setbtn1').style.display="none"; document.getElementById('setbtn2').style.display="block"; reLoad_Page()


google.script.run.withSuccessHandler(addSuccess_setting).saveData4(obj); } function addSuccess_setting(){ $('#formsetting')[0].reset(); $('#md_setting').modal('hide'); Swal.fire({ position: 'center', icon: 'success', title: 'ตั้งคาระบบ..เรียบรอย', showConfirmButton: true, // timer: 2000 }) document.getElementById('setbtn2').style.display="none"; document.getElementById('setbtn1').style.display="block"; } </script> <script> $(document).ready(function() { var images = [ "https://sv1.picz.in.th/images/2023/08/11/MMhxXz.jpeg", ]; var currentImage = 0; function changeBackground() { $("#bg-image").css("background-image", "url('" + images[currentImage] + "')"); currentImage = (currentImage + 1) % images.length; $("#bg-image").animate({opacity: 2}, 2000); setTimeout(changeBackground, 5000); $("#bg-image").animate({opacity: 1}, 2000); } changeBackground(); }); window.addEventListener('load', function() { // ftload() settingall() });


// function ftload() { // var ftx = document.getElementById('myF').innerHTML; // document.getElementById('wr').innerHTML = ftx; // } </script> runPDF.html function runPDF(id) { //var id=7 var xx = parseInt(id) var ss = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('data') var pdfFolder = DriveApp.getFolderById(id_Folder) // let copyFile = DriveApp.getFileById(id_Slide).makeCopy(), copyID = copyFile.getId(), // คัดลอกไอดี copyDoc = SlidesApp.openById(copyID) // ไฟลกอปป var item = ss.getRange(xx, 17).getDisplayValue() // ขอมูลแถวลาสุด var truechk=item.split(",") // Logger.log(truechk.length) var studbasic = ss.getRange(xx, 1, 1, 44).getDisplayValues()[0] var tableR=0; var kx=0 for (var i = 0; i < 20; i++) { //วนรอบ 20 คน switch (truechk[i]) { case "5": copyDoc.getSlides()[tableR].getTables()[0].getCell(i-kx+1,2).getText().setText("✓") break; case "4": copyDoc.getSlides()[tableR].getTables()[0].getCell(i-kx+1,3).getText().setText("✓") break; case "3": copyDoc.getSlides()[tableR].getTables()[0].getCell(i-kx+1,4).getText().setText("✓") break; case "2":


copyDoc.getSlides()[tableR].getTables()[0].getCell(i-kx+1,5).getText().setText("✓") break; case "1": copyDoc.getSlides()[tableR].getTables()[0].getCell(i-kx+1,6).getText().setText("✓") break; default: break; } } copyDoc.getSlides()[0].replaceAllText("{กลุมสาระ}",studbasic[2]) copyDoc.getSlides()[0].replaceAllText("{ภาคเรียน}",studbasic[3]) copyDoc.getSlides()[0].replaceAllText("{ปการศึกษา}",studbasic[4]) copyDoc.getSlides()[0].replaceAllText("{ระดับชั้น}",studbasic[5]) copyDoc.getSlides()[0].replaceAllText("{ชื่อครูผูสอน}",studbasic[6]) copyDoc.getSlides()[0].replaceAllText("{รหัสวิชา}",studbasic[7]) copyDoc.getSlides()[0].replaceAllText("{วิชา}",studbasic[8]) copyDoc.getSlides()[0].replaceAllText("{หนวย}",studbasic[9]) copyDoc.getSlides()[0].replaceAllText("{เรื่อง}",studbasic[10]) copyDoc.getSlides()[0].replaceAllText("{คาบ}",studbasic[11]) copyDoc.getSlides()[0].replaceAllText("{จำนวนคาบ}",studbasic[12]) copyDoc.getSlides()[0].replaceAllText("{วันเดือนป}",studbasic[13]) copyDoc.getSlides()[0].replaceAllText("{ขอเสนอแนะ}",studbasic[14]) copyDoc.getSlides()[0].replaceAllText("{รดม}",studbasic[37]) copyDoc.getSlides()[0].replaceAllText("{รด}",studbasic[38]) copyDoc.getSlides()[0].replaceAllText("{รปก}",studbasic[39]) copyDoc.getSlides()[0].replaceAllText("{รน}",studbasic[40]) copyDoc.getSlides()[0].replaceAllText("{รป}",studbasic[41]) copyDoc.getSlides()[0].replaceAllText("{รทม}",studbasic[42]) copyDoc.saveAndClose() // บันทึกและปดไฟลกอปป // ===========สวนการสรางไฟล PDF ========================= var newFile = pdfFolder.createFile(copyFile.getAs(MimeType.PDF)) // สรางไฟลใหมเปน PDF


var pdfView = newFile.setName(new Date().getTime().toString()+"-"+studbasic[6]+".PDF").getUrl() // สรางลิงค PDF แบบวิว var linkpng = "https://lh5.googleusercontent.com/d/"+newFile.getId() //idpdf[5] // สวนการแทรกขอมูลลงในชีต //ss.getRange(xx, ss.getLastColumn()).setValue(pdfView) ss.getRange(xx, 44).setValue(pdfView) // เซ็ตลิงคไฟล PDF ลงในคอลัมภที่... copyFile.setTrashed(true) // ลบไฟลสำเนาลงถังขยะ SpreadsheetApp.flush(); var tinyurl = UrlFetchApp.fetch('https://tinyurl.com/api-create.php?url=' + encodeURI(pdfView)); var msg = ' แบบบันทึกการนิเทศการสอน\n' + 'ชื่อสกุล : ' + studbasic[6]+ '\nกลุมสาระ : ' +studbasic[2]+ '\n รายวิชา : ' +studbasic[8]+'\nคะแนนรวม : ' +studbasic[42]+'\nผูนิเทศ: ' +studbasic[15]+'\nLink: ' +'\n'+ tinyurl var imgLine = UrlFetchApp.fetch(linkpng).getBlob().getAs('image/png') TKL_sendNotify(msg,id_Token,imgLine) } function TKL_sendNotify(msg,token,image){ let payloadJson = { "message": msg, "imageFile": image }; let options = { "method": "post", "payload": payloadJson, "headers": { "Authorization": "Bearer " + token } }; UrlFetchApp.fetch("https://notify-api.line.me/api/notify", options); }


modal.html <!-- ************************ form เทอม 1 *************************************************** --> <!-- Modal --> <div class="modal fade" id="formModal" tabindex="-1" aria-labelledby="exampleModalLabel" ariahidden="true"> <div class="modal-dialog modal-lm"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title"> ชื่อ - สกุล : </h5> <h5 class="modal-title" id="nameStd" > ชื่อครู</h5> <button type="button" id="closebtn" class="btn-close" data-bs-dismiss="modal" arialabel="Close"></button> </div> <hr> <div class="container" style="font-size:14px"> <input type="text" class="form-control" id="stdID" style="display:none"> <input type="text" class="form-control" id="shownameposit" style="display:none"> <div class="row"> <div class="mb-2 col-lg-4" > <label for="bbb" class="form-label">วันเดือนป</label> <input type="date" class="form-control" id="date"> </div> <div class="mb-2 col-lg-4"> <label for="bbb" class="form-label">ภาคเรียน</label> <input type="number" class="form-control" id="pakrean"> </div> <div class="mb-2 col-lg-4" > <label for="bbb" class="form-label">ปการศึกษา</label> <input type="number" class="form-control" id="pee"> </div> <div class="col-md-4 mb-2 col-lg-4" > <label for="bbb" class="form-label">รหัสวิชา</label> <input type="text" class="form-control" id="rahaswicha"> </div>


<div class="col-md-4 mb-2 col-lg-4"> <label for="bbb" class="form-label">รายวิชา1</label> <input type="text" class="form-control" id="wicha"> </div> <div class="col-md-2 mb-2 col-lg-2" > <label for="bbb" class="form-label">คาบ</label> <input type="number" class="form-control" id="kab"> </div> <div class="col-md-2 mb-2 col-lg-2" > <label for="bbb" class="form-label">จำนวน</label> <input type="number" class="form-control" id="jamnuen"> </div> <div class="col-md-4 mb-2 col-lg-4" > <label for="bbb" class="form-label">หนวย</label> <input type="number" class="form-control" id="neay"> </div> <div class="col-md-4 mb-2 col-lg-4"> <label for="bbb" class="form-label">เรื่อง</label> <input type="text" class="form-control" id="reing"> </div> <div class="col-md-4 mb-2 col-lg-4" > <label for="bbb" class="form-label">ระดับชั้น</label> <input type="text" class="form-control" id="chan"> </div> </div> <p>การประเมินนิเทศการสอน เลือกชองคะแนนที่เห็นวาตรงกับการนิเทศมากที่สุดเพียงชองเดียว<br> ระดับการประเมิน 5 = ดีมาก , 4 = ดี , 3 = ปานกลาง , 2 = นอย , 1 = ปรับปรุง</p> <!-- </form> --> <div class="row mb-2"> <div class="col" id="tableshow"> <div id="search-results" class="table-responsive text-center"></div> </div> </div> <hr> <div class="col-12">


<div class="col-md-12 mb-2 col-lg-12" > <label for="bbb" class="form-label">ขอเสนอแนะ</label> <textarea class="form-control" id="sanernea"></textarea> </div> <center> <button type="submit" class="btn btn-primary col-6 col-md-12 my-2" id="btn_1" onclick="whenButtonClicked()" ><i class="fa-solid fa-floppy-disk"></i> บันทึกขอมูล</button> <button class="btn btn-primary col-6 col-md-12 my-2" type="submit" id="btn_2" style="display:none" disabled> <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> กำลังบันทึก... </button> </center> </div> <br> <div class="row"> <p class="mini text-center text-success prompt"> © <script> document.write(new Date().getFullYear()); </script> Credit: ร.ท.พิษณุ ปนชาติ ผูจัดทำ <i class="fa fa-star"></i> ร.ท.พิษณุ ปนชาติ </p> </div> </div> </div> </div> </div>


login.htm <!-- *********************************** Login HTML *************************************** --> <div id="pform" > <div class="container"> <div class="container2"> <div class="login col-md-6"> <!-- *********************************** clock HTML *************************************************** --> <div class="container3"> <div class="clock"> <div style="--clr: #ff3d58; --h: 35px" id="hour" class="hand"> <i></i> </div> <div style="--clr: #00a6ff; --h: 45px" id="min" class="hand"> <i></i> </div> <div style="--clr: #ffffff; --h: 55px" id="sec" class="hand"> <i></i> </div> <span style="--i: 1"><b>1</b></span> <span style="--i: 2"><b>2</b></span> <span style="--i: 3"><b>3</b></span> <span style="--i: 4"><b>4</b></span> <span style="--i: 5"><b>5</b></span> <span style="--i: 6"><b>6</b></span> <span style="--i: 7"><b>7</b></span> <span style="--i: 8"><b>8</b></span> <span style="--i: 9"><b>9</b></span> <span style="--i: 10"><b>10</b></span> <span style="--i: 11"><b>11</b></span> <span style="--i: 12"><b>12</b></span> </div> </div>


<!-- *********************************** clock HTML *************************************************** --> <script> let hr = document.getElementById('hour'); let min = document.getElementById('min'); let sec = document.getElementById('sec'); function displayTime(){ let date = new Date(); // Getting hour, mins, secs from date let hh = date.getHours(); let mm = date.getMinutes(); let ss = date.getSeconds(); let hRotation = 30*hh + mm/2; let mRotation = 6*mm; let sRotation = 6*ss; hr.style.transform = `rotate(${hRotation}deg)`; min.style.transform = `rotate(${mRotation}deg)`; sec.style.transform = `rotate(${sRotation}deg)`; } setInterval(displayTime, 1000); </script> <style> .container3 { position: relative; display: flex; justify-content: center; align-items: center; /* min-height: 100vh; */ } .clock { width: 160px; height: 160px; border-radius: 50%; background-color: rgba(255, 255, 255, 0.1); border: 2px solid rgba(255, 255, 255, 0.25);


box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.9); display: flex; justify-content: center; align-items: center; } .clock span { position: absolute; transform: rotate(calc(30deg * var(--i))); inset: 3px; text-align: center; } .clock span b { transform: rotate(calc(-30deg * var(--i))); display: inline-block; font-size: 18px; } .clock::before { content: ''; position: absolute; width: 8px; height: 8px; border-radius: 50%; background-color: #fff; z-index: 2; } .hand { position: absolute; display: flex; justify-content: center; align-items: flex-end; } .hand i { position: absolute; background-color: var(--clr); width: 4px;


height: var(--h); border-radius: 8px; } </style> <!-- *********************************** clock HTML *************************************** --> <br/> <h1>เขาระบบการนิเทศ</h1> <h5 id="sch_n3" style="margin-bottom:10px;margin-top:5px;" class="mt-1 text-center text-dark fwbold"></h5> <form action="" id="myFormlogin"> <!-- <div class="input-box"> <input type="email" id="user" placeholder="ชื่อผูใชงาน"> <i class="fa-solid fa-user"></i> </div> --> <div class="input-box"> <input type="password" id="pass" maxlength="6" placeholder="รหัสผาน"> <i class="fa fa-lock"></i> </div> <button type="submit" value="Login" onclick="login()">เขาสูระบบ</button> <center> <span class="fs-6 text-warning">พัฒนาโดย : </span><span class="fs-6 text-warning" id="dev_n1"></span> <!-- <b>พัฒนาโดย : </b><b id="dev_n1" ></b> --> <br> <span class="fs-6 text-warning" id="sch_n1"></span> <!-- <b id="sch_n1">โรงเรียน</b> --> </center> </form> </div><!-- End Login --> </div> </div> </div>


<!-- *********************************** Login JavaScript ************************** --> <script> window.addEventListener('load',function(output){ }) function login(){ event.preventDefault() startloader() // if ($('#user').val() == "") { // Swal.fire({ // position: 'center', // icon: 'warning', // title: 'ใสชื่อผูใชงาน!!', // showConfirmButton: true, // // timer: 1500 // }) // endloader() // return; // } if ($('#pass').val() == "") { Swal.fire({ position: 'center', icon: 'warning', title: 'ใสรหัสผาน!!', showConfirmButton: true, // timer: 1500 }) endloader() return; } document.querySelector('#loading').style.display="block" var pass = document.querySelector('#pass').value // var user =document.querySelector('#user').value google.script.run.withSuccessHandler(function(output){ console.log(output)


if(output !=null){ endloader() document.querySelector("#showname").innerHTML = output[1] document.querySelector("#showposit").innerHTML = output[2] $('#shownameposit').val(output[1]); document.querySelector('#page3').style.display="block" document.querySelector('#drop').style.display="block" document.querySelector('#btn-admin').style.display="block" document.querySelector('#btn-home2').style.display="block" document.querySelector('#pform').style.display="none" document.querySelector('#pform').reset // google.script.run.withSuccessHandler(showtb).getDatatable_Std1(); }else{ Swal.fire({ position: 'center', icon: 'warning', title: 'รหัสผานไมถูกตอง!!', showConfirmButton: true, // timer: 1500 }) endloader() } }).loginform(pass) } </script> <!-- *********************************** Login CSS ******************************************************* --> <style> .container2 { position: relative; margin-top: -60px; min-height: 100vh; /* background-color: #161623; */ overflow: hidden; display: grid; place-items: center;


} a { text-decoration: none; } #pform { margin-top: 20px; } .login { position: relative; top: 2%; width: 350px; padding: 20px; background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 15px; z-index: 10; backdrop-filter: blur(25px) contrast(1); -webkit-backdrop-filter: blur(25px) contrast(1); box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.2), -10px -10px 40px rgba(0, 0, 0, 0.2); } @media (max-width:400px) { .login { width: 90%; } } .login h1 { font-size: 1.8rem; color: #e0125e; margin-bottom: 5px; margin-top: 0; text-align: center; } .login form { width: 100%;


height: 100%; outline: none; border: none; } .login form .input-box { width: 100%; position: relative; margin-bottom: 10px; display: flex; } .login form .input-box input { width: 100%; border: none; padding: 1rem 2.7rem 1rem 1rem; border-radius: 10px; color: #ffffff; background-color: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4); } .login form .input-box input::placeholder { color: #e0125e; font-size: 0.8rem; transition: 0.5s ease; } .login form .input-box input:focus::placeholder { opacity: 0; } .login form .input-box input:focus { outline: none; } .login form .input-box i { position: absolute; top: 50%; right: 15px; transform: translateY(-50%);


color: #fff; font-size: 1.2rem; } .login form .rembar { margin-bottom: 20px; width: 100%; } .login form .rembar input { appearance: none; } .login form .rembar label { color: #fff; position: relative; width: 100%; padding-left: 35px; font-size: 0.9rem; } .login form .rembar label::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; border-radius: 50%; background-color: rgba(255, 255, 255, 0.2); } .login form .rembar label::after { content: ""; position: absolute; left: 4px; top: 50%; transform: translateY(-50%); width: 14px;


height: 14px; border-radius: 50%; background-color: #fff; transition: 0.5 ease; opacity: 0; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); } .login form .rembar input:checked+label::after { opacity: 1; } .login form button { width: 100%; border: none; /* padding: 1rem 1rem 1rem 1rem; */ border-radius: 10px; color: #fff; margin-bottom: 10px; background-color: #161623; border: 1px solid rgba(255, 255, 255, 0.4); transition: 0.5s ease; cursor: pointer; font-weight: 600; text-align: center; } .login form button:hover { background-color: #111; } .login form .links { width: 100%; display: flex; justify-content: space-between; gap: 15px; } .login form .links a { color: #fff;


font-weight: 100; font-size: 0.7rem; } </style> <template id="formloader"> <swal-html> <center> <div class="spinner bg-opacity-75 "> <div class="spinner-inner"></div> <div class="spinner-text">Loading...</div> </div> </center> </swal-html> </template> <script> function formloader3(){ Swal.fire({ template: '#formloader', showConfirmButton: false, position: 'center', timer: 10000, allowOutsideClick : false, }) } function formloader2(){ Swal.fire({ template: '#formloader', showConfirmButton: false, position: 'center', timer: 5000, allowOutsideClick : false, }) } function formloader1(){ Swal.fire({


template: '#formloader', showConfirmButton: false, position: 'center', timer: 3000, allowOutsideClick : false, }) } </script> <style> .spinner { display: flex; justify-content: center; align-items: center; flex-direction: column; /* height: 100vh; */ } .spinner-inner { width: 40px; height: 40px; border: 2px solid rgba(0, 0, 0, 0.1); border-top-color: #3498db; border-radius: 50%; animation: spin 1s linear infinite; } .spinner-text { font-size: 0.9rem; color: #3498db; opacity: 0; margin-top: 0.5rem; transition: opacity 0.3s ease-in-out; animation: opacity 1s ease-in-out infinite; } @keyframes spin { to { transform: rotate(360deg);


} } @keyframes opacity { to { opacity: 1; } } </style> Js.html <script> function teachSet(){ $('#modal_teach').modal('show') } </script> <script> let stdID = document.getElementById('stdID'); let showname = document.getElementById('showname'); function whenButtonClicked(){ event.preventDefault() let checked; let temp = document.querySelectorAll('.multi:checked'); if(temp != null){ let checkedvalues = Array.prototype.map.call(temp, function(el){ return el.value }) checked = checkedvalues.join(",") }else{ checked = null } let obj = {} obj.stdID = document.getElementById('stdID').value obj.date = document.getElementById('date').value


obj.pakrean = document.getElementById('pakrean').value obj.pee = document.getElementById('pee').value obj.rahaswicha = document.getElementById('rahaswicha').value obj.wicha = document.getElementById('wicha').value obj.kab = document.getElementById('kab').value obj.jamnuen = document.getElementById('jamnuen').value obj.neay = document.getElementById('neay').value obj.reing = document.getElementById('reing').value obj.chan = document.getElementById('chan').value obj.sanernea = document.getElementById('sanernea').value obj.nitest = document.getElementById('shownameposit').value obj.checked = checked if(checked.length <38){ const Toast = Swal.mixin({ toast: true, position: 'top-end', showConfirmButton: false, timer: 1000, }) Toast.fire({ icon: 'error', title: 'กรอกขอมูลใหครบทุกชอง' }) }else{ document.getElementById('btn_2').style.display="block"; document.getElementById('btn_1').style.display="none"; google.script.run.saveData(obj) reLoad() } } function reLoad() { google.script.run.withSuccessHandler(function(url){ Swal.fire({ position: 'top-center', icon: 'success',


title: 'บันทึกเรียบรอยแลว', showConfirmButton: false, timer: 1500 }) $("#closebtn").click() document.getElementById('btn_2').style.display="none"; document.getElementById('btn_1').style.display="block"; //window.open(url,'_top'); }) .getURL(); } function upload(){ let timerInterval Swal.fire({ title: 'กำลังสรางรายงาน!', html: 'สรางรายงานเสร็จภายใน <b></b> วินาที', timer: 12000, timerProgressBar: true, didOpen: () => { Swal.showLoading() const b = Swal.getHtmlContainer().querySelector('b') timerInterval = setInterval(() => { b.textContent = (Swal.getTimerLeft() / 1000) .toFixed(0) }, 100) }, willClose: () => { clearInterval(timerInterval) } }).then((result) => { /* Read more about handling dismissals below */ if (result.dismiss === Swal.DismissReason.timer) { console.log('I was closed by the timer') }


}) } </script> <script> function clearRadioButtons(){ var ele = document.querySelectorAll("input[type=radio]"); for(var i=0;i<ele.length;i++){ ele[i].checked = false; } } function reLoad_Page() { event.preventDefault() google.script.run.withSuccessHandler(function(url){ window.open(url,'_top'); }) .getURL(); } window.addEventListener('load', function() { // updateall() }); // function updateall(){ // var user = {} // user.searchtext1 = $('#searchtext1').val() // google.script.run.withSuccessHandler(showtb).searchdata(user); // } // setTimeout(() => { // updateall() // }, 10000); </script> <!-- ***** Sweetaler 2011 ***** --> <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>


Index.html <script> function teachSet(){ $('#modal_teach').modal('show') } </script> <script> let stdID = document.getElementById('stdID'); let showname = document.getElementById('showname'); function whenButtonClicked(){ event.preventDefault() let checked; let temp = document.querySelectorAll('.multi:checked'); if(temp != null){ let checkedvalues = Array.prototype.map.call(temp, function(el){ return el.value }) checked = checkedvalues.join(",") }else{ checked = null } let obj = {} obj.stdID = document.getElementById('stdID').value obj.date = document.getElementById('date').value obj.pakrean = document.getElementById('pakrean').value obj.pee = document.getElementById('pee').value obj.rahaswicha = document.getElementById('rahaswicha').value obj.wicha = document.getElementById('wicha').value obj.kab = document.getElementById('kab').value obj.jamnuen = document.getElementById('jamnuen').value obj.neay = document.getElementById('neay').value obj.reing = document.getElementById('reing').value obj.chan = document.getElementById('chan').value obj.sanernea = document.getElementById('sanernea').value


obj.nitest = document.getElementById('shownameposit').value obj.checked = checked if(checked.length <38){ const Toast = Swal.mixin({ toast: true, position: 'top-end', showConfirmButton: false, timer: 1000, }) Toast.fire({ icon: 'error', title: 'กรอกขอมูลใหครบทุกชอง' }) }else{ document.getElementById('btn_2').style.display="block"; document.getElementById('btn_1').style.display="none"; google.script.run.saveData(obj) reLoad() } } function reLoad() { google.script.run.withSuccessHandler(function(url){ Swal.fire({ position: 'top-center', icon: 'success', title: 'บันทึกเรียบรอยแลว', showConfirmButton: false, timer: 1500 }) $("#closebtn").click() document.getElementById('btn_2').style.display="none"; document.getElementById('btn_1').style.display="block"; //window.open(url,'_top'); }) .getURL();


} function upload(){ let timerInterval Swal.fire({ title: 'กำลังสรางรายงาน!', html: 'สรางรายงานเสร็จภายใน <b></b> วินาที', timer: 12000, timerProgressBar: true, didOpen: () => { Swal.showLoading() const b = Swal.getHtmlContainer().querySelector('b') timerInterval = setInterval(() => { b.textContent = (Swal.getTimerLeft() / 1000) .toFixed(0) }, 100) }, willClose: () => { clearInterval(timerInterval) } }).then((result) => { /* Read more about handling dismissals below */ if (result.dismiss === Swal.DismissReason.timer) { console.log('I was closed by the timer') } }) } </script> <script> function clearRadioButtons(){ var ele = document.querySelectorAll("input[type=radio]"); for(var i=0;i<ele.length;i++){ ele[i].checked = false; } }


function reLoad_Page() { event.preventDefault() google.script.run.withSuccessHandler(function(url){ window.open(url,'_top'); }) .getURL(); } window.addEventListener('load', function() { // updateall() }); // function updateall(){ // var user = {} // user.searchtext1 = $('#searchtext1').val() // google.script.run.withSuccessHandler(showtb).searchdata(user); // } // setTimeout(() => { // updateall() // }, 10000); </script> <!-- ***** Sweetaler 2011 ***** --> <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>


Formlist.html <!-- <div class="row mb-2"> <div class="col" id="tableshow"> <div id="search-results" class="table-responsive text-center"></div> </div> </div> --> <script> google.script.run.withSuccessHandler(showTable).searchData1("list"); //แสดงตาราง function showTable(dataArray) { if (dataArray && dataArray !== undefined && dataArray.length != 0) { var result = "<table class='table table-sm table-hover table-bordered ' style='width:100%'>" + "<thead class='table-primary text-center'>" + "<tr>" + "<th>ขอ</th>" + "<th>รายการประเมิน</th>" + "<th>5</th>" + "<th>4</th>" + "<th>3</th>" + "<th>2</th>" + "<th>1</th>" + "</tr>" + "</thead>"; result += `<tr> <td rowspan="3" align='left'>${dataArray[0][0]}</td> <td align='left'>${dataArray[0][1]}</td> <td> <input type='radio' name='${dataArray[0][1]}' value='${dataArray[0][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[0][1]}' value='${dataArray[0][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[0][1]}' value='${dataArray[0][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[0][1]}' value='${dataArray[0][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[0][1]}' value='${dataArray[0][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[1][1]}</td> <td> <input type='radio' name='${dataArray[1][1]}' value='${dataArray[1][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[1][1]}' value='${dataArray[1][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[1][1]}' value='${dataArray[1][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[1][1]}' value='${dataArray[1][5]}' id='a1' class='multi me-1' required > </td> <td>


<input type='radio' name='${dataArray[1][1]}' value='${dataArray[1][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[2][1]}</td> <td> <input type='radio' name='${dataArray[2][1]}' value='${dataArray[2][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[2][1]}' value='${dataArray[2][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[2][1]}' value='${dataArray[2][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[2][1]}' value='${dataArray[2][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[2][1]}' value='${dataArray[2][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td rowspan="7" align='left'>${dataArray[3][0]}</td> <td align='left'>${dataArray[3][1]}</td> <td> <input type='radio' name='${dataArray[3][1]}' value='${dataArray[3][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[3][1]}' value='${dataArray[3][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[3][1]}' value='${dataArray[3][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[3][1]}' value='${dataArray[3][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[3][1]}' value='${dataArray[3][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[4][1]}</td> <td> <input type='radio' name='${dataArray[4][1]}' value='${dataArray[4][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[4][1]}' value='${dataArray[4][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[4][1]}' value='${dataArray[4][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[4][1]}' value='${dataArray[4][5]}' id='a1' class='multi me-1' required > </td> <td>


<input type='radio' name='${dataArray[4][1]}' value='${dataArray[4][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[5][1]}</td> <td> <input type='radio' name='${dataArray[5][1]}' value='${dataArray[5][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[5][1]}' value='${dataArray[5][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[5][1]}' value='${dataArray[5][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[5][1]}' value='${dataArray[5][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[5][1]}' value='${dataArray[5][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[6][1]}</td> <td> <input type='radio' name='${dataArray[6][1]}' value='${dataArray[6][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[6][1]}' value='${dataArray[6][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[6][1]}' value='${dataArray[6][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[6][1]}' value='${dataArray[6][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[6][1]}' value='${dataArray[6][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[7][1]}</td> <td> <input type='radio' name='${dataArray[7][1]}' value='${dataArray[7][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[7][1]}' value='${dataArray[7][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[7][1]}' value='${dataArray[7][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[7][1]}' value='${dataArray[7][5]}' id='a1' class='multi me-1' required > </td> <td>


<input type='radio' name='${dataArray[7][1]}' value='${dataArray[7][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[8][1]}</td> <td> <input type='radio' name='${dataArray[8][1]}' value='${dataArray[8][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[8][1]}' value='${dataArray[8][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[8][1]}' value='${dataArray[8][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[8][1]}' value='${dataArray[8][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[8][1]}' value='${dataArray[8][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[9][1]}</td> <td> <input type='radio' name='${dataArray[9][1]}' value='${dataArray[9][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[9][1]}' value='${dataArray[9][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[9][1]}' value='${dataArray[9][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[9][1]}' value='${dataArray[9][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[9][1]}' value='${dataArray[9][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td rowspan="8" align='left'>${dataArray[10][0]}</td> <td align='left'>${dataArray[10][1]}</td> <td> <input type='radio' name='${dataArray[10][1]}' value='${dataArray[10][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[10][1]}' value='${dataArray[10][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[10][1]}' value='${dataArray[10][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[10][1]}' value='${dataArray[10][5]}' id='a1' class='multi me-1' required > </td>


<td> <input type='radio' name='${dataArray[10][1]}' value='${dataArray[10][6]}' id='a1' class='multi me-1' required > </td> <tr> <td align='left'>${dataArray[11][1]}</td> <td> <input type='radio' name='${dataArray[11][1]}' value='${dataArray[11][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[11][1]}' value='${dataArray[11][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[11][1]}' value='${dataArray[11][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[11][1]}' value='${dataArray[11][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[11][1]}' value='${dataArray[11][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[12][1]}</td> <td> <input type='radio' name='${dataArray[12][1]}' value='${dataArray[12][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[12][1]}' value='${dataArray[12][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[12][1]}' value='${dataArray[12][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[12][1]}' value='${dataArray[12][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[12][1]}' value='${dataArray[12][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[13][1]}</td> <td> <input type='radio' name='${dataArray[13][1]}' value='${dataArray[13][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[13][1]}' value='${dataArray[13][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[13][1]}' value='${dataArray[13][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[13][1]}' value='${dataArray[13][5]}' id='a1' class='multi me-1' required > </td> <td>


<input type='radio' name='${dataArray[13][1]}' value='${dataArray[13][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[14][1]}</td> <td> <input type='radio' name='${dataArray[14][1]}' value='${dataArray[14][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[14][1]}' value='${dataArray[14][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[14][1]}' value='${dataArray[14][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[14][1]}' value='${dataArray[14][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[14][1]}' value='${dataArray[14][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[15][1]}</td> <td> <input type='radio' name='${dataArray[15][1]}' value='${dataArray[15][2]}' id='a1' class='multi me-1' required checked> </td> <td>


<input type='radio' name='${dataArray[15][1]}' value='${dataArray[15][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[15][1]}' value='${dataArray[15][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[15][1]}' value='${dataArray[15][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[15][1]}' value='${dataArray[15][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[16][1]}</td> <td> <input type='radio' name='${dataArray[16][1]}' value='${dataArray[16][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[16][1]}' value='${dataArray[16][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[16][1]}' value='${dataArray[16][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[16][1]}' value='${dataArray[16][5]}' id='a1' class='multi me-1' required > </td> <td>


<input type='radio' name='${dataArray[16][1]}' value='${dataArray[16][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[17][1]}</td> <td> <input type='radio' name='${dataArray[17][1]}' value='${dataArray[17][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[17][1]}' value='${dataArray[17][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[17][1]}' value='${dataArray[17][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[17][1]}' value='${dataArray[17][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[17][1]}' value='${dataArray[17][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td rowspan="2" align='left'>${dataArray[18][0]}</td> <td align='left'>${dataArray[18][1]}</td> <td> <input type='radio' name='${dataArray[18][1]}' value='${dataArray[18][2]}' id='a1' class='multi me-1' required checked> </td>


<td> <input type='radio' name='${dataArray[18][1]}' value='${dataArray[18][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[18][1]}' value='${dataArray[18][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[18][1]}' value='${dataArray[18][5]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[18][1]}' value='${dataArray[18][6]}' id='a1' class='multi me-1' required > </td> </tr> <tr> <td align='left'>${dataArray[19][1]}</td> <td> <input type='radio' name='${dataArray[19][1]}' value='${dataArray[19][2]}' id='a1' class='multi me-1' required checked> </td> <td> <input type='radio' name='${dataArray[19][1]}' value='${dataArray[19][3]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[19][1]}' value='${dataArray[19][4]}' id='a1' class='multi me-1' required > </td> <td> <input type='radio' name='${dataArray[19][1]}' value='${dataArray[19][5]}' id='a1' class='multi me-1' required > </td>


Click to View FlipBook Version