การสร้างแบบฟอร์ม


การสร้างแบบฟอร์ม Form
การสร้างแบบฟอร์ม สมัครสมาชิก แบบสอบถาม แบบสั่งซื้อสินค้าทางอินเตอร์เน็ตหลายๆอย่าง มีวิธีการสร้างดังนี้
ตัวอย่าง 

       สมัครสมาชิก   
                          ชื่อ : 
                  นามสกุล : 
                         เพศ :  ชาย  หญิง       
       
           วัน/เดือน/ปีเกิด :        อายุ :                     

                 ถนน/ซอย :                     

                 บ้านเลขที่ :                          

                      ตำบล :                         

                     อำเภอ :                        

                     จังหวัด : 

                  โทรศัพท์ : 
                        
                       อีเมล์ :  



 

 

การสร้างแบบฟอร์มจะต้องขึ้นด้วย<form>และแท็กปิดคือ</form>อยู่ภายใต้ของ<html>อีกครั้ง
     ตัวอย่าง
         <html>
             <body>
                <form>.............. 
                            ..............
                </form>
             </body>
         </html>

         input หมายถึง การกลอกข้อมูลลงไปในฟอร์ม จะต้องมีทุกฟอร์ม
         name="ใส่ชื่อ" คือ ชื่อแบบฟอร์มของเรา
         type="ประเภท" เป็นตัวกำกับประเภทต่างๆ
         size="เลข" คือ ใส่ตัวเลขเพื่อกำหนดขนาดความยาวของช่องกลอกข้อความ
         maxlength="เลข" คือ ใส่ตัวเลขเพื่อกำหนดภายในช่องกลอกข้อความว่าจะให้มีอักษรกี่ตัว
         value="เลข,ข้อความ" คือเลขหรือข้อความที่กำหนดค่า
         type="มี 7 ชนิด" คือ 
          
1.<type="text"> ประเภทตัวเลขหรือตัวหนังสือ ไว้กลอกข้อมูล เช่น

<form>
         <input name="v" type="text">ชื่อ  
</form>
                               ชื่อ 







   
2.<type="password"> คือ เป็นระหัสผ่าน ตัวเลขหรือหนังสือก็ได้ เช่น

<form>
      <input name="v" type="password">ระหัสผ่าน  
</form>
                               ระหัสผ่าน


    






3.<type="checkbox"> คือ รูปสี่เหลี่ยมเล็กๆไว้สำหรับติกเครื่องหมายถูกลงในรูปสี่เหลี่ยมนี้ เช่น

<form>
        <input name="v" type="checkbox">ไทย
                <input name="v" type="checkbox">ลาว          
</form>
                              ไทย
                              ลาว             

4.<type="radio"> คือ วงกลมเล็กๆเมื่อคลิกแล้วจะมีจุดสีดำอยู่ข้างใน เช่น


<form>
        <input name="v" type="radio">ชาย
               <input name="v" type="radio">หญิง
               <input name="v" type="radio">กระเทย   
</form>
                ชาย
                            หญิง
                            กระเทย

5.<type="reset"> คือ ปุ่มเมื่อคลิกแล้วข้อความที่กลอกไว้จะหายหมด เช่น

<form>
      <input name="v" type="text">ชื่อ
              <input name="v" type="reset" value="ล้างข้อมูล">
</form>
                                ชื่อ   

6.<type="submit"> คือ ปุ่มตกลง,ยอมรับหรือยืนยันนั่นเอง เช่น

<form>
      <input name="v" type="submit" value="ตกลง">  
</form>
                                 

7.<type="file"> เป็นการโหลดไฟล์จากเครื่องขึ้นมาไว้ตามที่กำหนด และจะต้องใช้ประโยคนี้ ENCTYPE="MULTIPART/FORM-DATA เช่น

<form name="v" enctype="multipart/form-data">  
       <input name="v" type="file">
</form>
                                

การสร้างตัวเลือกด้วย select
                  <select> คือตัวให้เลือกลงมาหลายข้อ 
                  <option value="ลำดับแทนชื่อของตัวเลือก">

<form>
        <select>
                <option value="1">ก                 
                <option value="2">ข
                <option value="1">ค
                <option value="2">ง
        </select>
</form>
                                 


การกำหนดขนาดช่องกลอกข้อมูลด้วย <textarea>
               text คือ ข้อความ
               area คือ พื้นที่ เอามารวมกัน คือ textarea แปลว่า พื้นที่ของข้อความ 
               rows คือ ความสูงของช่อง
               cols คือ คือความยาวของช่อง 
                                              ตัวอย่าง
 <form>
       <textarea rows="10" cols="50">
       </textarea>
</form>
                           
                                            


    
สมัครสมาชิก: บทความ (Atom)