0

Hi
I am trying to repeat <div> several times
because I have a table and the design of each "2" rows is repeated.
Is this possible? or there is another way?

the scribt I am using is:

<table class="style1" dir="ltr" >
            <script type = "text/javascript">

                var rows = 10; // the value will be taken from DB later
                for (var i = 0; i < rows; i++) {//
                    document.write('<div class= \"msgDiv\">');
                    document.write('<tr><td>Patient\sUserName</td><td> X </td></tr> '+
                     '<tr><td> System\'sResult</td><td>'+ i +'</td></tr>');
                     document.write('</div>');//something isn't working well><
                }
               </script> 
        </table>

the problem is that the <div> is repeated 10 times and the cells are created but each in separate location

Edited by __avd: Added [code] tags.

4
Contributors
5
Replies
6
Views
6 Years
Discussion Span
Last Post by farashh
0

This is probably because div is a block element, it doesn't want to aline things side by side. Add display: inline-block to your css for the divs and they should start to line up properly.

0

Try this,

<script type="text/javascript">
   window.onload=function()
   {
      var tab1=document.getElementById("tab1");

      for(i=1;i<=10;i++)
       {
         var bdy=document.createElement("tbody");
         
         bdy.innerHTML="<div><tr><td>Patients's UserName</td><td> X 

</td></tr><tr><td>System'sResult</td><td>"+ i +"</td></tr></div>"; 
         tab1.appendChild(bdy);

       }
   };
</script>

<body>
   <table id="tab1" border="1"></table>
</body>
0

I think the problem is that you're using <tr><td> without nestinfg them in a table. I think rows and collumns should only be used in tables.try

<table><tr><td></td></tr></table>

see if it works.The alternate could be to nest multiple <div>s inside one main <div> and then positioning them in css.

0

Sarama2030, there is quite clearly a <table> element at the start and a </table> element at the end. The OP is using document.write to insert the code between those two tags

0

thanx to all,
but still it seems it does not work
"adatapost" what you did showed the table
"but what i did in css is completly ignored in google chrome and believe me you do not want to see the result in IE9"

I am thinking to change the table idea and us 2 <p> instead. i hope it will work

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.