ແບບຟອມທີ່ສ້າງຂຶ້ນໃນເວັບໄຊແມ່ນເພື່ອໃຊ້ສຳລັບການຮັບ-ສົ່ງຂໍ້ມູນຈາກລະຫວ່າງຜູ້ໃຊ້ ແລະເຈົ້າຂອງເວັບໄຊ
ແບບຟອມຕ່າງໆທີ່ພົບເຫັນໃນເວັບໄຊ ເຊັ່ນ ແບບສອບຖາມ,ໃບສັ່ງຊື້,ການລົງຖະບຽນເປັນສະມາຊິກ,
ສະໝຸດຢ້ຽມຢາມ,ສະແດງຄວາມຄິດເຫັນ ເປັນຕົ້ນ.
ເປັນຮູບແບບທີ່ມີລັກສະນະເປັນຂໍ້ຄວາມ ມີຮູບແບບການຂຽນດັ່ງນີ້:
ຕົວຢ່າງ:
<form>
username:<input type="text" name="user" size="25" maxlength="12">
</form>
ແບບຟອມຕ່າງໆທີ່ພົບເຫັນໃນເວັບໄຊ ເຊັ່ນ ແບບສອບຖາມ,ໃບສັ່ງຊື້,ການລົງຖະບຽນເປັນສະມາຊິກ,
ສະໝຸດຢ້ຽມຢາມ,ສະແດງຄວາມຄິດເຫັນ ເປັນຕົ້ນ.
ໂດຍປົກກະຕິແລ້ວ
ການບັນທຶກຂໍ້ມູນຈາກແບບຟອມຈະໃຊ້ໂປຣແກຣມປະເພດ Server Script
ເຊັ່ນ APS,PHP, ອື່ນໆ.
ເຊັ່ນ APS,PHP, ອື່ນໆ.
Tag ຄຳສັ່ງໃນການສ້າງ
form ມີດັ່ງນີ້:
<form name= “ຊື່ແບບຟອມ”
method= “post/get” action= “URL” target= “ການສະແດງ”>
ຊ່ອງຮັບຂໍ້ມູນປະເພດຕ່າງໆ... ......
</form>
|
ເຊິ່ງພາຍໃນ form ຈະມີອົງປະກອບທີ່ເປັນຊ່ອງຮັບຂໍ້ມູນຢູ່
3 ປະເພດ ຄື:
12. ຊ່ອງຮັບຂໍ້ມູນປະເພດ Input.
ເປັນຮູບແບບທີ່ມີໄວ້ສຳລັບກຳນົດຮູບແບບຂອງຊະນິດຂໍ້ມູນທີ່ຈະນຳເຂົ້າໄປໃນແບບຟອມ ເຊິ່ງມີຮູບແບບການນຳໃຊ້
6 ຮູບແບບ ຄືດັ່ງຕໍ່ໄປນີ້:
12.1 ຊ່ອງຮັບຂໍ້ມູນແບບ text.ເປັນຮູບແບບທີ່ມີລັກສະນະເປັນຂໍ້ຄວາມ ມີຮູບແບບການຂຽນດັ່ງນີ້:
<form>ຂໍ້ມູນທີ່ຕ້ອງການສະແດງຜົນ
<input name="ຊື່ຊ່ອງຮັບຂໍ້ມູນ" type="ຮູບແບບຊ່ອງຮັບຂໍ້ມູນ" size="ຄວາມຍາວຂອງຊ່ອງຮັບຂໍ້ມູນ"
<input name="ຊື່ຊ່ອງຮັບຂໍ້ມູນ" type="ຮູບແບບຊ່ອງຮັບຂໍ້ມູນ" size="ຄວາມຍາວຂອງຊ່ອງຮັບຂໍ້ມູນ"
maxlength="ຈຳນວນຕົວອັກສອນ" value="ຊື່ຫຍໍ້ຂອງຂໍ້ມູນ">
</form>ຕົວຢ່າງ:
<form>
username:<input type="text" name="user" size="25" maxlength="12">
</form>
ຜົນໄດ້ຮັບ
12.2 ຊ່ອງຮັບຂໍ້ມູນແບບ password.
ເປັນການຮັບຂໍ້ມູນຄ້າຍຄືກັບ text ແຕ່ຈະສະແດງຂໍ້ຄວາມເປັນລະຫັດແທນຕົວອັກສອນ ເຊິ່ງມີຮູບແບບການຂຽນດັ່ງນີ້:
ຕົວຢ່າງ:
<form>
password:<input type="password" name="pwd" size="24" maxlength="12">
</form>
ຜົນໄດ້ຮັບ
12.3 ຊ່ອງຮັບຂໍ້ມູນແບບ checkbox.
ເປັນຂໍ້ມູນທີ່ມີລັກສະນະເປັນຕົວເລືອກ ຈະສະແດງຜົນເປັນບັອກສີ່ຫຼ່ຽມ ແລະສາມາດເລືອກໄດ້ຫຼາຍຕົວເລືອກດ້ວຍການ
ໃຊ້ເມົ້າຄລິກໃສ່ລາຍການທີ່ຕ້ອງການ ເຊິ່ງມີຮູບແບບການຂຽນດັ່ງນີ້:
<form>
<input type="checkbox" name="ຊື່ຂອງຂໍ້ມູນທີ1" value="ຄ່າຂໍ້ມູນທີ1ທີ່ຈະສົ່ງໄປ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
<input type="checkbox" name="ຊື່ຂອງຂໍ້ມູນທີ2" value="ຄ່າຂໍ້ມູນທີ2ທີ່ຈະສົ່ງໄປ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
</form>
ຕົວຢ່າງ:
<form>ລະດັບການສຶກສາ:
<input type="checkbox" name="tech" value="technical">ວິຊາຊີບຊັ້ນກາງ
<input type="checkbox" name="high" value="higher">ວິຊາຊີບຊັ້ນສູງ
</form>
ຜົນໄດ້ຮັບ
12.4 ຊ່ອງຮັບຂໍ້ມູນແບບ radio.
ຂໍ້ມູນທີ່ມີລັກສະນະເປັນຕົວເລືອກ ໂດຍຈະສະແດງເປັນຮູບວົງມົນນ້ອຍໆ ເພື່ອໃຫ້ເລືອກແລະສາມາດເລືອກໄດ້ພຽງ
ຕົວເລືອກດຽວ ສັງເກດຮູບແບບການຂຽນດັ່ງລຸ່ມນີ້:
<form>
<input type="radio" name="ຊື່ຂໍ້ມູນ1" value="ຄ່າຂອງຂໍ້ມູນທີ່ຈະສົ່ງ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
<input type="radio" name="ຊື່ຂໍ້ມູນ2" value="ຄ່າຂອງຂໍ້ມູນທີ່ຈະສົ່ງ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
</form>
ຕົວຢ່າງ:
<form>ເລືອກເພດ:
<input type="radio" name="f" value="female">ແມ່ຍິງ
<input type="radio" name="m" value="male">ຜູ້ຊາຍ
</form>
ຜົນໄດ້ຮັບ
12.5 ຊ່ອງຮັບຂໍ້ມູນແບບ submit ແລະ reset.
ແມ່ນຊ່ອງຮັບຂໍ້ມູນທີ່ເປັນປຸ່ມ ໃຊ້ໄວ້ສຳລັບກົດເພື່ອສົ່ງຂໍ້ມູນ(submit)ໄປຍັງ ເຊີບເວີ ແລະເປັນປຸ່ມເພື່ອລຶບຂໍ້ມູນ
ທັງໝົດທີ່ປ້ອນໄວ້ໃນແບບຟອມ(reset) ໂດຍມີຮູບແບບການຂຽນດັ່ງລຸ່ມນີ້:
<form>
<input type="submit" value="ຄ່າຂອງຂໍ້ມູນທີ່ປະກົດເທິງປຸ່ມ">
<input type="reset" value="ຄ່າຂອງຂໍ້ມູນທີ່ປະກົດເທິງປຸ່ມ">
</form>
ຕົວຢ່າງ:
<form>
username:<input type="text" name="user" size="25" maxlength="12"> <br>
password:<input type="password" name="pwd" size="24" maxlength="12"><br>
<input type="submit" value="ສົ່ງຂໍ້ມູນ">
<input type="reset" value="ຍົກເລີກ">
</form>
ຜົນໄດ້ຮັບ
12.2 ຊ່ອງຮັບຂໍ້ມູນແບບ password.
ເປັນການຮັບຂໍ້ມູນຄ້າຍຄືກັບ text ແຕ່ຈະສະແດງຂໍ້ຄວາມເປັນລະຫັດແທນຕົວອັກສອນ ເຊິ່ງມີຮູບແບບການຂຽນດັ່ງນີ້:
ຕົວຢ່າງ:
<form>
password:<input type="password" name="pwd" size="24" maxlength="12">
</form>
ຜົນໄດ້ຮັບ
12.3 ຊ່ອງຮັບຂໍ້ມູນແບບ checkbox.
ເປັນຂໍ້ມູນທີ່ມີລັກສະນະເປັນຕົວເລືອກ ຈະສະແດງຜົນເປັນບັອກສີ່ຫຼ່ຽມ ແລະສາມາດເລືອກໄດ້ຫຼາຍຕົວເລືອກດ້ວຍການ
ໃຊ້ເມົ້າຄລິກໃສ່ລາຍການທີ່ຕ້ອງການ ເຊິ່ງມີຮູບແບບການຂຽນດັ່ງນີ້:
<form>
<input type="checkbox" name="ຊື່ຂອງຂໍ້ມູນທີ1" value="ຄ່າຂໍ້ມູນທີ1ທີ່ຈະສົ່ງໄປ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
<input type="checkbox" name="ຊື່ຂອງຂໍ້ມູນທີ2" value="ຄ່າຂໍ້ມູນທີ2ທີ່ຈະສົ່ງໄປ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
</form>
ຕົວຢ່າງ:
<form>ລະດັບການສຶກສາ:
<input type="checkbox" name="tech" value="technical">ວິຊາຊີບຊັ້ນກາງ
<input type="checkbox" name="high" value="higher">ວິຊາຊີບຊັ້ນສູງ
</form>
ຜົນໄດ້ຮັບ
12.4 ຊ່ອງຮັບຂໍ້ມູນແບບ radio.
ຂໍ້ມູນທີ່ມີລັກສະນະເປັນຕົວເລືອກ ໂດຍຈະສະແດງເປັນຮູບວົງມົນນ້ອຍໆ ເພື່ອໃຫ້ເລືອກແລະສາມາດເລືອກໄດ້ພຽງ
ຕົວເລືອກດຽວ ສັງເກດຮູບແບບການຂຽນດັ່ງລຸ່ມນີ້:
<form>
<input type="radio" name="ຊື່ຂໍ້ມູນ1" value="ຄ່າຂອງຂໍ້ມູນທີ່ຈະສົ່ງ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
<input type="radio" name="ຊື່ຂໍ້ມູນ2" value="ຄ່າຂອງຂໍ້ມູນທີ່ຈະສົ່ງ">ຂໍ້ມູນທີ່ຕ້ອງການສະແດງ
</form>
ຕົວຢ່າງ:
<form>ເລືອກເພດ:
<input type="radio" name="f" value="female">ແມ່ຍິງ
<input type="radio" name="m" value="male">ຜູ້ຊາຍ
</form>
ຜົນໄດ້ຮັບ
12.5 ຊ່ອງຮັບຂໍ້ມູນແບບ submit ແລະ reset.
ແມ່ນຊ່ອງຮັບຂໍ້ມູນທີ່ເປັນປຸ່ມ ໃຊ້ໄວ້ສຳລັບກົດເພື່ອສົ່ງຂໍ້ມູນ(submit)ໄປຍັງ ເຊີບເວີ ແລະເປັນປຸ່ມເພື່ອລຶບຂໍ້ມູນ
ທັງໝົດທີ່ປ້ອນໄວ້ໃນແບບຟອມ(reset) ໂດຍມີຮູບແບບການຂຽນດັ່ງລຸ່ມນີ້:
<form>
<input type="submit" value="ຄ່າຂອງຂໍ້ມູນທີ່ປະກົດເທິງປຸ່ມ">
<input type="reset" value="ຄ່າຂອງຂໍ້ມູນທີ່ປະກົດເທິງປຸ່ມ">
</form>
ຕົວຢ່າງ:
<form>
username:<input type="text" name="user" size="25" maxlength="12"> <br>
password:<input type="password" name="pwd" size="24" maxlength="12"><br>
<input type="submit" value="ສົ່ງຂໍ້ມູນ">
<input type="reset" value="ຍົກເລີກ">
</form>
ຜົນໄດ້ຮັບ