• inputRichText conflicts with Dynamic Tabs

    By Azamat Smagulov 1 decade ago

     

    Inserting inputRichText into dynamic tab container gives numerous errors when creating new tab (press"new" button in the example).

    First one is "couldn't find widget" which can be worked around with additional client javascript. The problem somehow doesn't appear when you add additional richtext widget to the main page outside of tab container, so i analyzed js that XPage gives me in both cases and simply included the lines that are different.

    The second problem i couldn't fix. When i press "new" it gives new error message pops up saying: "couldn't register id with <suppsedly-unique-id-for-my-richtext>, that id is already registered".

    What am i doing wrong?

    Xpage:

    <?xml version="1.0" encoding="UTF-8"?>

    <xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">

          <xp:this.resources>

                <xp:script src="/clientjs.js" clientSide="true"/>

          </xp:this.resources>

          <xe:djTabContainer id="djTabContainer1" tabPosition="top"

                style="width:100%; height:90%; margin:5px;" defaultTabContent="doc">

                <xp:this.facets>

                      <xe:djTabPane xp:key="doc" id="djTabPane2" title="New Document"

                            closable="true" partialEvents="true">

                            <xp:inputRichText id="inputRichText1"/>

                      </xe:djTabPane>

                </xp:this.facets>

          </xe:djTabContainer>

          <xp:button value="new" id="button1">

                <xp:eventHandler event="onclick" submit="false">

                      <xp:this.script><![CDATA[dijit.byId('#{id:djTabContainer1}').createTab()]]></xp:this.script>

                </xp:eventHandler>

          </xp:button>

    </xp:view>

     

    client.js:

     

     

     

     

     

    • Ok,found it

      By Philippe Riand 1 decade ago

      For the first error,you should not include the code in client.js, but rather add the dojo resource to your page. I cannot reproduce the issue within my environment, but maybe this is related to some later fix I already have.

      For the second error, this is a bug in XPages core. I don't know if this is a regression due to Dojo 1.6.1 or something older. We'll get in fix in 854 but, by the meantime, you can try to add this code to your page:

       

          &lt;xp:scriptBlock id=&quot;scriptBlock1&quot;&gt;</div>
      
          &lt;xp:this.value&gt;&lt;![CDATA[XSP.parseDojo = function x_pd(node){</div>
      
          &nbsp; &nbsp; if( node &amp;&amp; dojo.parser){</div>
      
          &nbsp; &nbsp; &nbsp; &nbsp; if(node.getAttribute(&#39;dojoType&#39;)){</div>
      
          &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dojo.parser.instantiate([node]);</div>
      
          &nbsp; &nbsp; &nbsp; &nbsp; } else {</div>
      
          <span style="font-family:courier new,courier,monospace;">&nbsp; &nbsp; &nbsp; &nbsp;  dojo.parser.parse(node);</span></div>
      
          &nbsp; &nbsp; &nbsp; &nbsp; }</div>
      
          &nbsp; &nbsp; }</div>
      
          }]]&gt;&lt;/xp:this.value&gt;</div>
      
          &lt;/xp:scriptBlock&gt;</div>
      

      That should temporarily this the problem.

  • that fixes this error,but there are more

    By Azamat Smagulov 1 decade ago

    Thank you for your fix. It works.

    But then i encountered a new problem which might be or not related to RichText (CKEditor module).

    This is fixed xpage which opens new tabs:








    if( node && dojo.parser){
    if(node.getAttribute('dojoType')){
    dojo.parser.instantiate([node]);
    } else {
    dojo.parser.parse(node);
    }
    }
    }]]>



    style="width:100%; height:90%; margin:5px;" defaultTabContent="doc">

    closable="true" partialEvents="true">









    But try to to open four tabs on it. It will crash with an error dijit.byId is null. Also happens randomly after some time.

     

    I tried to debug it, but couldn't figure out what's going on. It fails on string:

    var dj = dijit.byId(resp.id)

    in resources\web\extlib\dijit\Tabs.js from com.ibm.xsp.extlib.controls_8.5.3.20120320-1003.jar file.

  • still struggling with dynamic tab panel

    By Azamat Smagulov 1 decade ago

     

    An update cause this bug is getting rather critical.

    It happens when dynamic tab panel asks server to get id for a new tab to partial update this new tab pane and fill it with content. After that it may go two ways:

    1. Response id gets mangled (tab container's id repeated twice), like this (just did this after refresh and it came up immediately):

    view:_id1:djTabContainer1:djTabContainer1:djTabPane2:2232

    I circumvented it by hacking it like this:

    extlib.dijit.TabContainer.prototype.createTab=function(params) {
    if(params && params.tabUniqueKey) {
    var t
    dojo.forEach(this.getChildren(), function(item) {
    if(item.tabUniqueKey==params.tabUniqueKey) {t = item}
    })
    if(t){this.selectChild(t); return;}
    }
    var url = XSP.axGetRequestUrl(this.id,dojo.mixin({_action:"createTab"},params))
    if(url) {
    var _this = this;
    dojo.xhrGet({
    url: url,
    handleAs: "json",
    load: function(resp, ioArgs) {
    var ids=_this.id.split(":");
    if(ids.length>0){
    var lastid=ids[ids.length-1];
    resp.id=resp.id.replace(':'+lastid+':'+lastid,':'+lastid);
    }
    dojo.place("

    ",_this.containerNode,"last")
    var axOptions = {
    onComplete: function() {
    var dj = dijit.byId(resp.id)
    _this.addChild(dj)
    _this.selectChild(dj)
    }
    }
    XSP.partialRefreshGet(resp.id,axOptions)
    },
    error: function(err) {
    console.log(err)
    }
    });
    }
    };

    Underlined is my hack.

    Fix works for some time, but then there is

     

    2. Sometimes ajax query made in createTab function (the second one, line XSP.partialRefreshGet(resp.id,axOptions) )  is just never responded. And so new tabpane is never filled with content.

    Can it be related to sessions? Maybe they just expire and after that server denies ajax queries?

    I will try to provide more examples if needed.

    • another update

      By Azamat Smagulov 1 decade ago

      It appears to be not related to sessions.

      Here's fix that works for me so far:

      extlib.dijit.TabContainer.prototype.createTab=function(params) {
      if(params && params.tabUniqueKey) {
      var t
      dojo.forEach(this.getChildren(), function(item) {
      if(item.tabUniqueKey==params.tabUniqueKey) {t = item}
      })
      if(t){this.selectChild(t); return;}
      }
      var url = XSP.axGetRequestUrl(this.id,dojo.mixin({_action:"createTab"},params))
      if(url) {
      var _this = this;
      dojo.xhrGet({
      url: url,
      handleAs: "json",
      load: function(resp, ioArgs) {
      var ids=_this.id.split(":");
      if(ids.length>0){
      var lastid=ids[ids.length-1];
      resp.id=resp.id.replace(':'+lastid+':'+lastid,':'+lastid);
      }
      dojo.place("





      ",_this.containerNode,"last")
      var axOptions = {
      onComplete: function() {
      var dj = dijit.byId(resp.id)
      _this.addChild(dj)
      _this.selectChild(dj)
      }
      }
      XSP.partialRefreshGet(resp.id,axOptions)
      },
      error: function(err) {
      console.log(err)
      }
      });
      }
      };

      I added
      's inside newly created div. Apparently it does something, cause there's new "domNode is null" errors so far.

      I got this fix from:

      http://dojo-toolkit.33424.n3.nabble.com/Error-quot-this-domNode-is-null-quot-when-creating-tabs-declaratively-td2081982.html#a2089196

      • minimal testcase

        By Azamat Smagulov 1 decade ago

        I have prepared minimal xpage that should reproduce the problem(s) for you.

        http://pastebin.ca/2306776

        I am not using views so just this one xpage should be enough.

        To reproduce: create a few documents, open them. Then wait. An hour or more.

        After that opening document should result in "domnode is undefined" problem.

        Please look into it.