tags:

views:

17

answers:

0

Im using jquery to make an ajax call to a php file. That php file spits back html for display. The problem is when it spits back the display, which includes html code for table cells, the design is broken. The cells dont line up, in fact all the table cells become one big row. Here is the html on the page that is making the ajax call:

              <table class="table" cellspacing="0" width="100%">
            <thead>
              <tr>
                <th scope="col" width="30%">Row1</th>
                <th scope="col" width="10%">Row2</th>
                <th scope="col" width="15%">Row3</th>
                <th scope="col" width="15%">Row4</th>
                <th scope="col" width="12%">Row5</th>
                <th scope="col" width="18%">Row6</th>
              </tr>
            </thead>
                <tbody id="showlist"></tbody>
            </table>

I then call the php script via ajax and tell it to populate the return results into #showlist. The problem as mentioned above is when I do this its all messaged up, the cells dont line up correctly. The output from the php script would be just the for each row. It works if I remove the ajax call and just do the build out on the same page. Just when I call the page via ajax the layout gets messed up.