Wrap text in Table cell

AnithaB
AnithaB used Ask the Experts™
on
Hi,

I have a table where the data in a particular cell to be wrapped at 15th character.

I tried the option of <td width=15 > but it won't work.

I need the text to wrapped at every 15th character.
 The  text contains spaces.

 For example : The text  in the Tabel cell is like this
" PO box No 345677 Reference information".
 
I need the above text to be wrapped like this.
PO BoX No 34567
7 Reference Inf
mation
 The Text comes from a database.(TD is databound)


I'm looking for any javascript .

Any help would be greatly appreciated.

Thanks
Anita
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
you can use CSS

<td><div style="width:10pt; word-wrap: break-word;"> asldkjf alsdk jfalskasdf asdf asldfja a</div></td>


If you can use serverside
this should work for you

http://www.php.net/wordwrap
Top Expert 2013

Commented:
<script type="text/javascript">
function formatStr(EL)
{
   strbuff=EL.innerHTML;
   newstr='';
   startI = 0;
   subsarr=new Array(strbuff.length/7+1);
   for (i=0;i<subarr.length;i++)
   {
      subarr[i]=strbuff.substr(startI,7);
      startI+=7;
   }
   for (i=0;i<subarr.length-1;i++)
   {
      newstr+=subarr[i]+'<br />';
   }
   str+=subarr[subarr.length-1];
   EL.innerHTML=str;
}
</script>
   

Cd&

Author

Commented:
Hi Cd&

Can you please explain your script with comments

Thanks
Anita
Build an E-Commerce Site with Angular 5

Learn how to build an E-Commerce site with Angular 5, a JavaScript framework used by developers to build web, desktop, and mobile applications.

Top Expert 2013
Commented:
<script type="text/javascript">
function formatStr(EL)
// the EL is the target element passed fron the invokin process in the form:
// document.getElementById('idofelement');
{
   strbuff=EL.innerHTML;
// takes the content of the eleemtn and puts it into a string
   newstr='';
   startI = 0;
   subsarr=new Array(strbuff.length/15+1
// creates an array with a length that will hold all 15 character segments + the final bit.
// in the earlier versio I was using 7 which is incorrect 15 is the required size
   for (i=0;i<subarr.length;i++)
   {
      // this loop creates 15 character substrings an put them in anarray
      subarr[i]=strbuff.substr(startI,15);
      startI+=15;
   }
   for (i=0;i<subarr.length-1;i++)
   {
      // this loop creates a new string by concatenating the elements in the array
      // with an HTML line break tag between each segment
      newstr+=subarr[i]+'<br />';
   }
   str+=subarr[subarr.length-1];
     // the final segement is append outside to loop to avoid an extra linefeed
   EL.innerHTML=newstr;
    // the content of the target element is replaced with the new string
}
</script>
   

Generally something like this would be called from the onload even of the body tag:

<body onload="formatStr(document.getElementById('thecell'))">

Where the cell is tagged like: <td id="thecell">content</td>

Cd&

Author

Commented:
Hi Cd&,
 
Thank You vey much. It's wroking great. I need to do couple of changes in your script.

subsarr=new Array(strbuff.length/15+1) // replaced by
subarr=new Array(parseInt(strbuff.length/15+1))

// because strbuff.length/15+1 results in a floating value and array must have finite integer value. // subsarr replaced by subarr

newstr='';
 startI = 0;
str=''; // declare variable for str otherwise compile error.

 I also modified the above script to make it general

formatStr(EL,maxchars)
maxchars is the no of characters per line or the nth character at which wrapping to be done. Here is the same script

function formatStr(EL,maxchars)
// the EL is the target element passed fron the invokin process in the form:
// maxchars is no of characters per line or the nth character at which text to be wrapped. For Ex At 15th character//
// document.getElementById('idofelement');
{
   strbuff=EL.innerHTML;
// takes the content of the eleemtn and puts it into a string
   newstr='';
   startI = 0;
   max=maxchars;
   str='';
   subarr=new Array(parseInt(strbuff.length/max+1));
// creates an array with a length that will hold all max character segments + the final bit.
// in the earlier versio I was using 7 which is incorrect 15 is the required size
   for (i=0;i<subarr.length;i++)
   {
      // this loop creates max character substrings an put them in anarray
      subarr[i]=strbuff.substr(startI,max);
      startI+=max;
   }
   for (i=0;i<subarr.length-1;i++)
   {
      // this loop creates a new string by concatenating the elements in the array
      // with an HTML line break tag between each segment
      newstr+=subarr[i]+'<br />';
   }
   str+=subarr[subarr.length-1];
     // the final segement is append outside to loop to avoid an extra linefeed
   EL.innerHTML=newstr;
    // the content of the target element is replaced with the new string
}

<body id="body" onload="formatStr(document.getElementById('tdRef1'),15)">
      
    <form id="Form1" method="post" runat="server">
<table border=2>
<tr><td id="tdRef1">Refer for other application and contain
</td></tr>
</table>

     </form>
      
  </body>
</HTML>


Thanks again . I accept your answer. Please let me know how to assig points to you.

Anita



Author

Commented:
Hi Cd&,

in continuation to the above I have another question . How to implement the same functionality for a repeater control.

 In my web page I'm using a repeater to display data which consists of table and text in some of the cells to be wrapped

Thanks
Anitha
Top Expert 2013

Commented:
Just call the function from the event that fires the repeater event handler.

to assign points just click the accept button next to the comment you want to make the answer, and it will bring up the grading screen.

Cd&
Top Expert 2013

Commented:
Glad we could help.   Thanks for the A. :^)

Cd&

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial