Create Account

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Create Account — iConf</title> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" /> <link href="/Public/MDB5/css/mdb.min.css" rel="stylesheet" /> <link href="/Public/MDB5/css/sign.css" rel="stylesheet" /> </head> <body> <header>  <nav class="navbar navbar-expand-lg navbar-dark px-3"> <div class="container-fluid"> <a class="navbar-brand nav-link" href="/index.php/Member/index.html"> <div class="brand-wrapper"> <div class="brand-main"> <span class="brand-i">i</span><span class="brand-conf">C<i class="fas fa-globe brand-globe"></i>nf</span> </div> <span class="brand-subtitle">Conference System</span> </div> </a> <button class="navbar-toggler" type="button" data-mdb-toggle="collapse" data-mdb-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <i class="fas fa-bars"></i> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav ms-auto mb-2 mb-lg-0"> <li class="nav-item"> <a class="nav-link" href="/index.php/Member/index.html">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="/index.php/Member/login.html">Login</a> </li> <li class="nav-item"> <a class="nav-link" href="/index.php/Member/register.html">Register</a> </li> </ul> </div> </div> </nav>  </header> <div class="container mt-3"> <div class="row justify-content-center"> <div class="col-xl-5 col-md-8"> <form id="signupForm" class="bg-white rounded shadow-5-strong p-5 needs-validation form-container" method="post" action="" novalidate> <input type="hidden" name="csrf_token" value=""> <div class="text-center mb-4"> <div class="mb-3"> <i class="fas fa-user-plus fa-3x text-primary"></i> </div> <h4 class="fw-bold">Create Account</h4> </div> <div class="card mb-3"> <div class="card-body"> <div class="mb-3"> <label class="form-label d-block mb-2">Title</label> <div class="btn-group w-100 mb-2" role="group"> <input type="radio" class="btn-check" name="title" id="t1" value="Prof." required checked /> <label class="btn btn-outline-primary" for="t1">Prof.</label> <input type="radio" class="btn-check" name="title" id="t2" value="Dr." required /> <label class="btn btn-outline-primary" for="t2">Dr.</label> <input type="radio" class="btn-check" name="title" id="t3" value="Mr." required /> <label class="btn btn-outline-primary" for="t3">Mr.</label> <input type="radio" class="btn-check" name="title" id="t4" value="Mrs." required /> <label class="btn btn-outline-primary" for="t4">Mrs.</label> <input type="radio" class="btn-check" name="title" id="t5" value="Ms." required /> <label class="btn btn-outline-primary" for="t5">Ms.</label> </div> <div class="row"> <div class="col-md-6"> <div class="form-outline" data-mdb-input-init> <input type="text" id="firstname" name="firstname" class="form-control" required /> <label class="form-label" for="firstname">First Name</label> <div class="invalid-feedback">Please enter your first name.</div> </div> </div> <div class="col-md-6"> <div class="form-outline" data-mdb-input-init> <input type="text" id="lastname" name="lastname" class="form-control" required /> <label class="form-label" for="lastname">Last Name</label> <div class="invalid-feedback">Please enter your last name.</div> </div> </div> </div> </div> </div> </div> <div class="card mb-3"> <div class="card-body"> <div class="form-outline mb-4" data-mdb-input-init> <input type="email" id="email" name="email" class="form-control" required /> <label class="form-label" for="email">Email Address</label> <div class="invalid-feedback">Please provide a valid email.</div> </div> <div class="form-outline mb-4" data-mdb-input-init> <input type="password" id="password" name="password" class="form-control" required minlength="6" maxlength="15" /> <label class="form-label" for="password">Password</label> <div class="invalid-feedback">Password must be 6-15 characters long.</div> </div> <div class="form-outline mb-4" data-mdb-input-init> <input type="password" id="repassword" name="repassword" class="form-control" required /> <label class="form-label" for="repassword">Repeat Password</label> <div class="invalid-feedback">Passwords must match.</div> </div> </div> </div> <div class="card mb-4"> <div class="card-body"> <div class="d-flex align-items-center gap-3"> <div class="form-outline flex-grow-1" data-mdb-input-init> <input type="text" id="verificationCode" name="codes" class="form-control" required minlength="4" /> <label class="form-label" for="verificationCode">Verification Code</label> <div class="invalid-feedback">Code must be at least 4 characters.</div> </div> <div class="flex-shrink-0"> <img src="/index.php/Home/Member/codes" width="120" height="42" id="codespic" style="cursor: pointer;" onclick="this.src='/index.php/Home/Member/codes?' + Math.random();" class="rounded" /> </div> </div> <div class="invalid-feedback" id="verificationError"></div> </div> </div> <button type="submit" class="btn btn-primary btn-block mb-3 btn-lg"> <i class="fas fa-user-check me-2"></i>Sign Up </button> <div class="text-center"> <p class="mb-0">Already have an account? <a href="/index.php/Member/login.html" class="link-primary">Login here</a></p> </div> <input type="hidden" name="go" value="http://confsys.iconf.org/submission/icmfm2025"> </form> </div> </div> </div> <div class="copyright-section text-center my-3"> © 2025 Copyright: iConf system</span></a> </div> <script type="text/javascript" src="/Public/MDB5/js/jquery-3.7.1.min.js"></script> <script type="text/javascript" src="/Public/MDB5/js/mdb.umd.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script> $(document).ready(function() { // 获取DOM元素 const codespic = $('#codespic'); const signupForm = $('#signupForm'); // 验证码点击刷新 codespic.on('click', function() { $(this).attr('src', `/index.php/Home/Member/codes?${new Date().getTime()}`); }); // 密码验证规则 const validatePassword = () => { const password = $('#password').val(); const repassword = $('#repassword').val(); if (password !== repassword) { $('#repassword')[0].setCustomValidity('Passwords do not match.'); return false; } $('#repassword')[0].setCustomValidity(''); return true; }; // 表单提交处理 signupForm.on('submit', function(event) { event.preventDefault(); if (!validatePassword()) { return; } const form = $(this); if (!form[0].checkValidity()) { event.stopPropagation(); form.addClass('was-validated'); return; } $.ajax({ url: form.attr('action'), type: 'POST', data: form.serialize(), dataType: 'json', success: function(response) { if (response.status === 1) { Swal.fire({ icon: 'success', title: 'Success!', text: response.info, showConfirmButton: false, timer: 2000 }).then(() => { window.location.href = response.url; }); } else { Swal.fire({ icon: 'error', title: 'Error', text: response.info }); // 刷新验证码 codespic.click(); } }, error: function(xhr, status, error) { Swal.fire({ icon: 'error', title: 'Server Error', text: 'An error occurred. Please try again later.' }); console.error('Ajax error:', status, error); } }); form.addClass('was-validated'); }); // 实时密码验证 $('#repassword').on('input', validatePassword); }); </script> </body> </html> }); </script> </html>

CINXE.COM

Create Account — iConf