{"id":3789,"date":"2026-06-09T06:58:34","date_gmt":"2026-06-09T06:58:34","guid":{"rendered":"https:\/\/dbcollege.in\/?page_id=3789"},"modified":"2026-06-09T07:09:01","modified_gmt":"2026-06-09T07:09:01","slug":"alumni","status":"publish","type":"page","link":"https:\/\/dbcollege.in\/index.php\/alumni\/","title":{"rendered":"Alumni"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3789\" class=\"elementor elementor-3789\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f154d9 e-con-full e-flex e-con e-parent\" data-id=\"1f154d9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;ekit_has_onepagescroll_dot&quot;:&quot;yes&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9b8c455 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"9b8c455\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;ekit_we_effect_on&quot;:&quot;none&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"modern-breadcrumb-banner\">\r\n    <div class=\"breadcrumb-overlay\"><\/div>\r\n    <div class=\"breadcrumb-content-wrapper\">\r\n        <!-- Main Section Title -->\r\n        <h1 class=\"breadcrumb-main-title\">Alumni Registration Portal<\/h1>\r\n        \r\n        <!-- Interactive Breadcrumb Links -->\r\n        <div class=\"breadcrumb-navigation-links\">\r\n            <a href=\"https:\/\/dbcollege.in\/\" class=\"breadcrumb-link-item\">Home<\/a>\r\n            <span class=\"breadcrumb-separator-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><path fill=\"currentColor\" d=\"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\/><\/svg>\r\n            <\/span>\r\n            <a href=\"#\" class=\"breadcrumb-link-item\">Alumni Connect<\/a>\r\n            <span class=\"breadcrumb-separator-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><path fill=\"currentColor\" d=\"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\/><\/svg>\r\n            <\/span>\r\n            <span class=\"breadcrumb-current-page\">Alumni<\/span>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n    \/* Main Banner Container *\/\r\n    .modern-breadcrumb-banner {\r\n        position: relative;\r\n        width: 100%;\r\n        min-height: 260px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: left;\r\n        font-family: 'Segoe UI', -apple-system, sans-serif;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n        border-radius: 0px; \/* Sharp rectangular corners ke liye 0 kiya hai *\/\r\n        margin-bottom: 35px;\r\n        \r\n        \/* Background Configuration *\/\r\n        background-image: url('https:\/\/encrypted-tbn3.gstatic.com\/licensed-image?q=tbn:ANd9GcRRwqH0zF4ww6DItz0USRy-ZCdBFmtl7kU_YKUPanEQgC1LKySpyROVBnS_L4hMTjXuCwYHNmspIptg4_0'); \r\n        background-size: cover;\r\n        background-position: center;\r\n        background-repeat: no-repeat;\r\n    }\r\n\r\n    \/* Dark Overlay for Text Readability over Image *\/\r\n    .breadcrumb-overlay {\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        background: linear-gradient(90deg, rgba(5, 36, 17, 0.9) 0%, rgba(12, 74, 40, 0.6) 60%, rgba(0, 0, 0, 0.3) 100%);\r\n        z-index: 1;\r\n    }\r\n\r\n    \/* Inner Content Container *\/\r\n    .breadcrumb-content-wrapper {\r\n        position: relative;\r\n        z-index: 2;\r\n        padding: 40px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 12px;\r\n        width: 100%;\r\n    }\r\n\r\n    \/* Main Title Typography *\/\r\n    .breadcrumb-main-title {\r\n        font-size: 32px;\r\n        font-weight: 800;\r\n        color: #ffffff;\r\n        margin: 0;\r\n        letter-spacing: 0.5px;\r\n        text-shadow: 0 2px 4px rgba(0,0,0,0.2);\r\n    }\r\n\r\n    \/* Navigation Links Wrap *\/\r\n    .breadcrumb-navigation-links {\r\n        display: flex;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n        gap: 6px;\r\n    }\r\n\r\n    \/* Individual Link Item *\/\r\n    .breadcrumb-link-item {\r\n        font-size: 13.5px;\r\n        font-weight: 600;\r\n        color: #e2e8f0;\r\n        text-decoration: none;\r\n        transition: color 0.2s ease;\r\n    }\r\n    .breadcrumb-link-item:hover {\r\n        color: #eab308; \r\n    }\r\n\r\n    \/* Separator SVG Icon Style *\/\r\n    .breadcrumb-separator-icon {\r\n        display: flex;\r\n        align-items: center;\r\n        color: #94a3b8;\r\n    }\r\n    .breadcrumb-separator-icon svg {\r\n        width: 16px;\r\n        height: 16px;\r\n    }\r\n\r\n    \/* Active \/ Current Page State *\/\r\n    .breadcrumb-current-page {\r\n        font-size: 13.5px;\r\n        font-weight: 600;\r\n        color: #eab308; \r\n    }\r\n\r\n    \/* Responsive adjustments *\/\r\n    @media (max-width: 768px) {\r\n        .modern-breadcrumb-banner { min-height: 200px; }\r\n        .breadcrumb-content-wrapper { padding: 24px; }\r\n        .breadcrumb-main-title { font-size: 26px; }\r\n        .breadcrumb-link-item, .breadcrumb-current-page { font-size: 12.5px; }\r\n    }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-edb9ce9 e-con-full e-flex e-con e-parent\" data-id=\"edb9ce9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;ekit_has_onepagescroll_dot&quot;:&quot;yes&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-952107a elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"952107a\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;ekit_we_effect_on&quot;:&quot;none&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Alumni Portal<\/title>\r\n    <!-- Tailwind CSS for sleek styling -->\r\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n    <script>\r\n        tailwind.config = {\r\n            theme: {\r\n                extend: {\r\n                    colors: {\r\n                        brandGreen: {\r\n                            light: '#e8f5e9',\r\n                            DEFAULT: '#2e7d32',\r\n                            dark: '#1b5e20',\r\n                        },\r\n                        brandYellow: {\r\n                            light: '#fffde7',\r\n                            DEFAULT: '#fbc02d',\r\n                            dark: '#f57f17',\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n        }\r\n    <\/script>\r\n<\/head>\r\n<body class=\"bg-gray-50 font-sans min-h-screen flex flex-col\">\r\n\r\n    <!-- Header Section -->\r\n    <header class=\"bg-brandGreen text-white shadow-md border-b-4 border-brandYellow\">\r\n        <div class=\"max-w-7xl mx-auto px-4 py-6 flex flex-col sm:flex-row justify-between items-center gap-4\">\r\n            <div class=\"flex items-center space-x-3\">\r\n                <div class=\"bg-brandYellow text-brandGreen-dark p-2.5 rounded-full font-bold text-xl shadow-inner\">\r\n                    \ud83c\udf93\r\n                <\/div>\r\n                <div>\r\n                    <h1 class=\"text-2xl font-bold tracking-wide\">ALUMNI CONNECT<\/h1>\r\n                    <p class=\"text-xs text-brandYellow font-medium tracking-wider uppercase\">Stay Linked, Stay Inspired<\/p>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <!-- Navigation Tabs -->\r\n            <nav class=\"flex bg-brandGreen-dark rounded-lg p-1 border border-brandGreen-light\/20 shadow-inner\">\r\n                <button onclick=\"switchTab('directory-tab')\" id=\"btn-directory-tab\" class=\"tab-btn px-5 py-2.5 rounded-md font-semibold text-sm transition-all duration-200 bg-brandYellow text-brandGreen-dark shadow-md\">\r\n                    \ud83d\udd0d Directory\r\n                <\/button>\r\n                <button onclick=\"switchTab('register-tab')\" id=\"btn-register-tab\" class=\"tab-btn px-5 py-2.5 rounded-md font-semibold text-sm transition-all duration-200 text-gray-300 hover:text-white\">\r\n                    \ud83d\udcdd Register\r\n                <\/button>\r\n                <button onclick=\"switchTab('login-tab')\" id=\"btn-login-tab\" class=\"tab-btn px-5 py-2.5 rounded-md font-semibold text-sm transition-all duration-200 text-gray-300 hover:text-white\">\r\n                    \ud83d\udd11 Login\r\n                <\/button>\r\n            <\/nav>\r\n        <\/div>\r\n    <\/header>\r\n\r\n    <!-- Main Content Area -->\r\n    <main class=\"flex-grow max-w-7xl w-full mx-auto px-4 py-8\">\r\n        \r\n        <!-- ================= 1. REGISTRATION PAGE (Hidden by default) ================= -->\r\n        <section id=\"register-tab\" class=\"tab-content hidden max-w-2xl mx-auto bg-white rounded-xl shadow-xl border border-gray-100 overflow-hidden\">\r\n            <div class=\"bg-gradient-to-r align-middle from-brandGreen to-brandGreen-dark p-6 text-white\">\r\n                <h2 class=\"text-xl font-bold\">Join the Alumni Network<\/h2>\r\n                <p class=\"text-sm text-gray-200 mt-1\">Create your profile to connect with old peers and mentors.<\/p>\r\n            <\/div>\r\n            <form onsubmit=\"event.preventDefault();\" class=\"p-6 space-y-5\">\r\n                <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n                    <div>\r\n                        <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Full Name<\/label>\r\n                        <input type=\"text\" placeholder=\"John Doe\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Email Address<\/label>\r\n                        <input type=\"email\" placeholder=\"john@example.com\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\">\r\n                    <div>\r\n                        <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Passout Year<\/label>\r\n                        <select class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                            <option>2025<\/option>\r\n                            <option>2024<\/option>\r\n                            <option>2023<\/option>\r\n                            <option>2022<\/option>\r\n                            <option>2021<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Branch\/Stream<\/label>\r\n                        <select class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                            <option>Computer Science<\/option>\r\n                            <option>Information Technology<\/option>\r\n                            <option>Mechanical<\/option>\r\n                            <option>Civil<\/option>\r\n                            <option>Electrical<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Current Company<\/label>\r\n                        <input type=\"text\" placeholder=\"e.g., Google, TCS\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                    <\/div>\r\n                <\/div>\r\n                <div>\r\n                    <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Password<\/label>\r\n                    <input type=\"password\" placeholder=\"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                <\/div>\r\n                <button class=\"w-full bg-brandYellow hover:bg-brandYellow-dark text-brandGreen-dark font-bold py-3 px-4 rounded-lg shadow-md transition duration-200 mt-2\">\r\n                    Submit Registration\r\n                <\/button>\r\n            <\/form>\r\n        <\/section>\r\n\r\n        <!-- ================= 2. LOGIN PAGE (Hidden by default) ================= -->\r\n        <section id=\"login-tab\" class=\"tab-content hidden max-w-md mx-auto bg-white rounded-xl shadow-xl border border-gray-100 overflow-hidden\">\r\n            <div class=\"bg-gradient-to-r from-brandGreen to-brandGreen-dark p-6 text-white text-center\">\r\n                <h2 class=\"text-xl font-bold\">Welcome Back<\/h2>\r\n                <p class=\"text-sm text-gray-200 mt-1\">Log in to sync with your network.<\/p>\r\n            <\/div>\r\n            <form onsubmit=\"event.preventDefault();\" class=\"p-6 space-y-5\">\r\n                <div>\r\n                    <label class=\"block text-sm font-semibold text-gray-700 mb-1\">Registered Email<\/label>\r\n                    <input type=\"email\" placeholder=\"alex@example.com\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                <\/div>\r\n                <div>\r\n                    <div class=\"flex justify-between items-center mb-1\">\r\n                        <label class=\"text-sm font-semibold text-gray-700\">Password<\/label>\r\n                        <a href=\"#\" class=\"text-xs text-brandGreen font-medium hover:underline\">Forgot?<\/a>\r\n                    <\/div>\r\n                    <input type=\"password\" placeholder=\"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition\">\r\n                <\/div>\r\n                <button class=\"w-full bg-brandGreen hover:bg-brandGreen-dark text-white font-bold py-3 px-4 rounded-lg shadow-md transition duration-200\">\r\n                    Sign In\r\n                <\/button>\r\n            <\/form>\r\n        <\/section>\r\n\r\n        <!-- ================= 3. DIRECTORY WITH FILTERS & SEARCH (Active by default) ================= -->\r\n        <section id=\"directory-tab\" class=\"tab-content space-y-6\">\r\n            \r\n            <!-- Filters Card -->\r\n            <div class=\"bg-white p-6 rounded-xl shadow-md border border-gray-100\">\r\n                <h2 class=\"text-lg font-bold text-gray-800 mb-4 flex items-center gap-2\">\r\n                    <span class=\"text-brandGreen\">\u26a1<\/span> Search Filters\r\n                <\/h2>\r\n                <div class=\"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-4\">\r\n                    <!-- Search Bar -->\r\n                    <div class=\"relative\">\r\n                        <input type=\"text\" id=\"search-input\" onkeyup=\"filterDirectory()\" placeholder=\"Search by name or company...\" class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition text-sm\">\r\n                        <span class=\"absolute left-3 top-2.5 text-gray-400 text-sm\">\ud83d\udd0d<\/span>\r\n                    <\/div>\r\n                    <!-- Year Filter -->\r\n                    <div>\r\n                        <select id=\"filter-year\" onchange=\"filterDirectory()\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition text-sm bg-white\">\r\n                            <option value=\"\">All Passout Years<\/option>\r\n                            <option value=\"2024\">2024<\/option>\r\n                            <option value=\"2023\">2023<\/option>\r\n                            <option value=\"2022\">2022<\/option>\r\n                            <option value=\"2021\">2021<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                    <!-- Branch Filter -->\r\n                    <div>\r\n                        <select id=\"filter-branch\" onchange=\"filterDirectory()\" class=\"w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-brandGreen focus:border-brandGreen outline-none transition text-sm bg-white\">\r\n                            <option value=\"\">All Branches<\/option>\r\n                            <option value=\"Computer Science\">Computer Science<\/option>\r\n                            <option value=\"Information Technology\">Information Technology<\/option>\r\n                            <option value=\"Mechanical\">Mechanical<\/option>\r\n                            <option value=\"Electrical\">Electrical<\/option>\r\n                        <\/select>\r\n                    <\/div>\r\n                    <!-- Clear Button -->\r\n                    <button onclick=\"clearFilters()\" class=\"w-full bg-brandGreen-light hover:bg-brandGreen hover:text-white text-brandGreen font-semibold py-2 px-4 rounded-lg transition duration-200 text-sm\">\r\n                        Reset Filters\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Tabular Directory -->\r\n            <div class=\"bg-white rounded-xl shadow-lg border border-gray-100 overflow-hidden\">\r\n                <div class=\"overflow-x-auto\">\r\n                    <table class=\"w-full text-left border-collapse\">\r\n                        <thead>\r\n                            <tr class=\"bg-brandGreen text-white text-sm uppercase tracking-wider\">\r\n                                <th class=\"px-6 py-4 font-semibold\">Alumni Name<\/th>\r\n                                <th class=\"px-6 py-4 font-semibold\">Branch<\/th>\r\n                                <th class=\"px-6 py-4 font-semibold\">Passout Year<\/th>\r\n                                <th class=\"px-6 py-4 font-semibold\">Current Designation<\/th>\r\n                                <th class=\"px-6 py-4 font-semibold\">Location<\/th>\r\n                            <\/tr>\r\n                        <\/thead>\r\n                        <tbody id=\"directory-table-body\" class=\"divide-y divide-gray-100 text-sm text-gray-700\">\r\n                            <!-- Dummy Data Row 1 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Aarav Sharma<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Computer Science<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2024<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Software Engineer @ Microsoft<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Hyderabad<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 2 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Ananya Dash<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Information Technology<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2023<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Data Analyst @ Deloitte<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Bengaluru<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 3 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Rajesh Patel<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Mechanical<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2022<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Operations Manager @ Tata Motors<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Pune<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 4 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Sneha Mishra<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Computer Science<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2024<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Frontend Developer @ Tech Mahindra<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Bhubaneswar<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 5 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Vikram Sahu<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Electrical<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2021<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">System Engineer @ Infosys<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Chennai<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 6 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Pooja Meher<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Information Technology<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2023<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Cloud Consultant @ AWS<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Mumbai<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 7 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Amit Pradhan<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Mechanical<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2022<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Design Engineer @ L&T<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Delhi NCR<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 8 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Divya Naik<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Computer Science<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2021<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Product Manager @ Wipro<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Bengaluru<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 9 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Rahul Barik<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Electrical<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2024<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">Graduate Engineer @ NTPC<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Kolkata<\/td>\r\n                            <\/tr>\r\n                            <!-- Dummy Data Row 10 -->\r\n                            <tr class=\"hover:bg-brandYellow-light\/40 transition dynamic-row\">\r\n                                <td class=\"px-6 py-4 font-medium text-gray-900\">Swati Purohit<\/td>\r\n                                <td class=\"px-6 py-4 row-branch\">Information Technology<\/td>\r\n                                <td class=\"px-6 py-4 row-year\"><span class=\"bg-brandGreen-light text-brandGreen px-2 py-1 rounded font-semibold text-xs\">2022<\/span><\/td>\r\n                                <td class=\"px-6 py-4 font-medium text-gray-600\">UI\/UX Designer @ Cognizant<\/td>\r\n                                <td class=\"px-6 py-4 text-gray-500\">Hyderabad<\/td>\r\n                            <\/tr>\r\n                        <\/tbody>\r\n                    <\/table>\r\n                    \r\n                    <!-- Empty State Handling -->\r\n                    <div id=\"no-results\" class=\"hidden text-center py-12 text-gray-500 font-medium\">\r\n                         Nahi mila! Try adjusting your search query or filters.\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/section>\r\n    <\/main>\r\n\r\n\r\n    <!-- Interactive JavaScript -->\r\n    <script>\r\n        \/\/ Smooth Tab Switching Logic\r\n        function switchTab(tabId) {\r\n            \/\/ Hide all sections\r\n            document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden'));\r\n            \r\n            \/\/ Show current section\r\n            document.getElementById(tabId).classList.remove('hidden');\r\n\r\n            \/\/ Reset navigation button states\r\n            document.querySelectorAll('.tab-btn').forEach(btn => {\r\n                btn.classList.remove('bg-brandYellow', 'text-brandGreen-dark', 'shadow-md');\r\n                btn.classList.add('text-gray-300', 'hover:text-white');\r\n            });\r\n\r\n            \/\/ Highlight active navigation button\r\n            const activeBtn = document.getElementById(`btn-${tabId}`);\r\n            activeBtn.classList.add('bg-brandYellow', 'text-brandGreen-dark', 'shadow-md');\r\n            activeBtn.classList.remove('text-gray-300', 'hover:text-white');\r\n        }\r\n\r\n        \/\/ Live Table Filtering Logic\r\n        function filterDirectory() {\r\n            const searchVal = document.getElementById('search-input').value.toLowerCase();\r\n            const yearVal = document.getElementById('filter-year').value;\r\n            const branchVal = document.getElementById('filter-branch').value;\r\n            \r\n            const rows = document.querySelectorAll('.dynamic-row');\r\n            let visibleRowCount = 0;\r\n\r\n            rows.forEach(row => {\r\n                const textContext = row.textContent.toLowerCase();\r\n                const rowBranch = row.querySelector('.row-branch').textContent;\r\n                const rowYear = row.querySelector('.row-year').textContent;\r\n\r\n                const matchesSearch = textContext.includes(searchVal);\r\n                const matchesBranch = !branchVal || rowBranch === branchVal;\r\n                const matchesYear = !yearVal || rowYear.includes(yearVal);\r\n\r\n                if (matchesSearch && matchesBranch && matchesYear) {\r\n                    row.classList.remove('hidden');\r\n                    visibleRowCount++;\r\n                } else {\r\n                    row.classList.add('hidden');\r\n                }\r\n            });\r\n\r\n            \/\/ Toggle No Results View\r\n            const errorElement = document.getElementById('no-results');\r\n            if (visibleRowCount === 0) {\r\n                errorElement.classList.remove('hidden');\r\n            } else {\r\n                errorElement.classList.add('hidden');\r\n            }\r\n        }\r\n\r\n        \/\/ Clear All Filter Options\r\n        function clearFilters() {\r\n            document.getElementById('search-input').value = '';\r\n            document.getElementById('filter-year').value = '';\r\n            document.getElementById('filter-branch').value = '';\r\n            filterDirectory();\r\n        }\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Alumni Registration Portal Home Alumni Connect Alumni Alumni Portal \ud83c\udf93 ALUMNI CONNECT Stay Linked, Stay Inspired \ud83d\udd0d Directory \ud83d\udcdd Register \ud83d\udd11 Login Join the Alumni Network Create your profile to connect with old peers and mentors. Full Name Email Address Passout Year 20252024202320222021 Branch\/Stream Computer ScienceInformation TechnologyMechanicalCivilElectrical Current Company Password Submit Registration Welcome Back Log&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"default","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-3789","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/pages\/3789","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/comments?post=3789"}],"version-history":[{"count":19,"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/pages\/3789\/revisions"}],"predecessor-version":[{"id":3812,"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/pages\/3789\/revisions\/3812"}],"wp:attachment":[{"href":"https:\/\/dbcollege.in\/index.php\/wp-json\/wp\/v2\/media?parent=3789"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}