Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
New DIV in IWGrid HTML code.
#1
Hi

A new DIV has been added to the IWGrid HTML code. The new DIV has no ID property.

This error caused more problems than we first thought.
In our own javascript we have prepared for the new DIV.
However, older IE browsers have an IW error: "IWBase.js (6.17889) - Cannot retrieve id property that has an undefined or null reference"


IW15.1.4:
Code:
<div CLASS="tblpanel tbllist" ID="MENUGRID" style="overflow-x: auto; overflow-y: auto; "><table cellpadding="0" cellspacing="0" id="TBLMENUGRID" style="">
<thead></thead>
<tbody>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu1</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu2</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu3</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu4</td></tr></tbody></table></div>

IW15.1.5:
Code:
<div CLASS="tblpanel tbllist" ID="MENUGRID" style="overflow-x: auto; overflow-y: auto; "><div style=""><table cellpadding="0" cellspacing="0" id="TBLMENUGRID">
<thead></thead>
<tbody>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu1</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu2</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu3</td></tr>
<tr><td class="okmenuitem" style="white-space: nowrap; height: 24px; "> Menu4</td></tr>
</tbody></table>
<script data-type="iw" nonce="ea3sd5wF7k7Ggc1Al/7JT/tOxgs" type="text/javascript">
var tbl = IW.$("TBLMENUGRID");
if (tbl) {
    tbl.style.cssText += tbl.style.cssText;
  }
</script></div></div>


TBLIWGRID's parentNode is not an IWGRID but an anonymous div.

The v15.1.4 and v15.1.5 HTML codes were generated from the same source code.
The script in v15.1.5 HTML code was not written by us.

Can somebody help me?

best regards
brsoft
Reply
#2
Hi Alexandre
Hi Kudzu

IWGrid HTML code changed in iw15.1.5.
Since you did not respond to my question, I investigated the problem ..

Example:
1. Put IWgrid1 in IWRegion1. (If IWGrid1 is on form, then no problem.)
HTML:
<div CLASS="IWREGION1CSS IWCLIPCONTROL" ID="IWREGION1"><form class="iw_default_submit_form">
<div CLASS="IWGRID1CSS" ID="IWGRID1"><table border="1" cellpadding="0" cellspacing="0" id="TBLIWGRID1" width="300"><caption>IWGrid1</caption>
<thead>
<tr><td>&nbsp;</td></tr></thead>
<tbody></tbody></table><script data-type="iw" nonce="d0TtOwQxz0/25eZAve+/R8fjVgI" type="text/javascript">
 var tbl = IW.$("TBLIWGRID1");
 if (tbl) {
    tbl.style.cssText += tbl.style.cssText;
  }
</script></div></form></div>

2. IWGrid1.UseFrame: = True
HTML:
<div CLASS="IWREGION1CSS IWCLIPCONTROL" ID="IWREGION1"><form class="iw_default_submit_form">
<div CLASS="IWGRID1CSS" ID="IWGRID1" style="border-width: 2px; border-style: inset; overflow-x: auto; overflow-y: auto; padding: 0; "><div style="font-weight: normal; font-style: normal; font-size: 13px; text-decoration: none;"><table border="1" cellpadding="0" cellspacing="0" id="TBLIWGRID1" width="100%"><caption>IWGrid1</caption>
<thead>
<tr><td>&nbsp;</td></tr></thead>
<tbody></tbody></table><script data-type="iw" nonce="HQUPRq5+bP+LqjdKgN6Abs0tf1g" type="text/javascript">
 var tbl = IW.$("TBLIWGRID1");
 if (tbl) {
    tbl.style.cssText += tbl.style.cssText;
  }
</script></div></div></form></div>

3. IWGrid1.Font.Enabled: = False
HTML:
<div CLASS="IWREGION1CSS IWCLIPCONTROL" ID="IWREGION1"><form class="iw_default_submit_form">
<div CLASS="IWGRID1CSS" ID="IWGRID1" style="border-width: 2px; border-style: inset; overflow-x: auto; overflow-y: auto; padding: 0; "><div style=""><table border="1" cellpadding="0" cellspacing="0" id="TBLIWGRID1" width="100%"><caption>IWGrid1</caption>
<thead>
<tr><td>&nbsp;</td></tr></thead>
<tbody></tbody></table><script data-type="iw" nonce="fHP+aQd1G4vboPFJqlhcEutscgs" type="text/javascript">
 var tbl = IW.$("TBLIWGRID1");
 if (tbl) {
    tbl.style.cssText += tbl.style.cssText;
  }
</script></div></div></form></div>


Why is a new div (without ID) appearing in iw15.1.5?
Will it remain so in the future?

Please reply (with at least one number):
1. The next version will include the patch
2. We did it intentionally, this is the future
3. ... we don't understand the problem


Thanx
brsoft
Reply
#3
A div (or any other DOM element) without an id is not an error nor a problem, unless you are trying to do something with it via its ID.

This page of this forum where you read my answer contains dozens of divs without ID an any other attribute. They are just containers.

Can you elaborate when you get the error you mentioned?

Quote:However, older IE browsers have an IW error: "IWBase.js (6.17889) - Cannot retrieve id property that has an undefined or null reference"
Reply
#4
Hi Alexandre,

I agree with you, if you are not working with Grids in javascript in real time, it will not be a problem for you to see an unidentified DIV sometimes appear.
We work with Grids in real time ...

So these problems are:

1. New Div problem.
IWGrid HTML - Before iw15.1.5: IWGRID1 is the parentNode of TBLIWGRID1.
IWGrid HTML - iw15.1.5: Sometimes there is an new DIV between TBLIWGRID1 and IWGRID1.

I had to modify the screen manager javascript.
Now again, it works fine.
My Question: Why is there a new DIV? More precisely, sometimes it is, sometimes it is not?

2. Error with older IE
- iw15.1.5. before there was no problem
- iw15.1.5 error
- the source code is the same
- IE versions tested: (11.737.17763.0), (11.3143.14393.0), 11.775.17763.0)
- other browsers have no errors

Error text: Unable to get property 'id' of undefined or null reference.
File: IWBase.js (Atozed javascript)
Code: if (C === document.activeElement.id && document.hasFocus ())
I've attached screenshots.

3. Conclusion.
The two problems occurred with the same IW version.
I consider the relationship between errors to be possible.


Since government agencies are still using IE 11, we have returned to iw15.0.24

regards
brsoft


Attached Files Thumbnail(s)
           
Reply
#5
Regarding (2) seems to be caused by a IE issue when accessing activeControl. It is fixed in our code base and next version will contain the fix.

Regarding (1), I'm still confused about the nature of your problem...

We did several changes to the grid rendering in order to make it  more friendly to be used in conjunction with other JS libraries like DataTables and others. However I don't recall such change regarding the DIV.

Besides that, lets consider how the grid is built from HTML:


Code:
<div ID="Name-of-your-IWGRID-component">
    <table id="TBL+Name-of-your-IWGRID-component">
      <--! here goes the grid content -->
    </table>
</div>


In case your grid component is named MyGrid, here is what we will have:


Code:
<div ID="MYGRID">
    <table id="TBLMYGRID">
      <--! here goes the grid content -->
    </table>
</div>


Now, let's say in a future version we decide do include one or more divs surrounding the table tag, like this:

Code:
<div ID="MYGRID">
   <div>
      <div>
          <table id="TBLMYGRID">
              <--! here goes the grid content -->
          </table>
      </div>
   </div>
</div>


it doesn't make any difference, does it? The key elements here (and the only ones that actually matter) are the outer div and the inner table, which can always be accessed through their IDs which won't change.
Reply
#6
Hi Alexandre,

First of all, thank you for correcting the "IE error". We are waiting for the new version.

Secondly, I think we think differently about using IWGrid.
You are right about static rendering. But...

Your example:
<div ID="MYGRID">
    <table id="TBLMYGRID">
      <--! here goes the grid content -->
    </table>
</div>

Other aspects:
- MYGRID has style (border, background, etc.) scaled to external components and TBLMYGRID content.
- TBLMYGRID is transparent, scaled to MYGRID.
- We want a responsive display
- We use the MYGRID == TBLMYGRID.parentNode relation in javascript.

Our well-used javascript functions for years have been disturbed by the appearance of new DIVs. But as I wrote, we have solved this problem.

We don't understand what the new div is good for? Mainly because sometimes it is, sometimes it is not.
If something has no advantage but caused some problems, the end result is negative. Smile

Regards
brsoft
Reply
#7
Hi. Do a simple test in IW 15.1.5, move your IWDBGrid -> Css TO IWDBGrid -> InnerTableCss

Breaking change: New IWGrid property InnerTableCss. When set, IW will render class attribute for inner table using the property value
from here: https://www.atozed.com/2019/09/15-1-5-h/
Reply
#8
Hi Jose Nilton Pace,

Thank you for joining the dialogue.
I suggest you try this:
- Create a blank form
- Put an IWGrid on it.
- Enter css and InnerTableCss propertics (for example: css = "origcss", innerTablecss: = "innercss")
- Check the generated HTML code:

<div CLASS="origcss" ID="IWGRID1"><table border="1" cellpadding="0" cellspacing="0" class="innercss" id="TBLIWGRID1" width="100%"><caption>IWGrid1</caption>
<thead>
<tr><td>&nbsp;</td></tr></thead>
<tbody></tbody></table><script data-type="iw" nonce="ZswBfxKVUQz4mxtPm2etPACc2LU" type="text/javascript">
 var tbl = IW.$("TBLIWGRID1");
 if (tbl) {
    tbl.style.cssText += tbl.style.cssText;
  }
</script></div>

Check it out: No new div in HTML code.
The value of "innerTableCss" is in the table.

If you have some time, read my second comment in this post. I highlighted the new div in red and gave the terms of its creation:
1. if IWGrid is not directly on the form but in an IWRegion.
2. if IWGrid.UseFrame = True;
3. If IWGrid.font.Enabled = False then style = "" in the new div.


Regards
brsoft
Reply
#9
> - We use the MYGRID == TBLMYGRID.parentNode relation in javascript.

The problem relies on this fact above. You are relying on an implementation detail to make it work.

As I said before, all you need to do is applying your specific style to the 2 elements which have well established IDs (and this didn't change). If there is an intermediate node between your those 2 nodes, that's irrelevant for all meaningful purposes.

Can you please show why it is important to you to have this parent<->child relationship to make it work?

I'll give you a true example of how the internal design shouldn't change anything like that:

Previous version 14.0.x didn't render <thead></thead><tbody></tbody>. This was introduced because some JS grid styling libraries require that. It was introduced transparently and I'm not aware of any customer who had issues with it.

Because they don't rely on the fact that the parent of a <tr> tag was some specific tag. If they had assumed this, it would break, of course, when I introduced a <thead> tag in between.

As I mentioned since my first response:

If you need to interact with 2 tags which are clearly identified by their IDs, use the IDs and not the parent<->child relation ship. It should (and actually is) irrelevant for styling, responsiveness, etc.



(10-09-2019, 04:22 PM)brsoft Wrote: Hi Alexandre,

First of all, thank you for correcting the "IE error". We are waiting for the new version.

Secondly, I think we think differently about using IWGrid.
You are right about static rendering. But...

Your example:
<div ID="MYGRID">
    <table id="TBLMYGRID">
      <--! here goes the grid content -->
    </table>
</div>

Other aspects:
- MYGRID has style (border, background, etc.) scaled to external components and TBLMYGRID content.
- TBLMYGRID is transparent, scaled to MYGRID.
- We want a responsive display
- We use the MYGRID == TBLMYGRID.parentNode relation in javascript.

Our well-used javascript functions for years have been disturbed by the appearance of new DIVs. But as I wrote, we have solved this problem.

We don't understand what the new div is good for? Mainly because sometimes it is, sometimes it is not.
If something has no advantage but caused some problems, the end result is negative. Smile

Regards
brsoft
Reply
#10
Hi Alexandre,
thank you very much for your reply.

I have already written that we have solved the problem, no big deal.
“I had to modify the screen manager javascript.
Now again, it works fine. "

More:
- TBLIWGRID1 must be scaled to changing content after the OnRender event. IWGRID must be adjusted to the changed TBLIWGRID size.
- We use javascript, not IWASync functions.
- We haven't changed these javascript for years. However, it had to be modified after IW15.1.x.
- We didn't understand the meaning of IW's new feature.

Thanks again for working on my problem.

regards,
brsoft
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)