การสร้างแบบฟอร์มง่ายๆ ใน Bootstrap

ตอบกระทู้

รูปแสดงอารมณ์
:icon_plusone: :like: :plusone: :gfb: :-D :) :( :-o 8O :? 8) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: :angry: :baa: :biggrin:
รูปแสดงอารมณ์อื่นๆ

BBCode เปิด
[img] เปิด
[url] เปิด
[Smile icon] เปิด

กระทู้แนะนำ
   

มุมมองที่ขยายได้ กระทู้แนะนำ: การสร้างแบบฟอร์มง่ายๆ ใน Bootstrap

การสร้างแบบฟอร์มง่ายๆ ใน Bootstrap

โดย m038 » 30/07/2016 3:03 pm

การสร้างแบบฟอร์มง่ายๆ ใน #Bootstrap นั้นสามารถทำได้ดังนี้
  • - ประกาศหัวข้อแบบฟอร์มที่เราต้องการ

โค้ด: เลือกทั้งหมด

<h1><center>ตัวอย่างแบบฟอร์ม</center></h1>
  • - ประกาศแบบฟอร์ม

โค้ด: เลือกทั้งหมด

<form>ข้อมูลต่างๆ ที่ต้องใส่ภายในฟอร์ม</form>
  • - สร้างการกรอกข้อมูลที่เราต้องการ เช่นตัวอย่างนี้เป็นการให้กรอก Email

โค้ด: เลือกทั้งหมด

  <form class="form-inline">
    <div class="form-group">
      <label>Email :</label>
      <input type="email" class="form-control" id="email" placeholder="กรอก email ของท่าน">
    </div>
  </form>
* placeholder คือการแสดงข้อความในช่อง input
  • - สร้างการกรอกรหัสผ่านของ Email ที่ต้องการ

โค้ด: เลือกทั้งหมด

  <form class="form-inline">
    <div class="form-group">
      <label>Email :</label>
      <input type="email" class="form-control" id="email" placeholder="กรอก email ของท่าน">
    </div>
    <div class="form-group">
      <label for="pwd">Password:</label>
      <input type="password" class="form-control" id="pwd" placeholder="กรอก password ของท่าน">
    </div>
  </form>
  
  • - สร้างปุ่มเพื่อบันทึกข้อมูลแบบฟอร์ม

โค้ด: เลือกทั้งหมด

<center><button type="submit" class="btn btn-default">บันทึกข้อมูล</button></center>

ข้างบน