ออกแบบจาก Bootstrap v5 รองรับทั้งหน้าจอ PC & Mobile สำหรับเอาไปศึกษาและต่อยอดครับ
class หลักๆ ที่ใช้
- class col (grid)
- class form + คุณสมบัติแบบง่ายๆ
- class btn
ผลลัพธ์การทำงาน *ยังทำไม่เสร็จนะครับ แต่แจกก่อนครับ ให้เอาไปต่อยอดได้เต็มที่ ^^
ระบบบันทึกเวลาเข้า-ออกงาน และบันทึกข้อมูลการทำงาน *สนับสนุน 1000 บาท รายละเอียดใต้คลิป
ระบบแจ้งซ่อม รายละเอียดใต้คลิป
Full Code
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 |
<!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Bootstrap CSS --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"> <title> ลงทะเบียนผู้ป่วยใหม่ ออกแบบโดย www.devbanban.com</title> </head> <body style="background-color: #f8fac5;"> <div class="container"> <div class="row"> <div class="col col-sm-12"> <h1 class="text-center" style="margin-top: 50px;"> แบบฟอร์มลงทะเบียนผู้ป่วยใหม่ รพ. .....</h1> <center>*โปรดกรอกข้อความให้ครบถ้วนชัดเจน</center> <center> by devbanban.com </center> </div> </div> </div> <div class="container" style="margin-top: 50px;"> <div class="row"> <div class="col col-sm-12"> <form action="https://devbanban.com/?p=2867" method="post"> <div class="row mb-3"> <div class="col-sm-5"> เลขประจำตัวบัตรประชาชน <input type="text" class="form-control" name="peopleID" placeholder="เลขประจำตัวบัตรประชาชน 13 หลัก" required minlength="13" maxlength="13"> </div> <div class="col-sm-7"> สิทธิการรักษาพยาบาล <br> <input class="form-check-input" type="radio" name="paytype" value="1"> ชำระเงินเอง <input class="form-check-input" type="radio" name="paytype" value="2"> ประกันสุขภาพถ้วนหน้า <br> <input class="form-check-input" type="radio" name="paytype" value="3"> ข้าราชการ <input class="form-check-input" type="radio" name="paytype" value="4"> ประกันสังคม <input class="form-check-input" type="radio" name="paytype" value="อื่นๆ"> อื่นๆ <input type="text" name="paytypeOther"> </div> </div> <div class="row mb-3"> <div class="col-sm-10"> คำนำหน้าชื่อ <input class="form-check-input" type="radio" name="titlename" value="นาย"> นาย <input class="form-check-input" type="radio" name="titlename" value="นาง"> นาง <input class="form-check-input" type="radio" name="titlename" value="นางสาว"> นางสาว <input class="form-check-input" type="radio" name="titlename" value="ด.ช."> ด.ช. <input class="form-check-input" type="radio" name="titlename" value="ด.ญ."> ด.ญ. <input class="form-check-input" type="radio" name="titlename" value="อื่นๆ"> อื่นๆ <input type="text" name="titlenameOther"> </div> </div> <div class="row mb-3"> <div class="col-sm-10"> เพศ <input class="form-check-input" type="radio" name="sex" value="ชาย"> ชาย <input class="form-check-input" type="radio" name="sex" value="หญิง"> หญิง <input class="form-check-input" type="radio" name="sex" value="อื่นๆ"> อื่นๆ <input type="text" name="sexOther"> </div> </div> <div class="row mb-3"> <label class="col-sm-1 col-form-label">ชื่อ</label> <div class="col-sm-3"> <input type="text" name="firstnameTH" class="form-control" required placeholder="ชื่อ(ภาษาไทย)"> </div> <label class="col-sm-1 col-form-label">สกุล</label> <div class="col-sm-4"> <input type="text" name="lastnameTH" class="form-control" required placeholder="สกุล(ภาษาไทย)"> </div> </div> <div class="row mb-3"> <label class="col-sm-1 col-form-label">Name</label> <div class="col-sm-3"> <input type="text" name="firstnameEN" class="form-control" required placeholder="ชื่อ(ภาษาอังกฤษ)"> </div> <label class="col-sm-1 col-form-label">Surname</label> <div class="col-sm-4"> <input type="text" name="lastnameEN" class="form-control" required placeholder="สกุล(ภาษาอังกฤษ)"> </div> </div> <div class="row mb-3"> ว/ด/ป เกิด <div class="col-sm-1"> <select name="dateBirth" class="form-control" required> <option value="">วัน</option> <option value="1">1</option> <option value="30">30</option> <option value="31">31</option> </select> </div> <div class="col-sm-2"> <select name="monthBirth" class="form-control" required> <option value="">เดือน</option> <option value="01">มกราคม</option> <option value="12">ธันวาคม</option> </select> </div> <div class="col-sm-1"> <select name="yearBirth" class="form-control" required> <option value="">ปี</option> <option value="2500">2500</option> <option value="2564">2564</option> </select> </div> <label class="col-sm-1 col-form-label"> จ. ที่เกิด</label> <div class="col-sm-2"> <input type="text" required name="provinceBirth" class="form-control" placeholder="จังหวัดที่เกิด"> </div> <label class="col-sm-1 col-form-label">ประเทศ</label> <div class="col-sm-2"> <input type="text" required name="contryBirth" class="form-control" placeholder="ประเทศที่เกิด"> </div> </div> <div class="row mb-3"> <div class="col-sm-7"> ประวัติการแพ้ยา <br> <input class="form-check-input" type="radio" name="allergicType" value="1"> ไม่เคยแพ้ <input class="form-check-input" type="radio" name="allergicType" value="2"> ไม่ทราบ <input class="form-check-input" type="radio" name="allergicType" value="3"> เคยแพ้ยา โปรดระบุ <input type="text" name="allergicTypeOther"> </div> </div> <div class="row mb-3"> <div class="col-sm-3"> หมู่เลือด <br> <input class="form-check-input" type="radio" name="blood" value="A"> เอ <br> <input class="form-check-input" type="radio" name="blood" value="B"> บี <br> <input class="form-check-input" type="radio" name="blood" value="AB"> เอบี <br> <input class="form-check-input" type="radio" name="blood" value="O"> โอ <br> </div> <div class="col-sm-3"> เชื้อชาติ <br> <input class="form-check-input" type="radio" name="race" value="ไทย"> ไทย <br> <input class="form-check-input" type="radio" name="race" value="จีน"> จีน <br> <input class="form-check-input" type="radio" name="race" value="อินเดีย"> อินเดีย <br> <input class="form-check-input" type="radio" name="race" value="อื่นๆ"> อื่นๆ โปรดระบุ <input type="text" name="raceTypeOther"> </div> <div class="col-sm-3"> สัญชาติ <br> <input class="form-check-input" type="radio" name="nationality" value="ไทย"> ไทย <br> <input class="form-check-input" type="radio" name="nationality" value="จีน"> จีน <br> <input class="form-check-input" type="radio" name="nationality" value="อินเดีย"> อินเดีย <br> <input class="form-check-input" type="radio" name="nationality" value="อื่นๆ"> อื่นๆ โปรดระบุ <input type="text" name="nationalityOther"> </div> <div class="col-sm-3"> ศาสนา <br> <input class="form-check-input" type="radio" name="religion" value="พุทธ"> พุทธ <br> <input class="form-check-input" type="radio" name="religion" value="คริสต์"> คริสต์ <br> <input class="form-check-input" type="radio" name="religion" value="อิสลาม"> อิสลาม <br> <input class="form-check-input" type="radio" name="religion" value="อื่นๆ"> อื่นๆ โปรดระบุ <input type="text" name="religionOther"> </div> </div> <hr> <pre> *ขาด -สถานภาพ -อาชีพ -ชื่อพ่อ/แม่ -ที่อยู่ -ข้อมูลการติดต่อ -อีเมล รหัสผ่าน </pre> <center><button type="submit" class="btn btn-primary">ลงทะเบียน</button></center> </form> <br><br><br> </div> </div> </div> <!-- Option 1: Bootstrap Bundle with Popper --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script> </body> </html> |
ร่วมสนับสนุน ค่ากาแฟ ค่าโฮส devbanban.com และทีมงานได้ที่
ธนาคารกรุงไทย สาขาเดอะมอลล์ท่าพระ
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 878-0-17747-6
————————————————————————————
ธนาคารไทยพาณิชย์ สาขามหาวิทยาลัยราชภัฏธนบุรี
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 406-359094-1
fanpage : https://www.facebook.com/sornwebsites/