2012-05-11 25 views
13

Tôi đang cố tạo một biểu mẫu web có nhiều giai đoạn. Tôi đang vẽ nó ra khỏi biểu mẫu web gắn cờ Stack Overflow/Stack Exchange. Vấn đề là, tôi không chắc chắn làm thế nào để kích hoạt hành động "giai đoạn tiếp theo".Làm cách nào để tạo biểu mẫu web nhiều giai đoạn?

Để minh họa, nếu bạn muốn gắn cờ câu hỏi trên Stack Overflow, bạn nhấp vào flag và sau đó cửa sổ bật lên sẽ nhắc bạn thực hiện lựa chọn. Nếu bạn chọn tùy chọn thứ hai ("nó không thuộc về đây, hoặc nó là một bản sao"), biểu mẫu tự động đưa bạn đến màn hình thứ hai.

màn hình đầu tiên:

page-one

Sau khi nhấp chuột, nó tự động chuyển hướng đến:

page-two

Vấn đề là tôi không biết những gì kích hoạt cơ bản là. Làm cách nào để nhấp vào nút radio đó gửi người dùng cuối tới màn hình tiếp theo?

Tôi đã thử kiểm tra nguồn gốc, nhưng tôi có cảm giác tôi chỉ nhìn thấy một nửa bức tranh:

page-source

Không có số lượng hướng dẫn HTML tôi thấy có bất kỳ ví dụ thực hành tương tự như sau. Tôi nghi ngờ đây là JavaScript, nhưng tôi không thể tìm thấy tệp .js được liên kết sẽ kích hoạt các tác vụ này.

Vì vậy: Biểu mẫu web tự động chuyển hướng khi nhấp chuột như thế nào? Theo dõi, nếu nó đang sử dụng JavaScript, có cách khắc phục chỉ HTML/CSS mà tôi có thể sử dụng không?

+0

Như tôi đã nói, tôi nghi ngờ đây là ma thuật đen JavaScript, trong trường hợp này: Tôi cần thêm jQuery. Mà tôi không biết. – Aarthi

+2

bạn có thể sử dụng jquery hoặc nhiều ajax modal popup, thêm autopostback vào nút radio, khi được chọn hoặc bấm nút ẩn và hiển thị mẫu phương thức thích hợp. –

+3

Là nhân viên SE, bạn không thể đi đến nguồn và hỏi người lập trình? Hay họ là một nhóm khét tiếng, khét tiếng? – j08691

Trả lời

7

Có thể giúp bạn suy nghĩ về điều này ở mức thấp hơn khung công tác. Có hai cách để tạo ra một biểu mẫu nhiều giai đoạn.

Cách thứ nhất (và thường là cũ hơn) là lưu trữ trạng thái trên máy chủ. Mỗi giai đoạn của biểu mẫu thực sự là một biểu mẫu riêng biệt và tiến trình của khách hàng thông qua bảng câu hỏi được lưu trữ trên máy chủ (ví dụ như một phần của dữ liệu phiên).

Cách thứ hai (cái hiện đại hơn) là sử dụng JavaScript, như bạn nghi ngờ. Thực tế có rất ít ma thuật màu đen trong trường hợp này và không có tự động chuyển hướng trên các nhấp chuột. Tất cả những gì bạn làm là có một dạng rất dài nơi bạn hiển thị/ẩn một số phần tử tùy thuộc vào lựa chọn của người dùng (tất nhiên, bạn có thể có nhiều phần tử <form> mà bạn hiển thị/ẩn).

0

Vâng, tôi muốn sử dụng một số loại plugin jQuery wizard và điều chỉnh nó theo nhu cầu của tôi. Tôi đã làm nó rất gần đây và nó không phải là khó khăn. Bạn nên thử SmartWizard 3.0, nó khá tích cực, bản phát hành cuối cùng khoảng 2 tháng trước và các lập trình viên trả lời các câu hỏi của tôi khá nhanh.

Ở đây là: https://github.com/mstratman/jQuery-Smart-Wizard

Bạn có thể kích hoạt các thuật sĩ để tiến tới bước tiếp theo liên kết sự kiện vào hành động của cách nhấn vào nút radio.

Chúc may mắn :)

Các vấn đề liên quan