12 Replies - 2776 Views - Last Post: 07 September 2012 - 08:25 PM

#1 izic  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 197
  • Joined: 15-January 09

Javascript string character manipulation

Posted 05 September 2012 - 01:16 PM

I'm trying to get a user to enter a fisrt and last name all together and then I'll take first name and print it to the screen. Is the correct way to do this going through each character until I reach a whitespace? If so, should I use an array?

<!DOCTYPE html>
<html>
<head>
<script>

var fullname = prompt("Enter your full name","fullname");

var headingname; 
var namemessage; 
var namegreeting; 

document.write("Mr. " + fullname + "</br>");
document.write("</br>"); 
document.write("Your first name is " + fullname); 
document.write("</br>"); 
document.write("</br>"); 
document.write("How are you " + fullname); 

</script>
</head>
<body>

</body>
</html> 


Is This A Good Question/Topic? 0
  • +

Replies To: Javascript string character manipulation

#2 CasiOo  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1414
  • View blog
  • Posts: 3,136
  • Joined: 05-April 11

Re: Javascript string character manipulation

Posted 05 September 2012 - 01:43 PM

You could use the methods indexOf(searchvalue,start) and substring(from, to) to get the first name and last name
First find the first index of a space, then substring the variable twice to get first and last name
Was This Post Helpful? 1
  • +
  • -

#3 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 129
  • View blog
  • Posts: 834
  • Joined: 25-October 08

Re: Javascript string character manipulation

Posted 06 September 2012 - 07:37 AM

Alternatively, you could use a split() command.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

var fullname = prompt("Enter your full name","Enter your fullname [First Last]");

document.write("Your full name is " + fullname + "</br>");
document.write("<p />"); 
document.write("Your last name is " + fullname.split(' ')[1]); 
document.write("<p />"); 
document.write("How are you " + fullname.split(' ')[0])+'?'; 

</script>
</head>
<body>

</body>
</html> 


:bananaman:
Was This Post Helpful? 1
  • +
  • -

#4 izic  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 197
  • Joined: 15-January 09

Re: Javascript string character manipulation

Posted 06 September 2012 - 08:09 AM

View PostJMRKER, on 06 September 2012 - 08:37 AM, said:

Alternatively, you could use a split() command.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

var fullname = prompt("Enter your full name","Enter your fullname [First Last]");

document.write("Your full name is " + fullname + "</br>");
document.write("<p />"); 
document.write("Your last name is " + fullname.split(' ')[1]); 
document.write("<p />"); 
document.write("How are you " + fullname.split(' ')[0])+'?'; 

</script>
</head>
<body>

</body>
</html> 


:bananaman:


Thank you! I appreciate it!
Was This Post Helpful? 0
  • +
  • -

#5 CasiOo  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1414
  • View blog
  • Posts: 3,136
  • Joined: 05-April 11

Re: Javascript string character manipulation

Posted 06 September 2012 - 01:37 PM

the downside of using the split method is that you will have to concat name[1] ... name[name.length] ;)
Was This Post Helpful? 0
  • +
  • -

#6 izic  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 197
  • Joined: 15-January 09

Re: Javascript string character manipulation

Posted 06 September 2012 - 01:38 PM

I'm now trying to get the initials for the full name. I can get the first letter in the last name but not the first name. This is the code I'm using:

How can I modify the numbers to get the first initial?

var initials = fullname.substring(0,1)+fullname.substring(0,7);


Full code
<!DOCTYPE html>
<html>
<head>

<center>
<script>
var message = "Greetings from CSC314 Class."; 
document.write(message.fontcolor("purple").fontsize(6)); 
</script>
</center>

<script type="text/javascript">

var fullname = prompt("Enter your first and last name");
var namelength = fullname.split(' ')[1].length + ", ".length + fullname.split(' ')[0].length;
var initials = fullname.substring(0,1)+fullname.substring(0,7);

document.write("</br>");
document.write("Last name:  " + fullname.split(' ')[1].fontcolor("orange") + "," + "</br>");
document.write("<p />"); 
document.write("First name: " + fullname.split(' ')[0].fontcolor("blue")); 
document.write("<p />"); 
document.write("Traditional writing:  " + fullname.fontcolor("red"));
document.write("<p />"); 

document.write("Formal writing: " + fullname.split(' ')[1].fontcolor("green") + ", " + fullname.split(' ')[0].fontcolor("green"));
document.write("<p />"); 

document.write("Your initials: " + initials);
document.write("<p />");

document.write("The length of your name(in formal writing) is: " + namelength);
</script>
</head>
<body>

</body>
</html> 

Was This Post Helpful? 0
  • +
  • -

#7 CasiOo  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1414
  • View blog
  • Posts: 3,136
  • Joined: 05-April 11

Re: Javascript string character manipulation

Posted 06 September 2012 - 02:04 PM

JMRKER gave you a bad habit right there. You do not want to split the same string on the same criteria multiple times, just split it once and save the array.

var tokens = fullname.split(' ');
var firstName = tokens[0];
var lastName = tokens[1];
alert(firstName.charAt(0)); //Gets the first character of the firstName string
alert(lastName.charAt(0)); //Gets the first character of the lastName string



The above code can't handle mutiple last names for example Peter Smith Johnson. I would still use substring :P
Was This Post Helpful? 0
  • +
  • -

#8 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 129
  • View blog
  • Posts: 834
  • Joined: 25-October 08

Re: Javascript string character manipulation

Posted 06 September 2012 - 02:28 PM

View PostCasiOo, on 06 September 2012 - 02:37 PM, said:

the downside of using the split method is that you will have to concat name[1] ... name[name.length] ;)


Not really, the fullname still contains the concat results. Alternatively, you could also use join() to connect the array elements.

And, the initial request did not require initials or more than 2 (first last) name entries.
Obviously, I would recommend a different alternative when all the requirements are given,
not just changed as OP thinks of newer things.

If there is really a requirement for "prefix firstname middle_initial lastname suffix"
I would not use split() nor would I use the substrings().
For those conditions my recommendation would have been to input seperate fields or seperate prompts.

This post has been edited by JMRKER: 06 September 2012 - 05:37 PM

Was This Post Helpful? 0
  • +
  • -

#9 CasiOo  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 1414
  • View blog
  • Posts: 3,136
  • Joined: 05-April 11

Re: Javascript string character manipulation

Posted 06 September 2012 - 02:46 PM

the fullname still contains the concat results. What do you mean by that?
Yes I already wrote you will have to concat the strings if you use split, therefore it is a downside.

I don't know why you are arguing with me about this?
Was This Post Helpful? 0
  • +
  • -

#10 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 129
  • View blog
  • Posts: 834
  • Joined: 25-October 08

Re: Javascript string character manipulation

Posted 06 September 2012 - 05:44 PM

I don't see any arguments here. Just offering alternative methods for OP to decide if they are useful to them. However if the requirements change from post to post, then the answers or suggestions provided might also need to be altered.
Was This Post Helpful? 0
  • +
  • -

#11 izic  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 197
  • Joined: 15-January 09

Re: Javascript string character manipulation

Posted 07 September 2012 - 07:13 PM

Thank you guys for all your help once again but one last thing. I'm trying to get the user to submit his first and last name in the blue html textbox form instead of the alert/popup box that shows up. Any ideas how to do this?

<!DOCTYPE html>
<html>
<head>
<body>
<p><h7>Please enter your name: </h7></p>
<input type="text" style="background-color: RoyalBlue; border:3px solid blue;"" id="mytextbox" value=" " />
</body> 
<center>
<script>

document.write("<p>");
var message = "Greetings from CSC314 Class."; 
var textbox = document.getElementById('mytextbox');

document.write(message.fontcolor("purple").fontsize(6)); 
</script>
</center>

<script type="text/javascript">

var fullname = prompt("Enter your first and last name");
var initials = "";
var wordArray = fullname.split(" "); 
var namelength = fullname.split(' ')[1].length + ", ".length + fullname.split(' ')[0].length;

for(var i=0;i<wordArray.length;i++) 
{     
     initials += wordArray[i].substring(0,1); 
} 

document.write("</br>");
document.write("Last name:  " + fullname.split(' ')[1].fontcolor("orange") + "," + "</br>");
document.write("<p />"); 
document.write("First name: " + fullname.split(' ')[0].fontcolor("blue")); 
document.write("<p />"); 
document.write("Traditional writing:  " + fullname.fontcolor("red"));
document.write("<p />"); 

document.write("Formal writing: " + fullname.split(' ')[1].fontcolor("green") + ", " + fullname.split(' ')[0].fontcolor("green"));
document.write("<p />"); 

document.write("Your initials: " + initials.fontcolor("brown"));
document.write("<p />");

document.write("The length of your name(in formal writing) is: " + namelength);
document.write("<p />");
</script>
</head>
</html> 

Was This Post Helpful? -1
  • +
  • -

#12 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 129
  • View blog
  • Posts: 834
  • Joined: 25-October 08

Re: Javascript string character manipulation

Posted 07 September 2012 - 08:21 PM

View Postizic, on 07 September 2012 - 08:13 PM, said:

Thank you guys for all your help once again but one last thing. I'm trying to get the user to submit his first and last name in the blue html textbox form instead of the alert/popup box that shows up. Any ideas how to do this?


Trying to use most of your code, slightly re-arranged...

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

function processInput() {
  var fullname = document.getElementById('mytextbox').value;
  var wordArray = fullname.split(" "); 
  var namelength = fullname.split(' ')[1].length + ", ".length + fullname.split(' ')[0].length;
  var initials = '';  for (var i=0;i<wordArray.length;i++) { initials += wordArray[i].substring(0,1); } 
  var str  = '';
      str += "</br>";
      str += "Last name:  " + fullname.split(' ')[1].fontcolor("orange") + "," + "</br>";
      str += "<p />"; 
      str += "First name: " + fullname.split(' ')[0].fontcolor("blue"); 
      str += "<p />"; 
      str += "Traditional writing:  " + fullname.fontcolor("red");
      str += "<p />"; 
      str += "Formal writing: " + fullname.split(' ')[1].fontcolor("green") + ", " + fullname.split(' ')[0].fontcolor("green");
      str += "<p />"; 
      str += "Your initials: " + initials.fontcolor("brown");
      str += "<p />";
      str += "The length of your name(in formal writing) is: " + namelength;
      str += "<p />";
  document.getElementById('greetings').innerHTML = str;
}
</script>
</head>
<body>
<center>
<p><h7>Please enter your name (First Last): </h7></p>
<input type="text" style="background-color: RoyalBlue; border:3px solid blue;"
 id="mytextbox" value="Alfred Newman"  onblur="processInput()" />
<p />
<h1 style="color:purple">Greetings from CSC314 Class.</h1>
</center>
<div id="greetings"></div>
</body>
</html> 


:bananaman:
Was This Post Helpful? 1
  • +
  • -

#13 izic  Icon User is offline

  • D.I.C Head

Reputation: -2
  • View blog
  • Posts: 197
  • Joined: 15-January 09

Re: Javascript string character manipulation

Posted 07 September 2012 - 08:25 PM

Thank you man, you're a life saver! I owe you one!
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1