3.2. Tạo và định dạng các đối tượng trên trang web
3.2.8. Làm việc với form
Form dùng để tạo các biểu mẫu thu thập thông tin của người xem trang web. Một Form có thể chứa nhiều thành phần như TextField, CheckBox, RadioButton. ComboBox, ListBox, TextAera…
Chèn một Form mới vào trang web
- Trong khung cửa sổ Design, đặt điểm chèn tại vị trí cần chèn form - Chọn menu lệnh Insert Form Form
Hình 3.27. Lệnh tạo Form
Chèn TextField:
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form TextField
Hình 3.28. Hộp thoại thuộc tính thẻ input
+ Label: khai báo nhãn đính kèm theo TextField + Style: kiểu gắn nhãn
+ Position: vị trí của nhãn
* Hiệu chỉnh thuộc tính TextField
- Chọn TextField muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties:
Hình 3.29. Cửa sổ Properties
+ TextField: tên của TextField
+ Char width: bề rộng của Textfield, tính bằng số kí tự + Max Chars: số kí tự tối đa có thề được nhập vào
+ Int val: giá trị ban đầu của TextField + Type: kiểu của TextField
Single line: TextField cho phép nhập văn bản 1 dòng.
Multiline: TextField cho phép nhập văn bàn bao gồm nhiều dòng. Password: TextField chỉ hiện ra các dấu * khi người dùng nhập văn bàn
vào khung.
Chèn Radio Button:
Radio Button sử dụng trong trường hợp cho phép chọn 1 trong các lựa chọn
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form Radio Button
* Hiệu chỉnh thuộc tính RadioButton:
- Chọn Radio Button muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties:
Hình 3.30. Cửa sổ Properties
+ Check value: khai báo giá trị sẽ được gởi về máy chủ + Initial State: trạng thái khởi đầu cho Radio Button.
Checked: chọn sẵn, Unchecked: không được chọn sẵn
Chèn CheckBox:
CheckBox sử dụng trong trường hợp cho phép chọn nhiều trong các lựa chọn
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form CheckBox
- Chọn CheckBox muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties:
Hình 3.31. Cửa sổ Properties
+ Check value: khai báo giá trị sẽ được gởi về máy chủ + Initial State: trạng thái khởi đầu cho CheckBox
Checked: chọn sẵn, Unchecked: không được chọn sẵn
Chèn ComboBox hay ListBox:
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form Select (List/Menu)
* Hiệu chỉnh thuộc tính List/Menu:
- Chọn List/Menu muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties
+ Type: chọn dạng Menu (comboBox), List (ListBox)
Hình 3.32. Cửa sổ Properties
Hình 3.33. Hộp thoại List values
+ Nhắp nút để thêm một mục + Nhắp nút để xóa mục đang
+ Nhắp nút để chỉnh thứ tự các mục
Chèn TextArea:
TextArea dùng trong trường hợp cần nhập nội dung nhiều dịng văn bản, thường là các u cầu, góp ý của người xem trang web
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form TextArea
* Hiệu chỉnh thuộc tính TextArea:
- Chọn TextArea muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties
Hình 3.34. Cửa sổ Properties
+ Char width: bề rộng của vùng nhập văn bản, tính bằng số ký tự + Num lines: số dòng hiện ra trên trang web
+ Type: chọn loại phần tử input
Chèn Button:
- Trong khung cửa sổ Design, đặt điểm chèn trong form - Chọn menu lệnh Insert Form Button
* Hiệu chỉnh thuộc tính Button:
- Chọn Button muốn hiệu chỉnh chọn các thuộc tính trong cửa sổ Properties
Hình 3.35. Cửa sổ Properties
+ Value: giá trị của button
+ Action: Submit form: tạo nút Submit Reset form: tạo nút Reset None: tạo nút lệnh