How to underline a text using regular expression in Javascript

I have a text like this

var string = "Hello This is a test: I'm testing
                    Hello This is a second test: I'm testing"

I want to underline the text before ":"  like in the above example "Hello This is a test:" should have a underline
vmandemAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Pui_YunCommented:
Hi vmandem,
I'm not sure if this is what you are looking for, but you should be able to use this  to develop what you want, if you are rendering the text onto the web page.

Hope this helps.
P.
<html>
<head>
    <title>test</title>
    <script language="javascript" type="text/javascript">
    function mytest()
    {
    		var string = "Hello This is a test: I'm testing\nHello This is a second test: I'm testing"
        document.getElementById("divTest").innerHTML = string.replace(/^(.*?)(?=\:)/g, "<u>$1</u>");
    }
    </script>
</head>
<body onload="mytest()">
<div id="divTest">
</div>
</body>
</html>

Open in new window

0
käµfm³d 👽Commented:
Like this?
var string = "Hello This is a test: I'm testing
                    Hello This is a second test: I'm testing";

string = string.replace(/^([^:]+)/, "<u>\1</u>");

Open in new window

0
Pui_YunCommented:
You can script it directly in the html like so as well.

P.
<html>
<head>
    <title>test</title>
    
</head>
<body>
<script language="javascript" type="text/javascript">
    		var string = "Hello This is a test: I'm testing\nHello This is a second test: I'm testing"
        document.write(string.replace(/^(.*?)(?=\:)/g, "<u>$1</u>"));
</script>
</body>
</html>

Open in new window

0
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

vmandemAuthor Commented:
I used the replace function as you mentioned. I'm writing a sepearte javascript file and all my functions are there. I call the javascript file inmy html page.

The result I'm getting is : <u>Hello This is a test:</u>
IT IS NOT UNDERLINED BUT WITH THE TAGS AROUND <u></u>. WHAT COULD BE WRONG.
0
Pui_YunCommented:
The tag <u> underlines the text that are between the opening and closing tag in html.  If you read the html as text, you will see <u>Hello This is a test</u>.  When the web browser displays this, the text between the <u> tags are underlined and you shouldn't see the tags.

Hope this helps.
P.
0
käµfm³d 👽Commented:
Where are you expecting this underlined text to be displayed? In an editor? If so, which one? In a browser? The above code should be adequate. In a specific application? If so, which one?
0
vmandemAuthor Commented:
I'm writing the returned string to an excel file. The text is displayed as explained above in the excel column.
0
vmandemAuthor Commented:
I also tried by having alert of the return string and in fact it shows the same as <u></u> around the text.
0
käµfm³d 👽Commented:
Can you post the code where you are writing to Excel?
0
vmandemAuthor Commented:
HERE IS THE CODE I'M WRITING TO EXCEL . Note oWS is an excel object.

if (strOverallComments != "") {
          oWS.Cells(i, 14).value = RemoveHtml(strOverallComments);
          oWS.Cells(i, 14).Font.Bold = true;
      }

MY JAVASCRIPT FUNCTION
function RemoveHtml(s){
if(s== null){
}
else
{
var strreplacefinal = "";
strrelacefinal = s;
strreplacefinal = strreplacefinal.replace(/^(.*?)(?=\:)/g, "<u>$1</u>");
alert(strreplacefinal);

return strreplacefinal;

}
}


0
käµfm³d 👽Commented:
Try something like:
if (strOverallComments != "") {
	RemoveHtml(oWS.Cells(i, 14));
	oWS.Cells(i, 14).Font.Bold = true;
}

function RemoveHtml(xlCell) {
	if (xlCell == null) {
		return;
	}
	else {
		substrLen = xlCell.value.indexOf(':');
		xlCell.Characters(0, substrLen).Font.Underline = 2;
	}
}

Open in new window

0
vmandemAuthor Commented:
kaufmed, I forgot to mention that my string always dont have ":" and I don't have to underline in that case.
How does the function changes based on this.
0
käµfm³d 👽Commented:

if (strOverallComments != "") {
	RemoveHtml(oWS.Cells(i, 14));
	oWS.Cells(i, 14).Font.Bold = true;
}

function RemoveHtml(xlCell) {
	if (xlCell == null) {
		return;
	}
	else {
		substrLen = xlCell.value.indexOf(':');

		if (substrLen > 0)
		{
		    xlCell.Characters(0, substrLen).Font.Underline = 2;
		}
	}
}

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
vmandemAuthor Commented:
Thank You very much. I got it working the way you said. I promise this is my last question
I have text in the string contains: "This is a test: hello
                                                       This is a test: hello"

The code is underlining only the first line but does not do the second line in the same string. Please give me an idea of how to do that. I appreciate.
0
vmandemAuthor Commented:
Kaufmed, can you please answer my last comment.
0
käµfm³d 👽Commented:
I wasn't avoiding you....   I was working on it but had to leave work.

Try the following (yes, I had to revert back to regex):
function RemoveHtml(xlCell) {
	if (xlCell == null) {
		return;
	}
	else {
		var re = new RegExp(/^[^:]+/gm);
		var matches;
		var adjust = 0;

		while (matches = re.exec(xlCell.value))
		{
			alert(re.lastIndex);
			alert(matches[0].length);
			xlCell.Characters(re.lastIndex - matches[0].length + adjust, matches[0].length).Font.Underline = 2;
			adjust = 1;
		}
	}
}

Open in new window

0
käµfm³d 👽Commented:
You can remove those alerts...   I was testing  :)
0
vmandemAuthor Commented:
Thank You. I will try and let you know.
0
vmandemAuthor Commented:
kaufmed, two things I have on your latest function

first one is that I also have ";" (Semi Colon's) not just : (colon) as you know the users are crazy and I tried to change the regular expression that you have like below but it doesn't seems to be working.
var re = new RegExp(/^[^:][^;]+/gm);

Second thing is that with the function I'm getting underline even for the string that don't have either
colon or semicolon.

PLEASE LET ME KNOW WHAT IT COULD BE
0
käµfm³d 👽Commented:
Try this:
function RemoveHtml(xlCell) {
	if (xlCell == null) {
		return;
	}
	else {
		if (xlCell.value.indexOf(':') > 0 || xlCell.value.indexOf(';') > 0)
		{
			var re = new RegExp(/^[^:;]+/gm);
			var matches;
			var adjust = 0;

			while (matches = re.exec(xlCell.value))
			{
				xlCell.Characters(re.lastIndex - matches[0].length + adjust, matches[0].length).Font.Underline = 2;
				adjust = 1;
			}
		}
	}
}

Open in new window

0
vmandemAuthor Commented:
Finally it worked. Thank You.

I'M GOING TO OPEN A DIFFERENT QUESTION that I have a question on that. Can you please help me on that. Since I'm new to Javascript I'm a learner.
0
käµfm³d 👽Commented:
Sorry, didn't see the question quick enough, but it looks like someone has provided the answer  :)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.