Solved

add a break after every 4th character?

Posted on 2006-07-07
32
346 Views
Last Modified: 2008-02-01
I have a long string.. I would like to write out this string with a break after every 4th character or so.
Example:
"123456789123456789"

it would need to be displayed:
"1234"
"5678"
"9123"
"4567"
"89"
0
Comment
Question by:nywebsol
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 16
  • 7
  • 6
32 Comments
 
LVL 10

Accepted Solution

by:
Nushi earned 250 total points
ID: 17060706
<html>

<script>
var SIZE = 4;
var SPACE ="<br>";

function addSpaces( obj ){
      var reply="";
      for (ind=0; ind<obj.value.length; ind++){
            reply += obj.value[ ind];
            if ( (ind % SIZE) == 0){
                  reply += SPACE;
                  }
            }
      document.getElementById('output').innerHTML=reply;
}

</script>

<input type="text" value="12341234123412341234" onkeyup="addSpaces(this)">
<br>
<br>
<span id="output">
      Change the text in the box to see output
</span>
<br>
</html>

Nushi.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17060710
Can even be done in nicer way using regExp.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17060891
I believe it should be..

<html>

<script>
var SIZE = 4;
var SPACE ="<br>";

function addSpaces( obj ){
     var reply="";
      obj1 = obj.value.split("")
     for (ind=0; ind<obj1.length; ind++){
          reply += obj1[ind];
          if ( (ind % SIZE) == 0){
               reply += SPACE;
               }
          }
     document.getElementById('output').innerHTML=reply;
}

</script>

<input type="text" value="12341234123412341234" onkeyup="addSpaces(this)">
<br>
<br>
<span id="output">
     Change the text in the box to see output
</span>
<br>
</html>
0
PeopleSoft Has Never Been Easier

PeopleSoft Adoption Made Smooth & Simple!

On-The-Job Training Is made Intuitive & Easy With WalkMe's On-Screen Guidance Tool.  Claim Your Free WalkMe Account Now

 
LVL 10

Expert Comment

by:Nushi
ID: 17060915
I dont see why u modified my soluton.
it wors pefectly.
 i see the cahnge - but why?

0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17060923
Better Yet use this..

<html>

<script>
var SIZE = 4;
var SPACE ="<br>";

function addSpaces( obj ){
     var reply="";
      obj1 = obj.value.split("")
     for (ind=0; ind<obj1.length; ind++){

          if ( ind % SIZE == 0 && ind>0){
               reply += SPACE;
               }
                      reply += obj1[ind];
          }
     document.getElementById('output').innerHTML=reply;
}

</script>

<input type="text" value="12341234123412341234" onkeyup="addSpaces(this)">
<br>
<br>
<span id="output">
     Change the text in the box to see output
</span>
<br>
</html>
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17060931
i tested yours Nushi, its Shows undefined onkeyup event.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17060965
tested on IE and mozilla.
workded for me.

Wors fine even if teh text field is empty.

Nushi.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17060994
onkeyup i am getting the following output..

undefined
undefinedundefinedundefinedundefined
undefinedundefinedundefinedundefined
undefinedundefinedundefinedundefined
undefined


you not converting textbox value into array, maybe thats why my browser is bugging.
I am on IE 6.0
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061015
see it now. you right.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061022
needs to be charAt[]
and 0 check
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061051
The fixed one is:

<script>
var SIZE = 4;
var SPACE ="<br>";

function addSpaces( obj ){
     var reply="";
     for (ind=0; ind<obj.value.length; ind++){
          if ( ind>0 && (ind % SIZE) == 0){
               reply += SPACE;
               }
          reply += obj.value.charAt(ind);
          }
     document.getElementById('output').innerHTML=reply;
}

</script>

<input type="text" value="12341234123412341234" onkeyup="addSpaces(this)">
<br>
<br>
<span id="output">
     Change the text in the box to see output
</span>
<br>
</html>



Nushi.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17061074
yea, your solution with do it with charAt. with mine i just modified yours into and array and with a 0 Check:)
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061103
i tested in firefox -> and with IE view.
For some reason it did not switch to IE.
When i open in IE saw the 'undefined'
Nushi.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061419
Check this:



      document.write("123456789123456789".replace(/(\w{4})/g,"$1<br>"));



0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061484
That what i suggested. to use regExp- one line of code as i commented above :-)

So the combined answer will be (with thanks to Zvonko):

<html>

<input type="text" value="12341234123412341234" onkeyup="document.getElementById('output').innerHTML=this.value.replace(/(\w{4})/g,'$1<br>')">
<br>
<span id="output">
     Change the text in the box to see output
</span>
</html>

Nushi.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061518
Sorry, I did look only at your loopings and thought: what they are doing! :)
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061527
see the second comment :-))
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061534
Since most people are not good with RegExp i prefer to write full function for them
In this way its easier to modify it later if the need to do so something else.

Nushi.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17061593
You right Nushi, my RegExp is weak as well. please explain wut $1 means.

Thanks
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061603
$1 means the first token u find
the \w = word
{4} = 4 occurences of any part of word

Nushi.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061610
forgot the 'g'
g=global search (seacrh in all the string)

Nushi.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061611
I see.
I learned yesterday a new word: tsabar. Are you tsabar?  :)
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061619
yep.

Where di you hear it from :-)

Nushi.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 17061636
so "4" first occurance of any 4 words is the Token #1, next 4 Token #2?

Thanks for explaination.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061641
From my teacher: Gila :)
She cannot pronounce my name and called me: Zeew!
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061679
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061746
:-))

Where do you learn hebrew Z?
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 17061850
In Munich.
But I am Makedonian. I learn Iwrit only to read Tanach.
0
 
LVL 10

Expert Comment

by:Nushi
ID: 17061886
:-))
cool, and gl
(ggod luck).
0

Featured Post

Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

Question has a verified solution.

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

Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
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…
Suggested Courses

751 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