Solved

add a break after every 4th character?

Posted on 2006-07-07
32
340 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
  • 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:adilkhan
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
 
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:adilkhan
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:adilkhan
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:adilkhan
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:adilkhan
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
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
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:adilkhan
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:adilkhan
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

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
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…

746 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

12 Experts available now in Live!

Get 1:1 Help Now