Bold String in TextArea using JS

Question

I am auto populating text in a text area based on a value selected from a ddl.

Now I can get the text to appear, but I would like that text to be bold.

I have this:

$(document).ready(function () { $('#activityID').change(function () { var selectedActivity = this.options[this.selectedIndex].parentNode.label; var text = "Event Name: \nEvent Location: \nEstimated # of Participants:" var result = text.bold(); if (selectedActivity === "DEMONSTRATIONS") { $('#Summary').val(result); } else if (selectedActivity !== "DEMONSTRATIONS") { $('#Summary').val(""); } }); });

In the TextArea it is rendering as:

<B>Event Name: Event Location: Estimated # of Participants:</B>

Is there any possible way to get this text to render as bold when that specific item is chosen from the DDL?

I have referenced this but this did the same thing as above.

Any help is appreciated.

Are you trying to format all text in the text area? Or selectively format it? — jwatts1980
– jwatts1980, Commented May 25, 2016 at 18:33
A basic textarea does not support selective formatting. You would need a plugin to make it support rich text. — jwatts1980
– jwatts1980, Commented May 25, 2016 at 18:33
NOTE: string.bold() is deprecated and shouldn't be used. See: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… — gen_Eric
– gen_Eric, Commented May 25, 2016 at 18:33
Of relevance to the link posted by @Gunther34567 : caniuse.com/#search=contenteditable — jwatts1980
– jwatts1980, Commented May 25, 2016 at 18:36

mbsquid · Accepted Answer · 2016-05-25 19:21:42Z

What he said above, but quote the word bold:

var result = $("<span>").text(text).css({ 'font-weight': 'bold' });

Or better yet, apply a CSS class to the field and associate that class with bold in your css files.

var result = $("<span>").text(text).addClass('mybold');

And in your css:

span.mybold: { font-weight: bold; }

kvn · Accepted Answer · 2016-05-26 07:30:30Z

If you want the text to appear bold, you should be changing the CSS properties of the element.

var result = $("<span>").text(text).css({ 'font-weight': 'bold' });

This should solve your problem.

Collectives™ on Stack Overflow

Bold String in TextArea using JS

2 Answers 2

Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Linked

Related