Member Avatar for farashh

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 kvprajapati because: Added [code] tags.
  • 4 Contributors
  • 5 Replies
  • 280 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by farashh
Member Avatar for hericles

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.

Member Avatar for kvprajapati

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>
Member Avatar for Sarama2030

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.

Member Avatar for hericles

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

Member Avatar for farashh

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

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.