2011-02-03 26 views
8

Trong CMS của chúng tôi, người dùng của chúng tôi có thể chỉnh sửa thông báo lỗi cho các biểu mẫu bằng TinyMCE. Vấn đề là, một số thông báo này có thể yêu cầu dữ liệu động, ví dụ: "Your chosen name 'X' is invalid".Làm cách nào để tạo thành phần tử trong trình chỉnh sửa TinyMCE được coi là một mục không thể chỉnh sửa?

Để thực hiện việc này, chúng tôi đang sử dụng mã thông báo. Sử dụng ví dụ trên làm ví dụ, người dùng của chúng tôi sẽ nhập "Your chosen name '{name}' is invalid" và nó sẽ được thay thế khi hiển thị.

Tôi hiện đang viết một plugin cho TinyMCE để giúp người dùng quản lý các mã thông báo này tốt hơn. Họ sẽ nhấp vào biểu tượng, chọn một mã thông báo từ danh sách được xác định trước và nó sẽ tự động được chèn vào nội dung.

Sự cố Tôi có cách mã thông báo này được xử lý trong trình chỉnh sửa nội dung. Hiện tại, nó chỉ là văn bản có thể được chỉnh sửa, nhưng những gì tôi muốn làm là làm cho TinyMCE coi nó là một phần tử duy nhất để nó có thể được loại bỏ, di chuyển, nhưng không thể chỉnh sửa mã thông báo thực tế.

Tôi đã thử sử dụng plugin noneditable bằng cách gói mã thông báo trong một khoảng với lớp mceNonEditable nhưng điều này không hoạt động như mong đợi, ví dụ: bạn không thể xóa lùi mã thông báo, nếu mã thông báo ở cuối nội dung bạn không thể nhập sau đó, v.v.

Vì vậy, để làm rõ, điều tôi muốn là TinyMCE để xử lý một số văn bản giống như một hình ảnh. Nó sẽ là một khối rắn, a.k.a. được coi là một ký tự/phần tử.

Điều này có khả thi không?

Cảm ơn bạn.

Trả lời

17

Sau khi thử khoảng 100 công việc khác nhau xung quanh, chúng tôi cuối cùng đã tìm thấy một giải pháp hoạt động (cho nhu cầu của chúng tôi anyway).

Chúng tôi đang chèn nút bị vô hiệu hóa với tất cả các kiểu được xóa. Ví dụ:

<input type="button" class="token" value="my token" disabled="disabled" /> 

Và sau đó thêm một số mã vào onGetContent() để chuyển đổi đầu vào thành văn bản thuần túy.

giải pháp này, mặc dù không phải là rất tao nhã,

  1. Làm cho cư xử dấu hiệu như một ký tự đơn/item.
  2. Làm cho nó chỉ đọc.
  3. Năng động trong ngữ cảnh của trình chỉnh sửa để chúng tôi có thể hiển thị văn bản mã thông báo của mình.

Chỉnh sửa: Đây là những gì chúng tôi đã kết thúc.

enter image description here

+0

+1 không phải là hình ảnh mà là một loại thẻ khác như mã thông báo thay thế – Thariama

+0

Tôi thích ý tưởng này :) – Kaitnieks

+0

Khi tôi di chuyển hoặc sao chép và dán nút, nó sẽ mất thuộc tính lớp của nó. Bạn đã trải nghiệm điều này/biết cách giải quyết chưa? – supertrue

0

Là người lập trình băng-vịt, tôi phải hỏi - bạn không thể sử dụng hình ảnh? Tôi nghĩ TinyMCE đã sử dụng biểu tượng mặt cười, có thể bạn có thể thay thế những người có "elementies" và cho phép khách hàng chèn chúng và lưu chuyển đổi thành thẻ.

+0

Chúng tôi có thể, và đó là một lựa chọn dự phòng chúng tôi đang cân nhắc, nhưng sau đó chúng ta sẽ phải tạo ra một hình ảnh cho mỗi thẻ như chúng ta muốn các văn bản thẻ thực tế là nội tuyến trong trình soạn thảo. –

+0

Ngoài ra còn có một plugin mà theo người sáng tạo "làm việc nhiều hơn hoặc ít hơn". http://sourceforge.net/tracker/index.php?func=detail&aid=2519211&group_id=103281&atid=738747 – Kaitnieks

+0

Mặc dù ý tưởng hay, plugin đó không đủ mạnh. Nó chỉ đơn giản là chạy một số mã trên mỗi phím bấm, mà nếu bạn đủ nhanh, bạn có thể vượt qua. Xem câu trả lời của tôi, đó là mạnh mẽ hơn và làm việc cho chúng tôi. –

0

Bạn có thể sử dụng thẻ hình ảnh làm mã thông báo. Sử dụng nút giao diện người dùng thông tin để chèn hình ảnh này sẽ hoạt động nếu bạn thay thế nó sau khi người dùng đã gửi biểu mẫu thông báo lỗi. Ví dụ các thẻ hình ảnh bạn chèn có thể trông như thế này

<img src="../image/token1.gif" class="token1"> 

Bằng cách này bạn chỉ cần thay thế hình ảnh thẻ với lớp token1 sau khi nộp/lưu.

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