I. Thuộc tính trang
3. Chọn checkbox Use Background Picture và sau đó kích Browse để mở hộp hội thoại Select Background Picture Chọn các thông số sau:
8.10 Làm việc với Form
“Form” là mẫu biểu thơng qua đó để người sử dụng nhập dữ liệu theo mẫu đã thiết kế.
Thực chất, form là tập hợp các trường và các điều khiển form (được hiểu như một chương trình trên máy chủ được thực hiện khi đăng kí form nghĩa là một phương pháp tổng hợp dữ liệu từ form). Form là chìa khố để tạo tương tác giữa người sử dụng và dữ liệu trên Web. Thông qua các trường này, người sử dụng có thể vào dữ liệu và đăng kí form. Khi đó, trình duyệt gửi u cầu đến server thơng qua địa chỉ của trang Web chứa form. Máy chủ dựa trên các điều khiển form gửi trả về trình duyệt những trang Web mới được tạo bởi chương trình (điều khiển form).
Kích tại bản đồ frame để chọn đích muốn hiển thị liên kết Kích tại bản đồ frame để chọn đích muốn hiển thị liên kết
Form có thể chứa mọi phần tử của trang, chẳng hạn như: các trường, dữ liệu text trong các đoạn, bảng biểu, tranh ảnh, và các phần tử khác nữa.
Người sử dụng nhập dữ liệu trên form bằng cách gõ dữ liệu vào trường text, kích các nút radio hoặc check box, chọn các tuỳ chọn từ thực đơn. Sau đó, họ đăng kí form bằng cách kích chuột vào nút có kiểu là “Submit”. Khi đó, FrontPage đưa nội dung của form vào một file trên FrontPage web. Đây là file chứa các thông tin được cập nhật từ form. Bạn có thể cấu hình form để gửi dữ liệu trên đó tới một địa chỉ e-mail.
Người sử dụng khơng nhìn thấy điều khiển form. Nó bắt đầu tiến trình của mình khi họ đăng kí form. FrontPage tự động gán các điều khiển form mặc định khi form được tạo. Tuy nhiên, bạn có thể thiết lập các điều khiển form của mình cho form.
Tạo Form
Trong FrontPage Editor, bạn có thể tạo một form mới ở bất kì vị trí nào trên trang, ở phía trong hoặc ngồi form.
- Tại vị trí muốn bắt đầu form trên trang, thực hiện lệnh Insert/Form Field và chọn kiểu trường tương ứng.
- FrontPage sẽ tạo một form mới chứa trường mà bạn chọn và hai trường nút nhấn, bao gồm nút đăng kí form (Submit) và nút nhập lại form (Reset).
Form mới được gán tới một điều khiển mặc định.
Thêm trường vào form
1. Tại FrontPage Editor, kích vào form muốn thêm trường.
2. Tại điểm chèn, tạo trường mới bằng cách thực hiện lệnh Insert/Form Field và chọn kiểu trường muốn tạo.
Thuộc tính của form
Tại Form muốn thay đổi thuộc tính, kích nút phải chuột và chọn lệnh Form
Properties, xuất hiện hộp hội thoại dùng để đặc tả những việc cần thực hiện với kết quả
của form đang chọn. Bạn có thể gửi kết quả tới một file của FrontPage web hiện thời, tới root web hoặc tới file hệ thống hoặc cũng có thể gửi kết quả tới một địa chỉ e-mail, một điều khiển form của FrontPage hoặc một form tự tạo.
Chú ý: Toàn bộ tuỳ chọn gửi kết quả form tới ISAPI tự tạo, NSAPIT, CGI, hoặc ASP
script đòi hỏi một máy chủ chạy FrontPage Server Extensions. Dưới đây là các tuỳ chọn của hộp hội thoại:
What to do with form results?
Dùng tuỳ chọn này để đặc tả hành động mà FrontPage thực hiện với kết quả trên form. - Send To: Sử dụng điều khiển form mặc định để gửi kết quả form tới một file trên
FrontPage web hiện tại, root web, trên hệ thống file của bạn hoặc tới một địa chỉ e-mail.
- File Name: Ban đầu, trường này hiển thị file chứa các thông tin cất giữ trên form
bằng một điều khiển form mặc định. File này được đặt tại folder _private của FrontPage web hiện tại.
- Để gửi kết quả form tới một file khác trên web hiện thời, gõ URL tương đối tới file đó, hoặc kích nút Browse để chỉ định file.
- Để gửi kết quả form tới một file trên root web, bạn phải dùng một folder đặc biệt _vti_log trên root web. Gõ URL tương đối tới file trong folder này, chẳng hạn như: /_vti_log/myresults.txt.
- Để gửi kết quả form tới một file trên hệ thống của bạn, gõ đường dẫn đầy đủ đến file, chẳng hạn như: c:\my_results\results.txt.
- Browse: Hiển thị hộp hội thoại Current Web, bạn có thể duyệt các folders trong
FrontPage web hiện tại để chọn file cất kết quả của form.
- E-mail Address: Gõ địa chỉ e-mail nếu bạn muốn gửi kết quả form đến.
- Send To Other: Nếu muốn gửi kết quả form tới điều khiển FrontPage hoặc điều
khiển tự tạo, chọn điều khiển bạn muốn dùng:
- Custom ISAPI, NSAPI, CGI or ASP Script: Gửi kết quả form tới một điều khiển
form tự tạo sử dụng một trong các phương thức này.
- Discussion Form Handler: Lưu trữ kết quả form từ nhóm thảo luận.
- Registration Form Handler: Cất kết quả của form đăng kí người sử dụng có thể
truy nhập dịch vụ Web của bạn.
- Options: Cấu hình điều khiển form được chọn.
- Form Name: Tên form.
- Target Frame: Trường Target liệt kê các frame để hiển thị kết quả form. Lưu ý
rằng nếu khơng có trang frame nào được tải, trình duyệt Web có thể tạo một cửa sổ mới để hiển thị kết quả form. Gõ tên của frame hoặc chọn nút Target Frame để chọn frame:
Hình 8.9.2:Thuộc tính Form
- Advanced: Hiển thị hộp hội thoại Advanced Form Properties, bạn có thể tạo và
sửa tuỳ chọn của các trường ẩn tại đây.
Sử dụng tạo form bằng Wizard
FrontPage hỗ trợ một chương trình giúp bạn tạo form dựa trên những loại thông tin mà bạn cần tổng hợp, gọi là Form Wizard.
- Thực hiện lệnh File/New, chọn Form Page Wizard. - Kích nút OK, chọn Next. Vào các thông số:
Page Title: Tiêu đề trang.
Chọn tên Target
Page URL: Địa chỉ trang.
- Chọn Next. Kích nút Add để thêm những thông tin cần tổng hợp.
- Select type of input to collect for select this question: Chọn các kiểu thông tin.
- Edit the promt for this question: Gõ lời nhắc cho thơng tin cần u cầu.
Hình 8.9.3:Tạo Form bằng Wizard
Dưới đây là các loại thông tin cần tập hợp và các thông số tương ứng của chúng:
Contact Information: Thông tin để liên hệ với người sử dụng
Lần lượt chọn các thông số cho thông tin cần liên hệ:
- Name:
Full: Tên đầy đủ First, Last: Họ và tên
First, Last, Middle: Họ, tên, đệm
- Title: Bí danh
- Organization: Tổ chức
- Postal Address: Địa chỉ theo đường bưu điện
- Work phone: Điện thoại nơi làm việc
- Home phone: Điện thoại ở nhà
- FAX: Số máy fax cần liên hệ
- E-mail Address: Địa chỉ e-mail
- Web Address: Địa chỉ trang Web cá nhân
- Enter the base name for this group of variables: Vào tên biến cho nhóm
Chọn kiểu thơng tin và gõ lời nhắc tương ứng
Account Information: Thông tin tài khoản của người sử dụng
Hình 8.9.4:Thơng tin tài khoảng người sử dụng Product Information: Thơng tin sản phẩm
Hình 8.9.5:Thơng tin sản phẩm Ordering Information: Thông tin về yêu cầu
Tên biến Chọn User name là một trường hay hai trường họ và tên
Yêu cầu vào lại mật khẩu hoặc không yêu cầu
Chọn tên sản phẩm từ danh sách hoặc gõ tên
Vào tên cơ sở cho nhóm biến Chọn thơng tin muốn tập hợp về mặt hàng như Mẫu mã Số hiệu...
Hình 8.9.5:Thơng tin u cầu
Số lượng tối đa của danh sách mặt hàng
Vào tên cơ sở của nhóm biến Chọn hình thức
thanh tốn là thẻ tín dụng hoặc tiền mặt
Địa điểm giao hàng
Chọn tên sản phẩm từ danh sách hoặc gõ tên
Vào tên cơ sở cho nhóm biến Chọn thông tin muốn tập hợp về mặt hàng như Mẫu mã Số hiệu...
Personal Information: Thông tin cá nhân
One of several options: Lựa chọn duy nhất trong tuỳ chọn
Hình 8.9.6: Thơng tin cá nhân
Any of several option: Một vài lựa chọn trong tuỳ chọn Boolean: Lựa chọn Có hoặc Khơng
Hình 8.9.7: Hộp lựa chọn checkbox
Date: Kiểu dữ liệu nhập vào là ngày
Range: Kiểu dữ liệu trên form là một miền các giá trị để chọn lựa Number: Dữ liệu nhập trên form là số
String: Dữ liệu nhập trên form là dòng text Paragraph: Dữ liệu nhập là text nhiều dòng 8
.11 Thêm thành phần của Form
Vào các nhãn trong danh sách tuỳ chọn
Chọn kiểu xuất hiện của tuỳ chọn
Vào tên biến chọn
Chọn kiểu xuất hiện Có/Khơng Vào tên biến
Trường là những khối được xây dựng trên form. Người sử dụng cung cấp thông tin thông qua các trường. Việc nhập dữ liệu này được xử lí bởi một điều khiển form nằm trên máy chủ Web khi người sử dụng đăng kí form.
Bạn tạo các trường trong FrontPage Editor bằng cách dùng lệnh Form Field trên thực đơn Insert, hoặc kích nút trên thanh cơng cụ form. Bạn có thể tạo các trường sau đây bằng FrontPage:
Hộp text chỉ có một dịng để người sử dụng gõ dữ liệu text trong đó.
Một hộp text cuộn nhiều dịng để người sử dụng có thể nhập các dịng text tại đó. Một nút là radio cho phép người sử dụng chỉ được chọn duy nhất bằng cách kích chuột vào nút này.
Nút là check box cho phép người sử dụng chọn nhiều tuỳ chọn bằng cách kích chuột vào nhiều nút check box.
Một thực đơn cuộn xuống cho phép người sử dụng có thể chọn từ một hay nhiều dịng thực đơn cùng một thời điểm.
Một nút nhấn cho phép người sử dụng đăng kí form hoặc khởi tạo lại trạng thái ban đầu của form.
Một trường ảnh hiển thị một ảnh trên form. Bằng cách kích chuột vào ảnh này, người sử dụng có thể đăng kí form.
Các trường của form được tạo cùng dòng với text của trang đang kích hoạt trên FrontPage Editor. Mỗi khi chèn một trường vào trang, FrontPage Editor coi nó như một kí tự. Ví dụ, nếu bạn kích chuột tại nút trái của trường và bắt đầu gõ nhãn cho nó, trường sẽ dịch chuyển về phía phải để tạo chỗ cho text vừa gõ xuất hiện. Nếu bạn nhấn Enter tại phía trái trường, trường sẽ chuyển xuống đầu dịng mới. Bạn có thể cắt, sao chép trường vào vùng đệm và dán chúng vào form (dùng các lệnh trên thực đơn Edit như: Copy, Cut, Paste.
Các thao tác với trường
Sao chép một trường
1. Tại FrontPage Editor, kích tại trường muốn sao chép. 2. Thực hiện lệnh Edit/Copy.
3. Kích chuột tại nơi muốn dán trường đã sao chép. 4. Thực hiện lệnh Edit/Paste.
Xóa một trường trên form
2. Nhấn phím Delete để xóa.
3. Kích nút phải chọn lệnh Cut để cắt trường.
Hiển thị trường xác nhận
Bạn hiển thị trường xác nhận bằng cách chèn trang xác nhận của form được điều khiển bởi một điều khiển form Save Results Form Handler, Discussion Form
Handler, hoặc Registration Form Handler.
1. Tại FrontPage Editor, mở trang xác nhận. 2. Thực hiện lệnh Insert/FrontPage Component.
3. Tại hộp hội thoại Insert FrontPage Component, chọn Confirmation Field và kích
OK, xuất hiện hộp hội thoại Confirmation Field Properties.
4. Tại hộp Name of Form Field To Confirm, gõ tên trường của form. 5. Kích OK.
Text Boxes
Tạo trường Text Box
1. Thực hiện lệnh Insert/Form Field và chọn One-Line Text Box. Nếu muốn tạo trường Text Box tại form hiện thời, đặt vị trí trỏ text trên form, nếu tạo trường này với form mới, đặt trỏ text ở ngoài các form đã định nghĩa.
2. Gõ nhãn trực tiếp cho trường trên form.
Chú ý: FrontPage Editor tạo trường text box với thuộc tính mặc định. Kích đúp tại
trường để thiết lập các thuộc tính cho nó.
Tạo trường mật khẩu
Một trường mật khẩu chính là trường text box, chỉ khác ở chỗ, dữ liệu text khi người sử dụng nhập tại trường này trên form khơng hiển thị trên màn hình. Khi một form chứa trường mật khẩu được đăng kí từ trình duyệt Web, tên và nội dung của trường text box được gửi tới điều khiển của form.
1. Tại FrontPage Editor, tại vị trí trỏ text, thực hiện lệnh Insert/Form Field/One- Line Text Box.
2. Kích chọn trường text box này.
3. Thực hiện lệnh Edit/Form Field Properties. 4. Tại trường Password Field, kích Yes.
5. Kích OK.
Thay đổi thuộc tính của trường text box
Bạn có thể thay đổi các thơng số sau của trường:
- Tên
- Giá trị khởi tạo
- Độ rộng của trường theo số kí tự
Name: Gõ tên của trường. Khi form được đăng kí, tên trường được gửi tới điều khiển form
cùng với giá trị của nó. Dĩ nhiên là tên này khơng hiển thị trên trang.
Initial value: Vào giá trị khởi tạo cho trường, giá trị này sẽ xuất hiện khi trang lần đầu
được đọc bởi trình duyệt Web.
Width in characters: Vào độ rộng của trường (tính bằng số kí tự).
Tab order: Vào giá trị để điều khiển thứ tự mà người sử dụng có thể dịch chuyển từ
trường này tới trường khác bằng cách nhấn phím Tab.
Chỉ có Internet Explorer 4.0 hoặc các phiên bản sau đó là hỗ trợ thuộc tính này. Nếu để trống, Internet Explorer 4.0 sẽ dùng thứ tự mặc định, giống như phiên bản trước của nó. Giá trị có thể được chấp nhận ở đây từ 1 đến 999. Nếu hai trường có cùng Tab order, trường được định nghĩa trước sẽ có ảnh hưởng bởi giá trị này. Giá trị –1 sẽ huỷ điều khiển của Tab order.
Password field: Kích Yes nếu là trường mật khẩu.
Validate: Kích vào nút này để mở hộp hội thoại Text Box Validation. Bạn sẽ hạn chế các
giá trị có thể nhập vào cho trường trên form tại hộp hội thoại này. Các tuỳ chọn của hộp thoại:
- Display Name: Đặc tả tên được dùng để hiển thị trên thơng điệp cảnh báo có giá
trị.
- Data Type: Chọn kiểu dữ liệu của trường: No Constraints
Text: Dữ liệu dạng text
Interger: Dữ liệu dạng số nguyên Number: Dữ liệu dạng số
Text Format: Phần này chứa những thiết lập giá trị được chấp thuận của trường dạng
text.
Kích Validate để hạn chế kiểu dữ liệu nhập vào
- Letters: Cho phép trường chứa kí tự chữ cái
- Digits: Cho phép trường chứa kí tự chữ số
- Whitespace: Cho phép trường chứa khoảng trắng, bao gồm dấu cách, tab,
dấu xuống dòng và dấu kết thúc dòng.
- Other: Cho phép trường chứa các kí tự khác bằng cách gõ các kí tự này tại
hộp Other.
Numeric Format: Phần này chứa những thiết lập cho dữ liệu dạng số nguyên và số.
Grouping: Chọn kí tự để dùng hiển thị số hoặc số nguyên.
- None: Trường dạng số khơng chứa các kí tự khác ngồi kí tự chữ số để hiển
thị, chẳng hạn như 123456789
- Comma: Trường chứa dấu phẩy, chẳng hạn 123,456,789
- Period: Trường chứa dấu chấm, chẳng hạn 123.456.789
Decimal: Nếu kiểu dữ liệu của trường là Number, bạn có thể đặc tả một kí tự được
dùng như dấu chấm thập phân:
- Comma: Chỉ định dấu phẩy hiển thị dấu chấm thập phân, chẳng hạn
123.456,789
- Period: Chỉ định dấu chấm làm dấu ngăn cách phần nguyên và thập phân,
chẳng hạn 123,456.789
Chú ý: Bạn khơng thể dùng cùng một kí tự để hiển thị dấu chấm thập phân và dấu ngăn
cách phần nghìn của trường số.
Data Length: Phần này chứa thiết lập độ dài của trường dữ liệu.
Required: Chọn check box để đặc tả dữ liệu được yêu cầu trong trường.
- Min Length: Đặc tả độ dài ngắn nhất của dữ liệu trên trường.
- Max Length: Đặc tả độ dài lớn nhất của dữ liệu trên trường.
Data Value: Phần này chứa những giá trị thiết lập cho bất kì kiểu dữ liệu nào.
Field Must Be: Chọn một trong các kiểu điều kiện để giới hạn dữ liệu sau:
- Less Than: Nhỏ hơn
- Greater Than: Lớn hơn
- Less Than Or Equal To: Nhỏ hơn hoặc bằng
- Greater Than Or Equal To: Lớn hơn hoặc bằng
- Equal To: Bằng
Value: Gõ giá trị giới hạn dữ liệu tương ứng với điều kiện ở trên. Ví dụ, nếu kiểu dữ liệu
là Interger, và Field Must Be là Greater Than, gõ 100 trong hộp Value có nghĩa là dữ