New+Cheat+Sheet+Request+-+[use code ]

[utong-sadu]

<title>របាយការណ៍សិស្ស</title> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/datatables.net/js/jquery.dataTables.min.js"></script> <style> body { font-family: 'Khmer OS', sans-serif; padding: 20px; } input, select, button { width: 100%; margin: 5px 0; padding: 8px; } canvas { max-width: 600px; margin-top: 20px; } #dataTableWrapper { display: none; margin-top: 20px; } </style>

📋 Paste Google Sheet Link

Load Data Generate Report

📊 របាយការណ៍តាមភូមិ/ភេទ/អាយុ

➕ បញ្ចូលសិស្សថ្មី

បស បញ្ចូល

🔍 ស្វែងរកទិន្នន័យសិស្ស

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> let studentData = []; function loadSheet() { const link = document.getElementById('sheetLink').value; const sheetId = link.match(/\/d\/(.*?)\//)[1]; fetch(`https://opensheet.elk.sh/${sheetId}/1`) .then(res => res.json()) .then(data => { studentData = data; localStorage.setItem('studentData', JSON.stringify(studentData)); renderTable(studentData); alert("✅ Loaded and saved locally."); }); } function calculateAge(dobStr) { const dob = new Date(dobStr); const today = new Date(); return today.getFullYear() - dob.getFullYear(); } function generateReport() { const data = JSON.parse(localStorage.getItem('studentData') || '[]'); const summary = {}; data.forEach(row => { const village = row["ភូមិ"] || row["ទីកន្លែងកំណើត"]; const gender = row["ភេទ"]; const age = calculateAge(row["ថ្ងៃខែឆ្នាំកំណើត"]); if (!summary[village]) summary[village] = { male: 0, female: 0, age6_12: 0, age13_18: 0 }; if (gender === "ប") summary[village].male++; else summary[village].female++; if (age >= 6 && age <= 12) summary[village].age6_12++; else if (age >= 13 && age <= 18) summary[village].age13_18++; }); const reportDiv = document.getElementById('report'); reportDiv.innerHTML = ''; const labels = [], males = [], females = []; for (const village in summary) { const s = summary[village]; labels.push(village); males.push(s.male); females.push(s.female); reportDiv.innerHTML += `

${village}: ប្រុស ${s.male}, ស្រី ${s.female}, អាយុ 6–12: ${s.age6_12}, អាយុ 13–18: ${s.age13_18}

`; } new Chart(document.getElementById('chart'), { type: 'bar', data: { labels, datasets: [ { label: 'ប្រុស', data: males, backgroundColor: 'blue' }, { label: 'ស្រី', data: females, backgroundColor: 'pink' } ] } }); } function renderTable(data) { const headers = Object.keys(data[0]); document.getElementById('tableHeader').innerHTML = headers.map(h => `${h}`).join(''); document.getElementById('tableBody').innerHTML = data.map(row => `${headers.map(h => `${row[h]}`).join('')}` ).join(''); $('#dataTable').DataTable(); } function toggleTable() { const input = document.getElementById('searchInput').value.trim(); const wrapper = document.getElementById('dataTableWrapper'); wrapper.style.display = input.length > 0 ? 'block' : 'none'; } function syncToGoogleSheet(student) { fetch("https://script.google.com/macros/s/AKfycbwu_v-pOEVM6-I9j5LBzSI97ieVShTBc-En4bPu-Cqt1n-I9gS3YHO_GxovFDkTlHos/exec", { method: "POST", body: JSON.stringify(student), headers: { "Content-Type": "application/json" } }) .then(res => res.text()) .then(msg => console.log("✅ Synced:", msg)) .catch(err => console.error("❌ Sync error:", err)); } document.getElementById('studentForm').addEventListener('submit', function(e) { e.preventDefault(); const formData = new FormData(e.target); const newStudent = {}; formData.forEach((value, key) => newStudent[key] = value); newStudent["អាយុ"] = calculateAge(newStudent["ថ្ងៃខែឆ្នាំកំណើត"]); const existing = JSON.parse(localStorage.getItem('studentData') || '[]'); existing.push(newStudent); localStorage.setItem('studentData', JSON.stringify(existing)); syncToGoogleSheet(newStudent); alert("✅ បញ្ចូលសិស្សថ្មីរួចរាល់"); generateReport(); renderTable(existing); e.target.reset(); }); </script>