Solved

Coldfusion Bind

Posted on 2014-03-11
7
412 Views
Last Modified: 2014-04-09
I know you can use Coldfusion bind in a form field with something like this
 
<cfform >
 <cftextarea richtext="true" name="textName" skin="silver"
    toolbar="basic" height="300" Width="500"/>
    <br>
    <cftextarea  name="comment" bind=" {textName.text}" height="300" Width="500" />
</cfform>

Open in new window


but every time it shows in the comment field it shows the HTML code, is there a way to do this and it just show the information without the HTML code?

Im trying to have a editor on the side but it shows the changes in my template
0
Comment
Question by:overcolor
7 Comments
 
LVL 50

Expert Comment

by:Ryan Chong
ID: 39922730
I believe you mean to show "HTML" in your text area element?

I think you probably need to use a 3rd party HTML editor component in your script.

For examples:

http://ckeditor.com/
http://premiumsoftware.net/cleditor/
0
 
LVL 52

Expert Comment

by:_agx_
ID: 39923487
(no points. I don't have an answer ...)

@Chong Yit Seng - FYI: In case you are not familiar with <cftextarea richtext="true" ..> it is a thin wrapper that already incorporates the older FCKeditor

@overcolor - It might help others to clarify what you mean by "just show the information without the HTML code?" For example, if this were the base entry:

       form.textName => This is an example of <strong>bold text</strong>

Do you mean show the plain text, without any html tags? ie

       form.comment  => This is an example of bold text

... OR display the rendered html?

       form.comment  => This is an example of bold text
0
 
LVL 4

Expert Comment

by:Rodrigo Munera
ID: 39923939
To add on to what _agx_ was saying:

Yes, ckeditor is a newer version of the richtext="true" implementation of cftextarea.

But basically what's happening is:

your "textName" cftextarea element has richtext="true" on it, which means that everything you write in it will have html code in it.

When you bind the content of "textName" into "comments" cftextarea, you're asking the "comments" area to use the exact same contents as "textName".

To have both elements identical there are several options.

1. Make richtext="true" on both cftextarea elements
2. Remove richtext="true" from both elements
3. Use something like jQuery's text() to strip the tags off of the content (http://api.jquery.com/text/) off of textName when binding it into comments.
4. for something that only targets specific tags, you can write regex to selectively remove tags (http://stackoverflow.com/questions/13140043/how-to-strip-html-tags-with-jquery) off of textName when binding it into comments.
0
Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

 

Author Comment

by:overcolor
ID: 39924223
_agx_

That is what I'm trying to do

 display the rendered html?

       form.comment  => This is an example of bold text

 I'm hoping to build this so they can make edits to the text on one side of the page with the cftextarea and it displays the rendered output on the other side of the page
0
 
LVL 4

Expert Comment

by:Rodrigo Munera
ID: 39925042
Add richtext="tree" to the comments cftextarea.
0
 

Accepted Solution

by:
overcolor earned 0 total points
ID: 39926946
I got it

<cfdiv bind="{textName}"></cfdiv>
0
 

Author Closing Comment

by:overcolor
ID: 39936363
this will solve the issue
0

Featured Post

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
execute script based on HTML event 7 23
Problem to refer to value 8 45
Using jQuery to set a DIV attribute on page load 9 29
ajaxSubmit is giving me an error 1 35
OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

813 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now