ผลต่างระหว่างรุ่นของ "ฟอร์มในระบบคูนิฟ็อกซ์"

จาก คูนิฟ็อกซ์ วิกิ
 
(ไม่แสดง 20 รุ่นระหว่างกลางโดยผู้ใช้คนเดียวกัน)
บรรทัดที่ 16: บรรทัดที่ 16:


=== ช่องกรอกข้อความ ===
=== ช่องกรอกข้อความ ===
ช่องกรอกข้อความใช้กรอกข้อมูลประเภทตัวเลขและตัวอักษร รองรับฟงัก์ชันเชิงข้อความทั่วไปของคอมพิวเตอร์ เช่นการตัด (cut: {{key press|Ctrl|X}}), คัดลอก/วาง (copy/paste: {{key press|Ctrl|C}} / {{key press|Ctrl|V}}), เลิกทำ (undo: {{key press|Ctrl|Z}}), เลือกทั้งหมด (select all: {{key press|Ctrl|A}}), ฯลฯ
ช่องกรอกข้อความ (ตัวอย่างเช่น หมายเลข 1, 2, และ 6 [[#img001|ตามภาพ]]) ใช้กรอกข้อมูลประเภทตัวเลขและตัวอักษร รองรับฟังก์ชันเชิงข้อความทั่วไปของคอมพิวเตอร์ เช่นการตัด (cut: {{key press|Ctrl|X}}), คัดลอก/วาง (copy/paste: {{key press|Ctrl|C}} / {{key press|Ctrl|V}}), เลิกทำ (undo: {{key press|Ctrl|Z}}), เลือกทั้งหมด (select all: {{key press|Ctrl|A}}), ฯลฯ


เพื่ออำนวยความสะดวกและควบคุมข้อมูลต่างๆ ช่องข้อความบางช่องอาจมีฟีเจอร์เพิ่มเติมเช่น:
เพื่ออำนวยความสะดวกและควบคุมข้อมูลต่างๆ ช่องข้อความบางช่องอาจมีฟีเจอร์เพิ่มเติมเช่น:
บรรทัดที่ 65: บรรทัดที่ 65:
       <li>หากใส่เครื่องหมายเปอร์เซ็นต์ที่จำนวนแรก: ระบบจะนำจำนวนนั้นหาร 100 ให้โดยอัตโนมัติ</li>
       <li>หากใส่เครื่องหมายเปอร์เซ็นต์ที่จำนวนแรก: ระบบจะนำจำนวนนั้นหาร 100 ให้โดยอัตโนมัติ</li>
       <li><p>การ'''บวก/ลบ'''ด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: ใช้จำนวนแรกเป็นฐานการคำนวณ เช่น</p>
       <li><p>การ'''บวก/ลบ'''ด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: ใช้จำนวนแรกเป็นฐานการคำนวณ เช่น</p>
           <p style="text-align:center;"><math>x + y% = x + \left ( x \times \frac{y}{100} \right )</math></p>
           <p style="text-align:center;"><math>\begin{align}x + y\% & = x + \left ( x \times \frac{y}{100} \right ) \\ x - y\% & = x - \left ( x \times \frac{y}{100} \right ) \end{align}</math></p>
          <p style="text-align:center;"><math>x - y% = x - \left ( x \times \frac{y}{100} \right )</math></p>
       </li>
       </li>
       <li><p>การ'''คูณ/หาร'''ด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: หารจำนวนที่สองด้วย 100 ก่อนแล้วจึงคำนวณ เช่น</p>
       <li><p>การ'''คูณ/หาร'''ด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: หารจำนวนที่สองด้วย 100 ก่อนแล้วจึงคำนวณ เช่น</p>
           <p style="text-align:center;"><math>x \times y% = x \times \frac{y}{100}</math></p>
           <p style="text-align:center;"><math>\begin{align} x \times y\% & = x \times \frac{y}{100} \\ x \div y\% & = x \div \frac{y}{100} = \frac{100 \times x}{y} \end{align}</math></p>
          <p style="text-align:center;"><math>x \div y% = x \div \frac{y}{100} = \frac{100 \times x}{y}</math></p>
       </li>
       </li>
     </ul>
     </ul>
บรรทัดที่ 79: บรรทัดที่ 77:


==== ช่องกรอกข้อความหลายบรรทัด ====
==== ช่องกรอกข้อความหลายบรรทัด ====
* '''ช่องกรอกข้อความหลายบรรทัด''' ([[#img001|หมายเลข 2]]): ใช้ปุ่ม {{key press|Ctrl|Enter}} เพื่อขึ้นบรรทัดใหม่ ช่องข้อมูลประเภทนี้สามารถยืดหดในแนวตั้งได้ โดยผู้ใช้คลิกค้างบริเวณสามเหลี่ยมที่มุมขวาล่างของช่องกล่องข้อความค้างไว้ แล้วขยับเมาส์
ช่องกรอกข้อความหลายบรรทัด ([[#img001|หมายเลข 2]]) ใช้รองรับข้อมูลที่ยาวมาก หรือสามารถจัดรูปแบบเป็นหลายบรรทัดได้ มีข้อควรทรายในการฝช้งานดังนี้
* ใช้ปุ่ม {{key press|Ctrl|Enter}} เพื่อ'''ขึ้นบรรทัดใหม่'''ในช่อง
* ช่องข้อมูลประเภทนี้สามารถ'''ยืดหดในแนวตั้ง'''ได้ โดยใช้เมาส์คลิกค้างบริเวณสามเหลี่ยมที่มุมขวาล่างของช่อง แล้วขยับเมาส์ขึ้นหรือลง


==== ช่องค้นหาข้อมูล ====
==== ช่องค้นหาข้อมูล ====
[[ไฟล์:Cuneifox form with search modal.png|720px|thumb|center|alt=การใช้งานหน้าต่างค้นหา|การใช้งานหน้าต่างค้นหา]]
[[ไฟล์:Cuneifox form with search modal.png|720px|thumb|center|alt=การใช้งานหน้าต่างค้นหา|การใช้งานหน้าต่างค้นหา]]


* '''ช่องค้นหา''' ([[#img001|หมายเลข 6]]): ใช้สำหรับค้นหาข้อมูลจากฐานข้อมูล ข้่อมูลในช่องข้อความลักษณะนี้ที่ต้องอ่านจากฐานข้อมูลเท่านั้น มีรายละเอียดการใช้งานดังนี้:
<gallery widths=220>
** กรอกข้อความค้นหาเบื้องต้น แล้วใช้เมาส์คลิกที่ปุ่ม [[ไฟล์:Cuneifox search btn.png|25px|frameless|alt=ปุ่มค้นหา|ปุ่มค้นหา]] ทางขวาของช่อง ระบบจะเปิดหน้าต่างค้นหาขึ้น และกรอกข้อความค้นหาลงในแถบค้นหาของตารางให้โดยอัตโนมัติ หรือ
File:Search trigger all.gif|การเปิดหน้าต่างค้นหาโดยโหลดข้อมูลทั้งหมด ''[[:File:Search trigger all.gif|(คลิกเพื่อดู)]]''
** กรอกข้อความค้นหาเบื้องต้น แล้วกดปุ่ม {{key press|Enter}} หรือ {{key press|Tab}} หรือคลิกที่อื่นบนหน้าจอ ระบบจะค้นหาเฉพาะรายการที่มีรหัสขึ้นต้นด้วยข้อความค้นหา
File:Search trigger enter.gif|การเปิดหน้าต่างค้นหาโดยโหลดข้อมูลบางส่วน (พบหลายรายการ) ''[[:File:Search trigger enter.gif|(คลิกเพื่อดู)]]''
*** หากพบเพียงรายการเดียว ระบบจะเลือกรายการนั้นให้โดยอัตโนมัติ
File:Search trigger qsch.gif|การเปิดหน้าต่างค้นหาโดยโหลดข้อมูลบางส่วน (พบรายการเดียว) ''[[:File:Search trigger qsch.gif|(คลิกเพื่อดู)]]''
*** หากไม่พบหรือพบมากกว่า 1 รายการ ระบบจะเปิดหน้าต่างค้นหา พร้อมแสดงรายการทั้งหมดที่พบ
</gallery>
*: {{3stars}} กรณีที่ระบบเปิดหน้าต่างค้นหาขึ้น ให้ผู้ใช้เลือกรายการที่ต้องการแล้วกดปุ่ม '''"ตกลง"''' ด้านล่างของหน้าต่าง (ผู้ใช้สามารถเลือกรายการด้วยคีย์บอร์ด แล้วกดปุ่ม {{key press|Enter}} เพื่อยืนยันการเลือก ตามรายละเอียดในหัวข้อ[[ตารางในระบบคูนิฟ็อกซ์]]ก็ได้)
 
ช่องค้นหา (search field: [[#img001|หมายเลข 6]]) ใช้ค้นหาข้อมูลจากฐานข้อมูล ส่วนมากจะเป็นการค้นหาจากตารางรหัสต่างๆ มีรายละเอียดในการใช้งานดังนี้:
* '''หากต้องการโหลดข้อมูลทั้งหมดที่เลือกได้:'''
*# '''กรอกข้อความ'''ที่ต้องการค้นหาลงในช่องข้อมูล (ดูหัวช้อ '''[[ตารางในระบบคูนิฟ็อกซ์#การค้นหาข้อมูลในตาราง|"การค้นหาข้อมูลในตาราง"]]''' ประกอบ)
*# เปิดหน้าต่างค้นหาโดย:
*#* ใช้เมาส์'''คลิกปุ่ม''' [[ไฟล์:Cuneifox search btn.png|25px|frameless|alt=ปุ่มค้นหา|ปุ่มค้นหา]] ทางขวาของช่อง ''หรือ''
*#* '''กดปุ่ม''' {{key press|Ctrl|Enter}}
*# ระบบจะเปิดหน้าต่างค้นหาขึ้น พร้อมโหลดข้อมูลทั้งหมด และกรอกข้อความที่กรอกไว้ลงในแถบค้นหาของตารางให้โดยอัตโนมัติ '''เลือกรายการที่ต้องการ''' แล้วคลิกปุ่ม '''"เลือก"'''
* '''หากต้องการโหลดข้อมูลบางส่วนที่เกี่ยวข้อง:''' เนื่องจากการโหลดข้อมูลบางส่วนใช้ทรัพยากรของคอมพิวเตอร์น้อยกว่า วิธีการนี้จะทำให้ผู้ใช้สามารถใช้งานโปรแกรมได้รวดเร็วกว่า แต่ผู้ใช้ต้องอักขระขึ้นต้นของวัตถุที่ต้องการค้นหา ''(เช่น ต้องทราบว่ารหัสของสินค้าที่ต้องการค้นหาขึ้นต้นด้วย "{{mono|CPU}}" เป็นต้น)''
*# '''กรอกอักขระขึ้นต้น'''ของวัตถุที่ต้องการค้นหา
*# เปิดหน้าต่างค้นหาโดย:
*#* '''กดปุ่ม''' {{key press|Enter}} ''หรือ''
*#* '''กดปุ่ม''' {{key press|Tab}} ''หรือ''
*#* '''คลิก'''ที่ตำแหน่งอื่นบนหน้าจอ
*# ระบบจะค้นหาวัตถุที่มีอักขระขึ้นต้นตามที่ค้นหาเพื่อแสดงผล
*#* หากระบบพบวัตถุที่เป็นไปได้เพียง'''รายการเดียว''' ระบบจะเลือกวัตถุนั้นให้โดยอัตโนมัติ
*#* หากระบบพบวัตถุที่เป็นไปได้'''หลายรายการ''' ระบบจะเปิดหน้าต่างค้นหาขึ้น พร้อมโหลดเฉพาะข้อมูลของรายการที่เป็นไปได้เหล่านั้น ให้ผู้ใช้เลือกรายการที่ต้องการ แล้วคลิกปุ่ม '''"เลือก"'''


=== ช่องตัวเลือกข้อมูล ===
=== ช่องตัวเลือกข้อมูล ===
select field and radio field
[[ไฟล์:Select field examples.png||thumb|right|alt=ตัวอย่างช่องตัวเลือกข้อมูล|ตัวอย่างช่องตัวเลือกข้อมูล]]
* '''ช่องเลือกข้อมูล''' ([[#img001|หมายเลข 7]]): ให้ผู้ใช้เลือกข้อมูลจากตัวเลือกที่กำหนดไว้
ช่องตัวเลือกข้อมูล ([[#img001|หมายเลข 7]]) ใช้สำหรับให้ผู้ใช้เลือกตัวเลือกใดตัวเลือกหนึ่งจากที่กำหนดเอาไว้ มักใช้กับข้อมูลที่มีขอบเขตจำกัดแน่นอน เพื่อลดเวลาที่ต้องเสียไปและลดความผิดพลาดด้านตัวสะกดต่างๆ ช่องตัวเลือกข้อมูลอาจปรากฏให้เห็นได้ 2 รูปแบบ ได้แก่:
* '''ช่องตัวเลือกดรอปดาวน์ (drop-down list field):''' แสดงเฉพาะตัวเลือกที่เลือกอยู่ในปัจจุบัน ทางขวาของช่องมีรูปลูกศรขึ้น-ลง เพื่อแสดง่ามีตัวเลือกอื่นๆ สามารถกดเพื่อเลือกได้
* '''ช่องปุ่มวิทยุ (radio field):''' แสดงตัวเลือกทุกรายการ และแสดงตัวเลือกปัจจุบันด้วยวงกลมหน้าตัวเลือก


=== ช่องทำเครื่องหมาย ===
=== ช่องทำเครื่องหมาย ===
checkbox + toggle
[[ไฟล์:Form BoolField.png||thumb|right|alt=ช่องทำเครื่องหมาย|ช่องทำเครื่องหมาย]]
* '''ช่องทำเครื่องหมาย''' ([[#img001|หมายเลข 5]]): คลิกที่ช่องหรือข้อความประจำช่องเพื่อทำเครื่องหมายหรือยกเลิกการทำเครื่องหมาย
ช่องทำเครื่องหมาย ([[#img001|หมายเลข 5]]) ใช้รับข้อมูล'''จริง/เท็จ''' ผู้ใช้สามารถคลิกที่ช่องหรือข้อความประจำช่องเพื่อทำเครื่องหมายหรือยกเลิกการทำเครื่องหมาย ช่องทำเครื่องหมายอาจปรากฏให้เห็นได้ 2 รูปแบบ ได้แก่:
* '''กล่องทำเครื่องหมาย (checkbox)'''
* '''กล่องสวิตช์ (toggle)'''


=== ช่องเลือกไฟล์และภาพ ===
=== ช่องเลือกไฟล์และภาพ ===
* '''ช่องเลือกไฟล์''' ([[#img001|หมายเลข 3]]): ประกอบด้วย 2 ส่วน ได้แก่
ช่องเลือกไฟล์ ([[#img001|หมายเลข 3]]) ประกอบด้วย 2 ส่วน ได้แก่
** '''ตัวช่องข้อมูล''': ผู้ใช้สามารถคลิกในบริเวณของช่องข้อมูล ระบบจะเปิดหน้าต่างเลือกไฟล์ขึ้นมา
* '''ตัวช่องข้อมูล:''' เมื่อผู้ใช้คลิกในบริเวณของช่องข้อมูล ระบบจะเปิดหน้าต่างเลือกไฟล์
** '''ชุดปุ่มเครื่องมือ''': มี 4 ปุ่ม ได้แก่
* '''ชุดปุ่มเครื่องมือ''': มี 4 ปุ่ม ได้แก่:
*** ปุ่ม [[ไฟล์:Cuneifox view btn.png|25px|frameless|alt=ปุ่มเปิดไฟล์|ปุ่มเปิดไฟล์]] ใช้เปิดไฟล์ที่เลือกอยู่ปัจจุบันในแท็บใหม่ เพื่อดูภาพขนาดเต็ม (กรณีเป็นไฟล์รูปภาพ) หรือดาวน์โหลดไฟล์
** ปุ่ม [[ไฟล์:Cuneifox view btn.png|25px|frameless|alt=ปุ่มเปิดไฟล์|ปุ่มเปิดไฟล์]] ใช้'''เปิดไฟล์'''ที่เลือกอยู่ปัจจุบันในแท็บใหม่ เพื่อดูภาพขนาดเต็ม ''(กรณีเป็นไฟล์รูปภาพ)'' หรือดาวน์โหลดไฟล์
*** ปุ่ม [[ไฟล์:Cuneifox cam btn.png|25px|frameless|alt=ปุ่มถ่ายภาพ|ปุ่มถ่ายภาพ]] ใช้แนบรูปถ่าย เมื่อกดปุ่มนี้ ระบบจะเปิดหน้าต่างอัพโหลดจากกล้อง เพื่อให้ผู้ใช้ถ่ายภาพที่ต้องการแนบ
** ปุ่ม [[ไฟล์:Cuneifox cam btn.png|25px|frameless|alt=ปุ่มถ่ายภาพ|ปุ่มถ่ายภาพ]] ใช้'''แนบรูปถ่าย''' เมื่อกดปุ่มนี้ ระบบจะเปิดหน้าต่างอัพโหลดจากกล้อง เพื่อให้ผู้ใช้ถ่ายภาพที่ต้องการแนบ
*** ปุ่ม [[ไฟล์:Cuneifox revert btn.png|25px|frameless|alt=ปุ่มยกเลิกการแก้ไข|ปุ่มยกเลิกการแก้ไข]] ใช้ยกเลิกการเปลี่ยนแปลงค่า เมื่อกดปุ่มนี้ ไฟล์ที่เลือกไว้จะกลับไปเป็นไฟล์เดิมในฐานข้อมูล (ถ้าในฐานข้อมูลยังไม่มีไฟล์เก็บไว้ ปุ่มนี้จะทำงานเหมือนปุ่ม [[ไฟล์:Cuneifox file delete btn.png|25px|frameless|alt=ปุ่มยกเลิกการเลือกไฟล์|ปุ่มยกเลิกการเลือกไฟล์]] )
** ปุ่ม [[ไฟล์:Cuneifox revert btn.png|25px|frameless|alt=ปุ่มยกเลิกการแก้ไข|ปุ่มยกเลิกการแก้ไข]] ใช้'''ยกเลิกการเปลี่ยนแปลงค่า''' เมื่อกดปุ่มนี้ ไฟล์ที่เลือกไว้จะกลับไปเป็นไฟล์เดิมก่อนแก้ไข (ถ้าไม่มีไฟล์อยู่ก่อนการแก้ไข ปุ่มนี้จะทำงานเหมือนปุ่ม [[ไฟล์:Cuneifox file delete btn.png|25px|frameless|alt=ปุ่มยกเลิกการเลือกไฟล์|ปุ่มยกเลิกการเลือกไฟล์]] )
*** <p>ปุ่ม [[ไฟล์:Cuneifox file delete btn.png|25px|frameless|alt=ปุ่มยกเลิกการเลือกไฟล์|ปุ่มยกเลิกการเลือกไฟล์]] ใช้ล้างข้อมูลไฟล์</p><p>{{3stars}} หลังจากบันทึกข้อมูล ไฟล์จะถูกบันทึกในแฟ้มที่กำหนดไว้ภายในเครื่องเซิร์ฟเวอร์ โดยระบบคูนิฟ็อกซ์จะสร้างข้อความสุ่มขึ้นมาตั้งเป็นชื่อไฟล์โดยอัตโนมัติ</p><p>{{3stars}} กรณีที่ช่องข้อมูลรองรับไฟล์ภาพ ผู้ใช้อาจเห็น'''ช่องแสดงตัวอย่างภาพ''' ([[#img001|หมายเลข 4]]) หากผู้ใช้คลิกที่ตัวอย่างภาพ ระบบจะเปิดไฟล์นั้นในแท็บใหม่</p>
** <p>ปุ่ม [[ไฟล์:Cuneifox file delete btn.png|25px|frameless|alt=ปุ่มยกเลิกการเลือกไฟล์|ปุ่มยกเลิกการเลือกไฟล์]] ใช้'''ล้างข้อมูลไฟล์'''
 
{{3stars}} ไฟล์ที่บันทึกในระบบคูนิฟ็อกซ์จะถูกตั้งชื่อใหม่ซึ่งระบบสุ่มขึ้นมา และบันทึกไว้ในตำแหน่งที่กำหนดไว้โดยเครื่องเซิร์ฟเวอร์
 
{{3stars}} กรณีที่ช่องข้อมูลรองรับไฟล์ภาพ ผู้ใช้อาจเห็น'''ช่องแสดงตัวอย่างภาพ''' ([[#img001|หมายเลข 4]]) หากผู้ใช้คลิกที่ตัวอย่างภาพ ระบบจะเปิดไฟล์นั้นในแท็บใหม่ (เหมือนกับกดปุ่ม [[ไฟล์:Cuneifox view btn.png|25px|frameless|alt=ปุ่มเปิดไฟล์|ปุ่มเปิดไฟล์]])


== สถานะของช่องข้อมูล ==
== สถานะของช่องข้อมูล ==
disabled (right click to copy), readonly, validation
ในบางครั้ง ผู้ใช้อาจพบว่าฟอร์มหรือช่องข้อมูลบางช่องบนเพจไม่ได้อยู่ในสภาพสำหรับกรอก/แก้ไขข้อมูล หรือฟอร์มไม่สามารถยืนยัน/บันทึกข้อมูลได้ เนื่องจากฟอร์มหรือช่องข้อมูลนั้นอยู่ในสถานะปิดกั้นการแก้ไข หรือไม่ผ่านการตรวจสอบ
{{3stars}} ช่องข้อมูลบางช่องอาจถูกปิดกั้นการเปลี่ยนแปลงค่าเอาไว้ ช่องข้อมูลเหล่านี้มักจะเป็นข้อมูลที่กรอกหรือคำนวณโดยอัตโนมัติ หรือเป็นค่าที่ไม่อนุญาตให้แก้ไขหลังจากเพิ่มรายการไปเรียบร้อยแล้ว
 
=== ฟอร์มที่ถูกปิดการแก้ไข ===
[[ไฟล์:Form disabled.png|720px|thumb|center|alt=ฟอร์มที่ถูกปิดการแก้ไข|ฟอร์มที่ถูกปิดการแก้ไข]]
ฟอร์มที่ถูกปิดการแก้ไข (disabled) ใช้เพื่อแสดงข้อมูลเท่านั้น ตัวอย่างสถานการณ์ที่ผู้ใช้จะพบว่าฟอร์มถูกปิดกั้นได้แก่:
* '''ผู้ใช้ไม่มีสิทธิ์'''ในการแก้ไขข้อมูลในฟอร์มดังกล่าว
* ข้อมูลในเดือนนั้น'''ถูกปิดกั้นการแก้ไข'''แล้ว
* ฟอร์มหรือเอกสารนั้น'''ไม่ได้อยู่ใน "[[หน้าจอเอกสาร#โหมดการแก้ไข|โหมดการแก้ไข]]"'''
 
{{3stars}} ผู้ใช้สามารถคลิกขากที่ช่องข้อมูลต่างๆ ของฟอร์มที่ถูกปิดกั้นเพื่อคัดลอกข้อความในช่องได้ (ตามภาพ)
 
=== ช่องข้อมูลประเภทอ่านค่าเท่านั้น ===
ช่องข้อมูลบางช่องอยู่ในสถานะอ่านค่าเท่านั้น (read-only: [[#img001|หมายเลข 8, 9]]) ผู้ใช้จะไม่สามารถกรอกหรือแก้ไขข้อความในช่องข้อมูลเหล่านี้ได้ โดยปกติช่องข้อมูลที่มีสถานะแบบนี้ได้แก่:
* '''ข้อมูลที่ไม่อนุญาตให้แก้ไข''' เช่น เลขที่เอกสาร, ฯลฯ
* '''ข้อมูลที่กรอกค่าโดยอัตโนมัติ''' มักจะเป็นข้อมูลที่รับผลจากการค้นหาจากช่องข้อมูลอื่น เช่น ชื่อกลุ่มสินค้าตาม[[#img001|หมายเลข 9 ในภาพ]]
* '''ข้อมูลที่อนุญาตให้แก้ไขตามเงื่อนไข''' เช่น ช่องรายละเอียดการหักภาษี ณ ที่จ่าย''รายการที่ 2'' จะเปิดให้แก้ไขได้เมื่อมีการบันทึก''รายการที่ 1'' แล้วเท่านั้น เป็นต้น
 
=== การยืนยันข้อมูลในฟอร์มก่อนบันทึก ===
ก่อนที่ข้อมูลในฟอร์มจะถูกนำไปใช้หรือบันทึกเข้าในฐานข้อมูล ระบบจะตรวจสอบข้อมูลในเบื้องต้นว่าข้อมูลที่ป้อนเข้ามาจะไม่ทำให้เกิดปัญหาด้านการคำนวณหรือปัญหาอื่นๆ ในอนาคต
 
==== การตรวจสอบเวลาของ session ====
เนื่องจากระบบคูนิฟ็อกซ์บริหารข้อมูลธุรกรรมแยกเป็นเดือน ระบบจึงเทียบเวลาของ session กับเวลาประจำเพจที่บันทึกฟอร์ม หากเวลาไม่ตรงกัน ระบบจะแจ้ง[[ข้อผิดพลาด 461]] (เวลาของระบบไม่ถูกต้อง!)
 
สาเหตุหลักของ[[ข้อผิดพลาด 461]] คือการใช้งานพร้อมกันหลายแท็บ แล้วมีการเปลี่ยนแปลงวันที่/เวลาของ session ในแท็บใดแท็บหนึ่งก่อนจะพยายามบันทึกฟอร์มในแท็บอื่น
 
==== การตรวจสอบข้อมูลในฟอร์ม ====
[[ไฟล์:Invalid form errors.png|720px|thumb|center|alt=ฟอร์มที่ตรวจสอบข้อมูลไม่ผ่าน|ฟอร์มที่ตรวจสอบข้อมูลไม่ผ่าน]]
 
เมื่อระบบตรวจสอบพบความผิดพลาดในข้อมูลที่กรอกในฟอร์ม (เช่น ไม่ได้กรอกข้อมูลในช่องที่จำเป็น, วันที่ไม่สอดคล้องกับรอบข้อมูล, ฯลฯ) ระบบจะแจ้งเตือนเป็นข้อความสีแดงใต้ช่องที่เกี่ยวข้อง (ตามภาพ) เมื่อผู้ใช้ปรับแก้ข้อมูลแล้ว สามารถกดส่งฟอร์มได้อีกครั้ง


{{การใช้งานฟอร์มด้วยคีย์บอร์ด}}
{{การใช้งานฟอร์มด้วยคีย์บอร์ด}}

รุ่นแก้ไขปัจจุบันเมื่อ 18:05, 25 พฤศจิกายน 2568


ฟอร์มเป็นวิธีการสื่อสารข้อมูลที่ผู้ใช้ต้องการเพิ่มเติม/แก้ไขให้ระบบคูนิฟ็อกซ์รับค่าและบันทึกตาม จึงนับได้ว่า ฟอร์มเป็นองค์ประกอบที่ผู้ใช้มีปฏิสัมพันธ์ด้วยมากที่สุดอย่างหนึ่งภายใต้โมดูลมาตรฐานของคูนิฟ็อกซ์

ผู้ใช้จะสามารถพบฟอร์มได้ในหลายรูปแบบดังนี้:

  • ฟอร์มอิสระ (stand-alone form): เป็นฟอร์มที่ไม่ได้เป็นส่วนประกอบย่อยของตารางข้อมูลใดๆ เช่น ฟอร์มลงชื่อเข้าใช้, ฟอร์มเปลี่ยนวันที่และเวลาของระบบ, ฟอร์มหัวเอกสารต่างๆ, ฯลฯ
  • ฟอร์มที่เป็นองค์ประกอบของตารางข้อมูล (in-table form): เมื่อผู้ใช้ต้องการเพิ่มหรือแก้ไขข้อมูลในตารางข้อมูลต่างๆ ระบบจะแสดงและรับข้อมูลผ่านฟอร์มที่ผูกอยู่กับตารางข้อมูลนั้น ทั้งนี้ ฟอร์มของตารางรหัสอาจแสดงอยู่ในแถวของตาราง (in-line form) หรือแสดงในหน้าต่างแยกต่างหาก (pop-up form) ก็ได้ถ้าจำนวนช่องข้อมูลมีมากกว่าที่แสดงอยู่ในตาราง (ดูเพิ่มเติม ตารางในระบบคูนิฟ็อกซ์)

ชนิดของช่องข้อมูล

ฟอร์มภายใต้โมดูลมาตรฐานของคูนิฟ็อกซ์ประกอบด้วยช่องข้อมูลต่างๆ ดังนี้

องค์ประกอบของฟอร์มในระบบคูนิฟ็อกซ์
องค์ประกอบของฟอร์มในระบบคูนิฟ็อกซ์

ช่องกรอกข้อความ

ช่องกรอกข้อความ (ตัวอย่างเช่น หมายเลข 1, 2, และ 6 ตามภาพ) ใช้กรอกข้อมูลประเภทตัวเลขและตัวอักษร รองรับฟังก์ชันเชิงข้อความทั่วไปของคอมพิวเตอร์ เช่นการตัด (cut: Ctrl+X), คัดลอก/วาง (copy/paste: Ctrl+C / Ctrl+V), เลิกทำ (undo: Ctrl+Z), เลือกทั้งหมด (select all: Ctrl+A), ฯลฯ

เพื่ออำนวยความสะดวกและควบคุมข้อมูลต่างๆ ช่องข้อความบางช่องอาจมีฟีเจอร์เพิ่มเติมเช่น:

การจัดรูปแบบข้อมูลชนิดพิเศษ

ช่องข้อมูลชนิดวันที่และเวลา
ช่องข้อมูลชนิดวันที่และเวลา

ฟีเจอร์ช่วยจัดรูปแบบข้อมูลช่วยให้ระบบสามารถตีความหมายข้อมูลที่ผู้ใช้ต้องการได้ง่าย, รักษาความเป็นระเบียบของข้อมูลที่จัดเก็บและแสดงผลต่อผู้ใช้โดยรวม, และประหยัดเวลาให้กับผู้ใช้ในการกรอกข้อมูล

ข้อความชนิดพิเศษที่ระบบคูนิฟ็อกซ์ช่วยจัดรูปแบบให้ได้แก่:

  • วันที่: ผู้ใช้สามารถเลือกกรอกข้อมูลได้ดังนี้ (ใช้วันที่ 31 ธันวาคม ค.ศ. 2022 เป็นตัวอย่าง):
  • เดือน: ผู้ใช้สามารถกรอกข้อมูลได้ดังนี้ (ใช้เดือน ธันวาคม ค.ศ. 2022 เป็นตัวอย่าง):
  • เวลา: ผู้ใช้สามารถกรอกข้อมูลได้ดังนี้ (ใช้เวลา 15 นาฬิกา 0 นาที 0 วินาที เป็นตัวอย่าง):
    • กรอกตามรูปแบบที่บริษัทตั้งค่าไว้ (เช่น "15:00:00": ขึ้นกับรูปแบบที่บริษัทกำหนด)
    • กรอกตามรูปแบบที่บริษัทตั้งค่าไว้โดยไม่ใส่เครื่องหมายคั่น (เช่น "150000": ขึ้นกับรูปแบบที่บริษัทกำหนด)
    • กรอกเฉพาะชั่วโมงและนาที ระบบจะใส่ค่า 0 แทนวินาทีโดยอัตโนมัติ (เช่น "1500")
    • กรอกเฉพาะชั่วโมง ระบบจะใส่ค่า 0 แทนนาทีและวินาทีโดยอัตโนมัติ (เช่น "15")
  • จำนวนเต็ม: ระบบจะปัดเศษทศนิยมของข้อมูลในช่องให้เป็นจำนวนเต็มโดยอัตโนมัติ (สำหรับช่องที่โปรแกรมกำหนดชนิดข้อมูลเป็นจำนวนเต็ม)
  • ค่าทศนิยม และร้อยละ: ระบบจะปัดเศษทศนิยมของข้อมูลในช่องให้มีความละเอียดตามที่ตั้งค่าไว้ พร้อมใส่เครื่องหมายคั่นหลักพัน/หมื่น และเครื่องหมายเปอร์เซ็นต์ (ชนิดของข้อมูลกำหนดกำหนดโดยตัวโปรแกรม)

การคำนวณสดในช่องข้อมูล

ตัวอย่างการใช้งานช่องคำนวณสด
ตัวอย่างการใช้งานช่องคำนวณสด

ช่องข้อมูลที่โปรแกรมกำหนดชนิดเป็นจำนวนเต็ม, ทศนิยม, หรือร้อยละรองรับการคำนวณสดแบบเครื่องคิดเลขได้ ผู้ใช้สามารถใช้งานฟีเจอร์นี้ได้โดย:

  1. เริ่มป้อนข้อมูลในช่องด้วยเครื่องหมายเท่ากับ "=" หรือเครื่องหมายบวก "+" (ระบบจะตีความเครื่องหมายบวกในตำแหน่งแรกเป็นเครื่องหมายเท่ากับโดยอัตโนมัติ)
  2. ป้อนตัวเลขและเครื่องหมายที่ต้องการคำนวณต่อเนื่องไปเรื่อยๆ เหมือนกับการใช้เครื่องคิดเลขตั้งโต๊ะ สัญลักษณ์ทางการคำนวณที่ระบบรองรับได้แก่
    • บวก (+)
    • ลบ (-): ใช้เป็นทั้งเครื่องหมายคิดคำนวณและระบุจำนวนติดลบ
    • คูณ (*)
    • หาร (/)
    • ยกกำลัง (^): สามารถใช้แทนเครื่องหมายราก (root) ได้ เช่น รากที่สอง (square root) ใช้ยกกำลัง 0.5 เป็นต้น

    • ตัวอย่างการใช้งานช่องคำนวณสด (ร้อยละ)
      ตัวอย่างการใช้งานช่องคำนวณสด (ร้อยละ)
    • เปอร์เซ้นต์ (%): พฤติกรรมการคำนวณด้วยเครื่องหมายเปอร์เซ็นต์เป็นดังนี้:
      • หากใส่เครื่องหมายเปอร์เซ็นต์ที่จำนวนแรก: ระบบจะนำจำนวนนั้นหาร 100 ให้โดยอัตโนมัติ
      • การบวก/ลบด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: ใช้จำนวนแรกเป็นฐานการคำนวณ เช่น

      • การคูณ/หารด้วยจำนวนที่มีเครื่องหมายเปอร์เซ็นต์: หารจำนวนที่สองด้วย 100 ก่อนแล้วจึงคำนวณ เช่น

ช่องกรอกข้อความหลายบรรทัด

ช่องกรอกข้อความหลายบรรทัด (หมายเลข 2) ใช้รองรับข้อมูลที่ยาวมาก หรือสามารถจัดรูปแบบเป็นหลายบรรทัดได้ มีข้อควรทรายในการฝช้งานดังนี้

  • ใช้ปุ่ม Ctrl+↵ Enter เพื่อขึ้นบรรทัดใหม่ในช่อง
  • ช่องข้อมูลประเภทนี้สามารถยืดหดในแนวตั้งได้ โดยใช้เมาส์คลิกค้างบริเวณสามเหลี่ยมที่มุมขวาล่างของช่อง แล้วขยับเมาส์ขึ้นหรือลง

ช่องค้นหาข้อมูล

การใช้งานหน้าต่างค้นหา
การใช้งานหน้าต่างค้นหา

ช่องค้นหา (search field: หมายเลข 6) ใช้ค้นหาข้อมูลจากฐานข้อมูล ส่วนมากจะเป็นการค้นหาจากตารางรหัสต่างๆ มีรายละเอียดในการใช้งานดังนี้:

  • หากต้องการโหลดข้อมูลทั้งหมดที่เลือกได้:
    1. กรอกข้อความที่ต้องการค้นหาลงในช่องข้อมูล (ดูหัวช้อ "การค้นหาข้อมูลในตาราง" ประกอบ)
    2. เปิดหน้าต่างค้นหาโดย:
      • ใช้เมาส์คลิกปุ่ม ปุ่มค้นหา ทางขวาของช่อง หรือ
      • กดปุ่ม Ctrl+↵ Enter
    3. ระบบจะเปิดหน้าต่างค้นหาขึ้น พร้อมโหลดข้อมูลทั้งหมด และกรอกข้อความที่กรอกไว้ลงในแถบค้นหาของตารางให้โดยอัตโนมัติ เลือกรายการที่ต้องการ แล้วคลิกปุ่ม "เลือก"
  • หากต้องการโหลดข้อมูลบางส่วนที่เกี่ยวข้อง: เนื่องจากการโหลดข้อมูลบางส่วนใช้ทรัพยากรของคอมพิวเตอร์น้อยกว่า วิธีการนี้จะทำให้ผู้ใช้สามารถใช้งานโปรแกรมได้รวดเร็วกว่า แต่ผู้ใช้ต้องอักขระขึ้นต้นของวัตถุที่ต้องการค้นหา (เช่น ต้องทราบว่ารหัสของสินค้าที่ต้องการค้นหาขึ้นต้นด้วย "CPU" เป็นต้น)
    1. กรอกอักขระขึ้นต้นของวัตถุที่ต้องการค้นหา
    2. เปิดหน้าต่างค้นหาโดย:
      • กดปุ่ม ↵ Enter หรือ
      • กดปุ่ม Tab ↹ หรือ
      • คลิกที่ตำแหน่งอื่นบนหน้าจอ
    3. ระบบจะค้นหาวัตถุที่มีอักขระขึ้นต้นตามที่ค้นหาเพื่อแสดงผล
      • หากระบบพบวัตถุที่เป็นไปได้เพียงรายการเดียว ระบบจะเลือกวัตถุนั้นให้โดยอัตโนมัติ
      • หากระบบพบวัตถุที่เป็นไปได้หลายรายการ ระบบจะเปิดหน้าต่างค้นหาขึ้น พร้อมโหลดเฉพาะข้อมูลของรายการที่เป็นไปได้เหล่านั้น ให้ผู้ใช้เลือกรายการที่ต้องการ แล้วคลิกปุ่ม "เลือก"

ช่องตัวเลือกข้อมูล

ตัวอย่างช่องตัวเลือกข้อมูล
ตัวอย่างช่องตัวเลือกข้อมูล

ช่องตัวเลือกข้อมูล (หมายเลข 7) ใช้สำหรับให้ผู้ใช้เลือกตัวเลือกใดตัวเลือกหนึ่งจากที่กำหนดเอาไว้ มักใช้กับข้อมูลที่มีขอบเขตจำกัดแน่นอน เพื่อลดเวลาที่ต้องเสียไปและลดความผิดพลาดด้านตัวสะกดต่างๆ ช่องตัวเลือกข้อมูลอาจปรากฏให้เห็นได้ 2 รูปแบบ ได้แก่:

  • ช่องตัวเลือกดรอปดาวน์ (drop-down list field): แสดงเฉพาะตัวเลือกที่เลือกอยู่ในปัจจุบัน ทางขวาของช่องมีรูปลูกศรขึ้น-ลง เพื่อแสดง่ามีตัวเลือกอื่นๆ สามารถกดเพื่อเลือกได้
  • ช่องปุ่มวิทยุ (radio field): แสดงตัวเลือกทุกรายการ และแสดงตัวเลือกปัจจุบันด้วยวงกลมหน้าตัวเลือก

ช่องทำเครื่องหมาย

ช่องทำเครื่องหมาย
ช่องทำเครื่องหมาย

ช่องทำเครื่องหมาย (หมายเลข 5) ใช้รับข้อมูลจริง/เท็จ ผู้ใช้สามารถคลิกที่ช่องหรือข้อความประจำช่องเพื่อทำเครื่องหมายหรือยกเลิกการทำเครื่องหมาย ช่องทำเครื่องหมายอาจปรากฏให้เห็นได้ 2 รูปแบบ ได้แก่:

  • กล่องทำเครื่องหมาย (checkbox)
  • กล่องสวิตช์ (toggle)

ช่องเลือกไฟล์และภาพ

ช่องเลือกไฟล์ (หมายเลข 3) ประกอบด้วย 2 ส่วน ได้แก่

  • ตัวช่องข้อมูล: เมื่อผู้ใช้คลิกในบริเวณของช่องข้อมูล ระบบจะเปิดหน้าต่างเลือกไฟล์
  • ชุดปุ่มเครื่องมือ: มี 4 ปุ่ม ได้แก่:
    • ปุ่ม ปุ่มเปิดไฟล์ ใช้เปิดไฟล์ที่เลือกอยู่ปัจจุบันในแท็บใหม่ เพื่อดูภาพขนาดเต็ม (กรณีเป็นไฟล์รูปภาพ) หรือดาวน์โหลดไฟล์
    • ปุ่ม ปุ่มถ่ายภาพ ใช้แนบรูปถ่าย เมื่อกดปุ่มนี้ ระบบจะเปิดหน้าต่างอัพโหลดจากกล้อง เพื่อให้ผู้ใช้ถ่ายภาพที่ต้องการแนบ
    • ปุ่ม ปุ่มยกเลิกการแก้ไข ใช้ยกเลิกการเปลี่ยนแปลงค่า เมื่อกดปุ่มนี้ ไฟล์ที่เลือกไว้จะกลับไปเป็นไฟล์เดิมก่อนแก้ไข (ถ้าไม่มีไฟล์อยู่ก่อนการแก้ไข ปุ่มนี้จะทำงานเหมือนปุ่ม ปุ่มยกเลิกการเลือกไฟล์ )
    • ปุ่ม ปุ่มยกเลิกการเลือกไฟล์ ใช้ล้างข้อมูลไฟล์

*** ไฟล์ที่บันทึกในระบบคูนิฟ็อกซ์จะถูกตั้งชื่อใหม่ซึ่งระบบสุ่มขึ้นมา และบันทึกไว้ในตำแหน่งที่กำหนดไว้โดยเครื่องเซิร์ฟเวอร์

*** กรณีที่ช่องข้อมูลรองรับไฟล์ภาพ ผู้ใช้อาจเห็นช่องแสดงตัวอย่างภาพ (หมายเลข 4) หากผู้ใช้คลิกที่ตัวอย่างภาพ ระบบจะเปิดไฟล์นั้นในแท็บใหม่ (เหมือนกับกดปุ่ม ปุ่มเปิดไฟล์)

สถานะของช่องข้อมูล

ในบางครั้ง ผู้ใช้อาจพบว่าฟอร์มหรือช่องข้อมูลบางช่องบนเพจไม่ได้อยู่ในสภาพสำหรับกรอก/แก้ไขข้อมูล หรือฟอร์มไม่สามารถยืนยัน/บันทึกข้อมูลได้ เนื่องจากฟอร์มหรือช่องข้อมูลนั้นอยู่ในสถานะปิดกั้นการแก้ไข หรือไม่ผ่านการตรวจสอบ

ฟอร์มที่ถูกปิดการแก้ไข

ฟอร์มที่ถูกปิดการแก้ไข
ฟอร์มที่ถูกปิดการแก้ไข

ฟอร์มที่ถูกปิดการแก้ไข (disabled) ใช้เพื่อแสดงข้อมูลเท่านั้น ตัวอย่างสถานการณ์ที่ผู้ใช้จะพบว่าฟอร์มถูกปิดกั้นได้แก่:

  • ผู้ใช้ไม่มีสิทธิ์ในการแก้ไขข้อมูลในฟอร์มดังกล่าว
  • ข้อมูลในเดือนนั้นถูกปิดกั้นการแก้ไขแล้ว
  • ฟอร์มหรือเอกสารนั้นไม่ได้อยู่ใน "โหมดการแก้ไข"

*** ผู้ใช้สามารถคลิกขากที่ช่องข้อมูลต่างๆ ของฟอร์มที่ถูกปิดกั้นเพื่อคัดลอกข้อความในช่องได้ (ตามภาพ)

ช่องข้อมูลประเภทอ่านค่าเท่านั้น

ช่องข้อมูลบางช่องอยู่ในสถานะอ่านค่าเท่านั้น (read-only: หมายเลข 8, 9) ผู้ใช้จะไม่สามารถกรอกหรือแก้ไขข้อความในช่องข้อมูลเหล่านี้ได้ โดยปกติช่องข้อมูลที่มีสถานะแบบนี้ได้แก่:

  • ข้อมูลที่ไม่อนุญาตให้แก้ไข เช่น เลขที่เอกสาร, ฯลฯ
  • ข้อมูลที่กรอกค่าโดยอัตโนมัติ มักจะเป็นข้อมูลที่รับผลจากการค้นหาจากช่องข้อมูลอื่น เช่น ชื่อกลุ่มสินค้าตามหมายเลข 9 ในภาพ
  • ข้อมูลที่อนุญาตให้แก้ไขตามเงื่อนไข เช่น ช่องรายละเอียดการหักภาษี ณ ที่จ่ายรายการที่ 2 จะเปิดให้แก้ไขได้เมื่อมีการบันทึกรายการที่ 1 แล้วเท่านั้น เป็นต้น

การยืนยันข้อมูลในฟอร์มก่อนบันทึก

ก่อนที่ข้อมูลในฟอร์มจะถูกนำไปใช้หรือบันทึกเข้าในฐานข้อมูล ระบบจะตรวจสอบข้อมูลในเบื้องต้นว่าข้อมูลที่ป้อนเข้ามาจะไม่ทำให้เกิดปัญหาด้านการคำนวณหรือปัญหาอื่นๆ ในอนาคต

การตรวจสอบเวลาของ session

เนื่องจากระบบคูนิฟ็อกซ์บริหารข้อมูลธุรกรรมแยกเป็นเดือน ระบบจึงเทียบเวลาของ session กับเวลาประจำเพจที่บันทึกฟอร์ม หากเวลาไม่ตรงกัน ระบบจะแจ้งข้อผิดพลาด 461 (เวลาของระบบไม่ถูกต้อง!)

สาเหตุหลักของข้อผิดพลาด 461 คือการใช้งานพร้อมกันหลายแท็บ แล้วมีการเปลี่ยนแปลงวันที่/เวลาของ session ในแท็บใดแท็บหนึ่งก่อนจะพยายามบันทึกฟอร์มในแท็บอื่น

การตรวจสอบข้อมูลในฟอร์ม

ฟอร์มที่ตรวจสอบข้อมูลไม่ผ่าน
ฟอร์มที่ตรวจสอบข้อมูลไม่ผ่าน

เมื่อระบบตรวจสอบพบความผิดพลาดในข้อมูลที่กรอกในฟอร์ม (เช่น ไม่ได้กรอกข้อมูลในช่องที่จำเป็น, วันที่ไม่สอดคล้องกับรอบข้อมูล, ฯลฯ) ระบบจะแจ้งเตือนเป็นข้อความสีแดงใต้ช่องที่เกี่ยวข้อง (ตามภาพ) เมื่อผู้ใช้ปรับแก้ข้อมูลแล้ว สามารถกดส่งฟอร์มได้อีกครั้ง

การใช้งานฟอร์มด้วยคีย์บอร์ด

เมื่อโฟกัสของโปรแกรมอยู่ในช่องข้อมูลต่างๆ ของฟอร์ม ผู้ใช้สามารถสั่งการฟอร์มด้วยปุ่มต่างๆ บนคีย์บอร์ดดังนี้:

คีย์สำหรับเปลี่ยนช่องข้อมูล และยืนยันฟอร์ม

  • Tab ↹ : เปลี่ยนไปช่องข้อมูลถัดไป
  • ↵ Enter :
    • กรณีมีช่องข้อมูลถัดไป: เปลี่ยนไปช่องข้อมูลถัดไป
    • กรณีไม่มีช่องข้อมูลถัดไป: ยืนยันการบันทึกข้อมูลในฟอร์ม
  • ⇧ Shift+Tab ↹ หรือ ⇧ Shift+↵ Enter : เปลี่ยนไปช่องข้อมูลก่อนหน้า
  • Alt+↵ Enter : ยืนยันบันทึกข้อมูลในฟอร์ม

คีย์สำหรับช่องตัวเลือก

  • หรือ  : เลือกตัวเลือกก่อนหน้า
  • หรือ  : เลือกตัวเลือกถัดไป
  • PageUp : เลือกตัวเลือกแรก
  • PageDown : เลือกตัวเลือกสุดท้าย

คีย์ลัดอื่นๆ

  • Ctrl+↵ Enter : ขึ้นบรรทัดใหม่ในช่อง (สำหรับช่องกรอกข้อมูลหลายบรรทัด)
  • Space :
    • สำหรับช่องทำเครื่องหมาย: ทำเครื่องหมาย/ยกเลิกการทำเครื่องหมาย
    • สำหรับช่องเลือกข้อมูล: แสดงตัวเลือกทั้งหมด (สำหรับช่องตัวเลือกข้อมูลแบบดรอปดาวน์)
    • สำหรับช่องข้อมูลประเภทไฟล์: แสดงหน้าต่างเลือกไฟล์