Member Avatar for Designer_101

Hi,

Im just starting to use the codeIgniter framework and Im developing a blog application. However I need a textarea where the user can change text to bold or change the colour just by selecting it and clicking a button above the area.

Much like the daniweb reply form but I don't want the html or bb code to actually appear to the user.

Is there any name for this technique that I can google? Any opensource stuff? Software? Advice on how to start coding it?

Seriously, anything would be helpfull haha!

Many thanks :)

  • 3 Contributors
  • 2 Replies
  • 932 Views
  • 18 Hours Discussion Span
  • Latest Post Latest Post by raju_boini525

Dani AI

Generated

This is the classic WYSIWYG / rich-text-editor pattern: you do not use a plain <textarea> if you want per-selection styling (bold, color, fonts) without showing HTML or BBCode to the user. Browsers expose an editable surface through the contentEditable attribute (or older iframe designMode), and most editors replace or wrap your form control to give a toolbar + styled view. See the browser docs for contentEditable and an example product page for a popular editor. (developer.mozilla.org)

As pointed out, there are framework plugins (Moorte for MooTools), and mentioned editors like FCKeditor/TinyMCE. Today the common, maintained options are full-featured editors such as CKEditor, TinyMCE, or lighter modular editors like Quill — each supports toolbar formatting and inline editors if you want the DaniWeb-style reply experience. Evaluate them by size, API, accessibility, and how easy they are to customize. (ckeditor.com)

If you build your own toolbar, use a contentEditable element and the Selection/Range APIs to apply DOM-level styling. Historically document.execCommand() was used to implement toolbar actions, but the API is deprecated and can be unreliable across browsers — that is one reason many projects prefer tested libraries or direct DOM manipulation with careful undo/redo handling. If you do implement features yourself, test paste behavior, mobile editing, and the undo stack thoroughly. (developer.mozilla.org)

Always sanitize and validate the HTML you accept from the editor before storing or rendering. Use a vetted client-side cleaner like DOMPurify and a server-side sanitizer for PHP such as HTMLPurifier (or equivalent) and follow the OWASP XSS prevention guidance — never trust raw editor output. In short: pick a maintained editor, wire it to your form, sanitize on the server, then iterate on UX (inline vs modal, toolbar options, fonts/colors). (dompurify.com)

Recommended Answers

All 2 Replies

Member Avatar for raju_boini525

fckeditor, tinymca are most useful for you. search on google as fckeditor or tinymca editors.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.