{"id":813,"date":"2026-07-31T18:00:15","date_gmt":"2026-07-31T18:00:15","guid":{"rendered":"https:\/\/freewebtools.co.in\/?page_id=813"},"modified":"2026-07-31T18:00:15","modified_gmt":"2026-07-31T18:00:15","slug":"student-management","status":"publish","type":"page","link":"https:\/\/freewebtools.co.in\/index.php\/student-management\/","title":{"rendered":"Student Management"},"content":{"rendered":"\n<div id=\"spa-enterprise-wrapper\">\n  <style>\n    #spa-enterprise-wrapper {\n      all: initial;\n      font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n      color: #0f172a;\n      background: #ffffff;\n      display: block;\n      width: 100%;\n      box-sizing: border-box;\n      padding: 24px;\n    }\n    #spa-enterprise-wrapper *, #spa-enterprise-wrapper *::before, #spa-enterprise-wrapper *::after {\n      box-sizing: border-box;\n    }\n    #spa-enterprise-wrapper .sec-container {\n      max-width: 1500px;\n      margin: 0 auto;\n    }\n    #spa-enterprise-wrapper header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 24px;\n      border-bottom: 2px solid #e2e8f0;\n      padding-bottom: 16px;\n      flex-wrap: wrap;\n      gap: 12px;\n    }\n    #spa-enterprise-wrapper h1 {\n      font-size: 26px;\n      font-weight: 700;\n      margin: 0;\n      color: #0f172a;\n    }\n    #spa-enterprise-wrapper .sec-btn {\n      background: #2563eb;\n      color: #ffffff;\n      border: none;\n      padding: 8px 16px;\n      border-radius: 6px;\n      font-weight: 600;\n      cursor: pointer;\n      font-size: 14px;\n      transition: background 0.2s;\n    }\n    #spa-enterprise-wrapper .sec-btn:hover { background: #1d4ed8; }\n    #spa-enterprise-wrapper .sec-btn-secondary { background: #475569; }\n    #spa-enterprise-wrapper .sec-btn-secondary:hover { background: #334155; }\n    #spa-enterprise-wrapper .sec-btn-danger { background: #dc2626; }\n    #spa-enterprise-wrapper .sec-btn-danger:hover { background: #b91c1c; }\n\n    #spa-enterprise-wrapper .sec-controls-bar {\n      display: flex;\n      gap: 12px;\n      margin-bottom: 20px;\n      flex-wrap: wrap;\n      background: #f8fafc;\n      padding: 16px;\n      border: 1px solid #e2e8f0;\n      border-radius: 8px;\n    }\n    #spa-enterprise-wrapper input, #spa-enterprise-wrapper select {\n      padding: 8px 12px;\n      border: 1px solid #cbd5e1;\n      border-radius: 6px;\n      font-size: 14px;\n      outline: none;\n      background: #fff;\n      color: #0f172a;\n    }\n    #spa-enterprise-wrapper input:focus, #spa-enterprise-wrapper select:focus {\n      border-color: #2563eb;\n      box-shadow: 0 0 0 2px rgba(37,99,235,0.2);\n    }\n\n    #spa-enterprise-wrapper .sec-grid-cards {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n      gap: 16px;\n      margin-bottom: 24px;\n    }\n    #spa-enterprise-wrapper .sec-card {\n      background: #f8fafc;\n      border: 1px solid #e2e8f0;\n      border-radius: 8px;\n      padding: 16px;\n      box-shadow: 0 1px 3px rgba(0,0,0,0.05);\n    }\n    #spa-enterprise-wrapper .sec-card-title {\n      font-size: 11px;\n      font-weight: 700;\n      color: #64748b;\n      text-transform: uppercase;\n      letter-spacing: 0.05em;\n      margin-bottom: 6px;\n    }\n    #spa-enterprise-wrapper .sec-card-value {\n      font-size: 22px;\n      font-weight: 700;\n      color: #0f172a;\n    }\n\n    #spa-enterprise-wrapper .sec-tabs {\n      display: flex;\n      gap: 8px;\n      border-bottom: 1px solid #cbd5e1;\n      margin-bottom: 20px;\n      padding-bottom: 8px;\n      overflow-x: auto;\n    }\n    #spa-enterprise-wrapper .sec-tab {\n      background: none;\n      border: none;\n      font-weight: 600;\n      color: #64748b;\n      padding: 8px 14px;\n      border-radius: 6px;\n      cursor: pointer;\n      white-space: nowrap;\n    }\n    #spa-enterprise-wrapper .sec-tab.active {\n      background: #eff6ff;\n      color: #2563eb;\n    }\n    #spa-enterprise-wrapper .sec-section { display: none; }\n    #spa-enterprise-wrapper .sec-section.active { display: block; }\n\n    #spa-enterprise-wrapper .sec-table-wrap {\n      overflow-x: auto;\n      max-height: 550px;\n      border: 1px solid #e2e8f0;\n      border-radius: 8px;\n      background: #ffffff;\n      margin-bottom: 20px;\n    }\n    #spa-enterprise-wrapper table {\n      width: 100%;\n      border-collapse: collapse;\n      text-align: left;\n      font-size: 13px;\n    }\n    #spa-enterprise-wrapper th {\n      background: #f1f5f9;\n      color: #334155;\n      font-weight: 600;\n      padding: 12px 16px;\n      border-bottom: 1px solid #cbd5e1;\n      position: sticky;\n      top: 0;\n      z-index: 10;\n    }\n    #spa-enterprise-wrapper td {\n      padding: 12px 16px;\n      border-bottom: 1px solid #f1f5f9;\n      color: #475569;\n    }\n    #spa-enterprise-wrapper tr:hover td { background: #f8fafc; }\n\n    \/* Modal Styling *\/\n    #spa-enterprise-wrapper .sec-modal {\n      display: none;\n      position: fixed;\n      top: 0; left: 0; width: 100%; height: 100%;\n      background: rgba(0,0,0,0.6);\n      z-index: 1000;\n      justify-content: center;\n      align-items: center;\n      padding: 20px;\n    }\n    #spa-enterprise-wrapper .sec-modal.active { display: flex; }\n    #spa-enterprise-wrapper .sec-modal-content {\n      background: #fff;\n      padding: 30px;\n      border-radius: 8px;\n      width: 100%;\n      max-width: 700px;\n      max-height: 90vh;\n      overflow-y: auto;\n      box-shadow: 0 10px 25px rgba(0,0,0,0.2);\n    }\n    #spa-enterprise-wrapper .sec-form-group {\n      margin-bottom: 14px;\n    }\n    #spa-enterprise-wrapper .sec-form-group label {\n      display: block;\n      font-size: 12px;\n      font-weight: 600;\n      color: #64748b;\n      margin-bottom: 4px;\n    }\n    #spa-enterprise-wrapper .sec-form-group input, #spa-enterprise-wrapper .sec-form-group select {\n      width: 100%;\n    }\n\n    \/* Print media optimization *\/\n    @media print {\n      body * { visibility: hidden; }\n      #spa-enterprise-wrapper, #spa-enterprise-wrapper * { visibility: visible; }\n      #spa-enterprise-wrapper { position: absolute; left: 0; top: 0; width: 100%; padding: 0; background: #fff; }\n      .sec-controls-bar, .sec-tabs, header button, .sec-table-wrap button { display: none !important; }\n    }\n  <\/style>\n\n  <div class=\"sec-container\">\n    <header>\n      <div>\n        <h1>Enterprise Student Performance Analytics &#038; Management<\/h1>\n        <p id=\"sec-header-meta\" style=\"margin:4px 0 0 0; font-size:13px; color:#64748b;\">Session: 2026\u201327 | Dept: Computer Science | Class: BCA Semester 1<\/p>\n      <\/div>\n      <div style=\"display:flex; gap:8px; flex-wrap:wrap;\">\n        <button class=\"sec-btn\" id=\"sec-btn-new\">New Student (Ctrl+N)<\/button>\n        <button class=\"sec-btn sec-btn-secondary\" id=\"sec-btn-backup\">One-Click Backup<\/button>\n        <button class=\"sec-btn sec-btn-secondary\" id=\"sec-btn-restore-trigger\">Restore JSON<\/button>\n        <input type=\"file\" id=\"sec-file-restore\" style=\"display:none\" accept=\".json\">\n        <button class=\"sec-btn sec-btn-secondary\" id=\"sec-btn-export\">Export CSV<\/button>\n        <button class=\"sec-btn sec-btn-secondary\" id=\"sec-btn-print\">Print Report (Ctrl+P)<\/button>\n      <\/div>\n    <\/header>\n\n    <!-- Context & Controls Toolbar -->\n    <div class=\"sec-controls-bar\">\n      <select id=\"sec-ctx-session\">\n        <option value=\"2026-27\">Session 2026\u201327<\/option>\n        <option value=\"2027-28\">Session 2027\u201328<\/option>\n        <option value=\"2028-29\">Session 2028\u201329<\/option>\n      <\/select>\n      <select id=\"sec-ctx-dept\">\n        <option value=\"Computer Science\">Computer Science<\/option>\n        <option value=\"Information Technology\">Information Technology<\/option>\n        <option value=\"Electronics\">Electronics<\/option>\n        <option value=\"Mechanical\">Mechanical<\/option>\n        <option value=\"Civil\">Civil<\/option>\n        <option value=\"Electrical\">Electrical<\/option>\n      <\/select>\n      <select id=\"sec-ctx-class\">\n        <option value=\"BCA Sem 1\">BCA Semester 1<\/option>\n        <option value=\"BCA Sem 3\">BCA Semester 3<\/option>\n        <option value=\"B.Tech CSE Sem 5\">B.Tech CSE Semester 5<\/option>\n        <option value=\"MCA Sem 2\">MCA Semester 2<\/option>\n      <\/select>\n      <input type=\"text\" id=\"sec-search-input\" placeholder=\"Instant Search (Ctrl+F)...\" style=\"flex:1; min-width:200px;\">\n      <select id=\"sec-filter-status\">\n        <option value=\"\">All Results<\/option>\n        <option value=\"Pass\">Pass Only<\/option>\n        <option value=\"Fail\">Fail \/ Backlog<\/option>\n        <option value=\"Distinction\">Distinction<\/option>\n      <\/select>\n    <\/div>\n\n    <!-- Live Metrics Dashboard Cards -->\n    <div class=\"sec-grid-cards\" id=\"sec-dashboard-cards\"><\/div>\n\n    <!-- Navigation Tabs -->\n    <div class=\"sec-tabs\">\n      <button class=\"sec-tab active\" data-target=\"sec-sec-directory\">Student Directory &#038; Management<\/button>\n      <button class=\"sec-tab\" data-target=\"sec-sec-analytics\">Advanced Class Analytics<\/button>\n      <button class=\"sec-tab\" data-target=\"sec-sec-settings\">Settings &#038; Grading Configuration<\/button>\n    <\/div>\n\n    {\/* Section 1: Directory *\/}\n    <div id=\"sec-sec-directory\" class=\"sec-section active\">\n      <div class=\"sec-table-wrap\">\n        <table>\n          <thead>\n            <tr>\n              <th>Roll<\/th>\n              <th>Reg No<\/th>\n              <th>Student Name<\/th>\n              <th>Department<\/th>\n              <th>Class \/ Sem<\/th>\n              <th>Total Marks<\/th>\n              <th>Percentage<\/th>\n              <th>GPA<\/th>\n              <th>CGPA<\/th>\n              <th>Rank<\/th>\n              <th>Status<\/th>\n              <th>Actions<\/th>\n            <\/tr>\n          <\/thead>\n          <tbody id=\"sec-directory-tbody\"><\/tbody>\n        <\/table>\n      <\/div>\n    <\/div>\n\n    {\/* Section 2: Analytics *\/}\n    <div id=\"sec-sec-analytics\" class=\"sec-section\">\n      <div style=\"background:#f8fafc; padding:20px; border:1px solid #e2e8f0; border-radius:8px;\">\n        <h3 style=\"margin-top:0;\">Department &#038; Class Telemetry Summary<\/h3>\n        <p id=\"sec-analytics-summary\" style=\"font-size:14px; line-height:1.6; color:#334155;\"><\/p>\n      <\/div>\n    <\/div>\n\n    {\/* Section 3: Settings *\/}\n    <div id=\"sec-sec-settings\" class=\"sec-section\">\n      <div style=\"background:#f8fafc; padding:20px; border:1px solid #e2e8f0; border-radius:8px; max-width:600px;\">\n        <h3 style=\"margin-top:0;\">Institution Preferences &#038; Grading Config<\/h3>\n        <div class=\"sec-form-group\">\n          <label>College \/ Institution Name<\/label>\n          <input type=\"text\" id=\"sec-cfg-college\" value=\"Institute of Higher Education &#038; Technology\">\n        <\/div>\n        <div class=\"sec-form-group\">\n          <label>Default Passing Threshold (%)<\/label>\n          <input type=\"number\" id=\"sec-cfg-passing\" value=\"40\">\n        <\/div>\n        <button class=\"sec-btn\" id=\"sec-btn-save-settings\">Save Configurations<\/button>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- Student Add\/Edit Modal -->\n  <div class=\"sec-modal\" id=\"sec-student-modal\">\n    <div class=\"sec-modal-content\">\n      <div style=\"display:flex; justify-content:space-between; align-items:center; margin-bottom:16px;\">\n        <h3 id=\"sec-modal-title\" style=\"margin:0;\">Add Student Record<\/h3>\n        <button class=\"sec-btn sec-btn-secondary\" id=\"sec-modal-close\" style=\"padding:4px 8px;\">\u00d7<\/button>\n      <\/div>\n      <form id=\"sec-student-form\">\n        <input type=\"hidden\" id=\"sec-f-id\">\n        <div style=\"display:grid; grid-template-columns: 1fr 1fr; gap: 12px;\">\n          <div class=\"sec-form-group\">\n            <label>Roll Number *<\/label>\n            <input type=\"text\" id=\"sec-f-roll\" required>\n          <\/div>\n          <div class=\"sec-form-group\">\n            <label>Registration Number *<\/label>\n            <input type=\"text\" id=\"sec-f-reg\" required>\n          <\/div>\n          <div class=\"sec-form-group\" style=\"grid-column: span 2;\">\n            <label>Full Student Name *<\/label>\n            <input type=\"text\" id=\"sec-f-name\" required>\n          <\/div>\n          <div class=\"sec-form-group\">\n            <label>Batch (e.g., 2026\u201330)<\/label>\n            <input type=\"text\" id=\"sec-f-batch\" value=\"2026\u201330\">\n          <\/div>\n          <div class=\"sec-form-group\">\n            <label>Obtained Marks (out of 500)<\/label>\n            <input type=\"number\" id=\"sec-f-marks\" min=\"0\" max=\"500\" required value=\"410\">\n          <\/div>\n        <\/div>\n        <div style=\"margin-top:16px; display:flex; justify-content:flex-end; gap:8px;\">\n          <button type=\"button\" class=\"sec-btn sec-btn-secondary\" id=\"sec-modal-cancel\">Cancel<\/button>\n          <button type=\"submit\" class=\"sec-btn\">Save Student<\/button>\n        <\/div>\n      <\/form>\n    <\/div>\n  <\/div>\n\n  <script>\n    (function() {\n      'use strict';\n\n      \/\/ Application State Engine with LocalStorage persistence & safety recovery\n      let appState = {\n        session: '2026-27',\n        dept: 'Computer Science',\n        className: 'BCA Sem 1',\n        college: 'Institute of Higher Education & Technology',\n        passingMark: 40,\n        records: JSON.parse(localStorage.getItem('sec_enterprise_data') || '[]')\n      };\n\n      const defaultMock = [\n        { id: '101', roll: 'CS-01', reg: 'REG2026001', name: 'Alexander Wright', dept: 'Computer Science', className: 'BCA Sem 1', session: '2026-27', marks: 465 },\n        { id: '102', roll: 'CS-02', reg: 'REG2026002', name: 'Beatrice Vance', dept: 'Computer Science', className: 'BCA Sem 1', session: '2026-27', marks: 380 },\n        { id: '103', roll: 'CS-03', reg: 'REG2026003', name: 'Caleb Thorne', dept: 'Computer Science', className: 'BCA Sem 1', session: '2026-27', marks: 195 },\n        { id: '104', roll: 'CS-04', reg: 'REG2026004', name: 'Danielle Sterling', dept: 'Computer Science', className: 'BCA Sem 1', session: '2026-27', marks: 490 }\n      ];\n\n      if (appState.records.length === 0) {\n        appState.records = defaultMock;\n        persistStorage();\n      }\n\n      function persistStorage() {\n        try {\n          localStorage.setItem('sec_enterprise_data', JSON.stringify(appState.records));\n        } catch(e) {\n          alert('Storage limit reached or browser blocking LocalStorage.');\n        }\n      }\n\n      \/\/ Calculation Engine\n      function computeEngine() {\n        const currentContextRecords = appState.records.filter(r => r.session === appState.session && r.dept === appState.dept && r.className === appState.className);\n        const total = currentContextRecords.length;\n        if (total === 0) return { total: 0, processed: [], avgPct: 0, highest: 0, lowest: 0, passPct: 0, failPct: 0, distinction: 0 };\n\n        const processed = currentContextRecords.map(r => {\n          const m = Number(r.marks) || 0;\n          const pct = (m \/ 500) * 100;\n          let grade = 'F', gpa = 0.0, status = 'Fail', division = 'Third';\n          if (pct >= 85) { grade = 'A+'; gpa = 10.0; status = 'Pass'; division = 'Distinction'; }\n          else if (pct >= 75) { grade = 'A'; gpa = 9.0; status = 'Pass'; division = 'First Division'; }\n          else if (pct >= 65) { grade = 'B+'; gpa = 8.0; status = 'Pass'; division = 'First Division'; }\n          else if (pct >= 55) { grade = 'B'; gpa = 7.0; status = 'Pass'; division = 'Second Division'; }\n          else if (pct >= 45) { grade = 'C'; gpa = 6.0; status = 'Pass'; division = 'Third Division'; }\n          else if (pct >= appState.passingMark) { grade = 'D'; gpa = 5.0; status = 'Pass'; division = 'Third Division'; }\n          else { status = 'Backlog'; division = 'Fail'; }\n\n          return { ...r, totalMarks: m, percentage: pct, grade, gpa, cgpa: gpa, status, division };\n        });\n\n        processed.sort((a,b) => b.totalMarks - a.totalMarks);\n        processed.forEach((r, idx) => { r.rank = idx + 1; });\n\n        const avgMarks = processed.reduce((acc, r) => acc + r.totalMarks, 0) \/ total;\n        const avgPct = (avgMarks \/ 500) * 100;\n        const highest = processed[0].totalMarks;\n        const lowest = processed[processed.length - 1].totalMarks;\n        const passCount = processed.filter(r => r.status === 'Pass').length;\n        const passPct = (passCount \/ total) * 100;\n        const failPct = 100 - passPct;\n        const distinctionCount = processed.filter(r => r.division === 'Distinction').length;\n\n        return {\n          total, processed, avgPct, highest, lowest, passPct, failPct, distinctionCount,\n          topPerformer: processed[0] ? processed[0].name : '-',\n          lowestPerformer: processed[processed.length - 1] ? processed[processed.length - 1].name : '-'\n        };\n      }\n\n      \/\/ Render Cards\n      function renderDashboardCards() {\n        const metrics = computeEngine();\n        const cards = [\n          { title: 'Total Students', val: metrics.total },\n          { title: 'Average Percentage', val: `${metrics.avgPct.toFixed(1)}%` },\n          { title: 'Highest Marks', val: metrics.highest },\n          { title: 'Lowest Marks', val: metrics.lowest },\n          { title: 'Pass Percentage', val: `${metrics.passPct.toFixed(1)}%` },\n          { title: 'Fail \/ Backlog %', val: `${metrics.failPct.toFixed(1)}%` },\n          { title: 'Distinctions', val: metrics.distinctionCount },\n          { title: 'Top Performer', val: metrics.topPerformer }\n        ];\n\n        document.getElementById('sec-dashboard-cards').innerHTML = cards.map(c => `\n          <div class=\"sec-card\">\n            <div class=\"sec-card-title\">${c.title}<\/div>\n            <div class=\"sec-card-value\">${c.val}<\/div>\n          <\/div>\n        `).join('');\n      }\n\n      \/\/ Render Table Directory\n      function renderDirectory() {\n        const metrics = computeEngine();\n        const searchTerm = document.getElementById('sec-search-input').value.toLowerCase();\n        const statusFilter = document.getElementById('sec-filter-status').value;\n\n        const filtered = metrics.processed.filter(r => {\n          const matchSearch = Object.values(r).some(val => String(val).toLowerCase().includes(searchTerm));\n          const matchStatus = !statusFilter || (statusFilter === 'Distinction' ? r.division === 'Distinction' : r.status === statusFilter);\n          return matchSearch && matchStatus;\n        });\n\n        const tbody = document.getElementById('sec-directory-tbody');\n        if (filtered.length === 0) {\n          tbody.innerHTML = `<tr><td colspan=\"12\" style=\"text-align:center; color:#64748b;\">No matching student records found in current context.<\/td><\/tr>`;\n          return;\n        }\n\n        tbody.innerHTML = filtered.map(r => `\n          <tr>\n            <td>${r.roll}<\/td>\n            <td>${r.reg}<\/td>\n            <td><strong>${r.name}<\/strong><\/td>\n            <td>${r.dept}<\/td>\n            <td>${r.className}<\/td>\n            <td>${r.totalMarks}<\/td>\n            <td>${r.percentage.toFixed(1)}%<\/td>\n            <td>${r.gpa}<\/td>\n            <td>${r.cgpa}<\/td>\n            <td>#${r.rank}<\/td>\n            <td><span style=\"color:${r.status === 'Pass' ? '#16a34a' : '#dc2626'}\">${r.status}<\/span><\/td>\n            <td>\n              <button class=\"sec-btn\" style=\"padding:4px 8px; font-size:12px;\" onclick=\"window.secEditRecord('${r.id}')\">Edit<\/button>\n              <button class=\"sec-btn sec-btn-danger\" style=\"padding:4px 8px; font-size:12px;\" onclick=\"window.secDeleteRecord('${r.id}')\">Del<\/button>\n            <\/td>\n          <\/tr>\n        `).join('');\n      }\n\n      function updateUI() {\n        document.getElementById('sec-header-meta').innerText = `Session: ${appState.session} | Dept: ${appState.dept} | Class: ${appState.className}`;\n        renderDashboardCards();\n        renderDirectory();\n      }\n\n      \/\/ Event Listeners setup\n      document.addEventListener('DOMContentLoaded', () => {\n        updateUI();\n\n        \/\/ Context Toolbar Bindings\n        document.getElementById('sec-ctx-session').addEventListener('change', (e) => {\n          appState.session = e.target.value;\n          updateUI();\n        });\n        document.getElementById('sec-ctx-dept').addEventListener('change', (e) => {\n          appState.dept = e.target.value;\n          updateUI();\n        });\n        document.getElementById('sec-ctx-class').addEventListener('change', (e) => {\n          appState.className = e.target.value;\n          updateUI();\n        });\n\n        document.getElementById('sec-search-input').addEventListener('input', renderDirectory);\n        document.getElementById('sec-filter-status').addEventListener('change', renderDirectory);\n\n        \/\/ Tab Switching\n        document.querySelectorAll('#spa-enterprise-wrapper .sec-tab').forEach(tab => {\n          tab.addEventListener('click', (e) => {\n            document.querySelectorAll('#spa-enterprise-wrapper .sec-tab').forEach(t => t.classList.remove('active'));\n            document.querySelectorAll('#spa-enterprise-wrapper .sec-section').forEach(s => s.classList.remove('active'));\n            e.target.classList.add('active');\n            document.getElementById(e.target.getAttribute('data-target')).classList.add('active');\n          });\n        });\n\n        \/\/ Modal Controls\n        const modal = document.getElementById('sec-student-modal');\n        document.getElementById('sec-btn-new').addEventListener('click', () => {\n          document.getElementById('sec-student-form').reset();\n          document.getElementById('sec-f-id').value = '';\n          document.getElementById('sec-modal-title').innerText = 'Add Student Record';\n          modal.classList.add('active');\n        });\n        document.getElementById('sec-modal-close').addEventListener('click', () => modal.classList.remove('active'));\n        document.getElementById('sec-modal-cancel').addEventListener('click', () => modal.classList.remove('active'));\n\n        \/\/ Form Submit\n        document.getElementById('sec-student-form').addEventListener('submit', (e) => {\n          e.preventDefault();\n          const id = document.getElementById('sec-f-id').value;\n          const roll = document.getElementById('sec-f-roll').value;\n          const reg = document.getElementById('sec-f-reg').value;\n          const name = document.getElementById('sec-f-name').value;\n          const marks = Number(document.getElementById('sec-f-marks').value);\n\n          if (id) {\n            const idx = appState.records.findIndex(r => r.id === id);\n            if (idx !== -1) {\n              appState.records[idx] = { ...appState.records[idx], roll, reg, name, marks };\n            }\n          } else {\n            const newRecord = {\n              id: Date.now().toString(),\n              roll, reg, name,\n              dept: appState.dept,\n              className: appState.className,\n              session: appState.session,\n              marks\n            };\n            appState.records.push(newRecord);\n          }\n\n          persistStorage();\n          modal.classList.remove('active');\n          updateUI();\n        });\n\n        \/\/ One-Click Backup\n        document.getElementById('sec-btn-backup').addEventListener('click', () => {\n          const dataStr = \"data:text\/json;charset=utf-8,\" + encodeURIComponent(JSON.stringify(appState, null, 2));\n          const dl = document.createElement('a');\n          dl.setAttribute(\"href\", dataStr);\n          dl.setAttribute(\"download\", `spa_backup_${appState.session}.json`);\n          document.body.appendChild(dl);\n          dl.click();\n          dl.remove();\n        });\n\n        \/\/ Restore trigger\n        document.getElementById('sec-btn-restore-trigger').addEventListener('click', () => {\n          document.getElementById('sec-file-restore').click();\n        });\n\n        document.getElementById('sec-file-restore').addEventListener('change', (e) => {\n          const file = e.target.files[0];\n          if(!file) return;\n          const reader = new FileReader();\n          reader.onload = function(evt) {\n            try {\n              const parsed = JSON.parse(evt.target.result);\n              if (parsed && Array.isArray(parsed.records)) {\n                appState = parsed;\n                persistStorage();\n                updateUI();\n                alert('Database successfully restored from backup JSON.');\n              } else {\n                alert('Invalid backup structure.');\n              }\n            } catch(err) {\n              alert('Corrupted JSON file format.');\n            }\n          };\n          reader.readAsText(file);\n        });\n\n        \/\/ Print Mode\n        document.getElementById('sec-btn-print').addEventListener('click', () => {\n          window.print();\n        });\n\n        \/\/ Keyboard Shortcuts\n        document.addEventListener('keydown', (e) => {\n          if (e.ctrlKey && e.key === 'n') {\n            e.preventDefault();\n            document.getElementById('sec-btn-new').click();\n          } else if (e.ctrlKey && e.key === 'f') {\n            e.preventDefault();\n            document.getElementById('sec-search-input').focus();\n          } else if (e.ctrlKey && e.key === 'p') {\n            e.preventDefault();\n            window.print();\n          }\n        });\n      });\n\n      \/\/ Global scoped helper actions\n      window.secEditRecord = function(id) {\n        const r = appState.records.find(item => item.id === id);\n        if(!r) return;\n        document.getElementById('sec-f-id').value = r.id;\n        document.getElementById('sec-f-roll').value = r.roll;\n        document.getElementById('sec-f-reg').value = r.reg;\n        document.getElementById('sec-f-name').value = r.name;\n        document.getElementById('sec-f-marks').value = r.marks;\n        document.getElementById('sec-modal-title').innerText = 'Edit Student Record';\n        document.getElementById('sec-student-modal').classList.add('active');\n      };\n\n      window.secDeleteRecord = function(id) {\n        if(confirm('Are you sure you want to remove this record?')) {\n          appState.records = appState.records.filter(r => r.id !== id);\n          persistStorage();\n          updateUI();\n        }\n      };\n\n    })();\n  <\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Enterprise Student Performance Analytics &#038; Management Session: 2026\u201327 | Dept: Computer Science | Class: BCA Semester 1 New Student (Ctrl+N) One-Click Backup Restore JSON Export CSV Print Report (Ctrl+P) Session 2026\u201327Session 2027\u201328Session 2028\u201329 Computer ScienceInformation TechnologyElectronicsMechanicalCivilElectrical BCA Semester 1BCA Semester 3B.Tech CSE Semester 5MCA Semester 2 All ResultsPass OnlyFail \/ BacklogDistinction Student Directory &#038; Management [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-813","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/813","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/comments?post=813"}],"version-history":[{"count":1,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/813\/revisions"}],"predecessor-version":[{"id":814,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/813\/revisions\/814"}],"wp:attachment":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/media?parent=813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}