Skip to content
This repository has been archived by the owner on Jun 21, 2023. It is now read-only.

IE11 table bindObject render error #66

Open
edwardsayer opened this issue Oct 7, 2018 · 3 comments
Open

IE11 table bindObject render error #66

edwardsayer opened this issue Oct 7, 2018 · 3 comments

Comments

@edwardsayer
Copy link

I just create a simple test for binding json array with html table rows.
It works as expected in other browsers but not in IE.
please check the jsfiddle for detail.
Thanks!

@gr0uch
Copy link
Owner

gr0uch commented Oct 10, 2018

Is there any error stack trace that you can show me? My guess is that you are using a <template> tag which isn't even supported in IE. You can work around this by using a <div> or anything other than <template> instead.

I don't have access to a VM with IE11 at the moment. As far as I know, it should be working in Edge.

@edwardsayer
Copy link
Author

edwardsayer commented Oct 11, 2018

@daliwali
It's not all about template tag, i can use div style='display:none' as template tag to work around this.
You can check the new jsfiddle for example.
The major issue with IE11 is it shift output cell in the second row.
img

for example, the following template:

  <div id="temp" style="display: none">
    <table>
      <tr>
        <td>name</td>
        <td>age</td>
      </tr>
      <tr class="rows">
        <td><span class="name">name</span></td>
        <td><span class="age">name</span></td>
      </tr>
    </table>
  </div>

In IE11, the rendered result is:

<table>
  <tbody>
    <tr>
      <td>name</td>
      <td>age</td>
    </tr>
    <tr class="rows">
      <td><span class="name">boy</span></td>
      <td><span class="age">17</span><span class="age">18</span></td>
    </tr>
    <tr class="rows">
      <td></td><span class="name">girl</span>
      <td></td>
    </tr>
  </tbody>
</table>

While in other browser, the correct result is rendered:

<table>
  <tbody>
    <tr>
      <td>name</td>
      <td>age</td>
    </tr>
    <tr class="rows">
      <td><span class="name">boy</span></td>
      <td><span class="age">17</span></td>
    </tr>
    <tr class="rows">
      <td><span class="name">girl</span></td>
      <td><span class="age">18</span></td>
    </tr>
  </tbody>
</table>

I really like simulacra and wish to use it in my client projects. but due to IE11 is STILL widely used in enterprise enviroments...

@gr0uch
Copy link
Owner

gr0uch commented Oct 11, 2018

Hmm, that is extremely odd behavior. I'll try to investigate it in more detail when I get access to IE11.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants