1. #1
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    122
    Vote Rating
    0
    kalebwalton is on a distinguished road

      0  

    Default Re-render BasicDialog with different content

    Re-render BasicDialog with different content


    I may be missing something but it seems like the BasicDialog's constructor-style initialization is not very conducive to re-rendering with a different DOM source.

    I'd like to pop up a BasicDialog with a loading indicator in the body area until an AJAX request returns a snipet of HTML to be used as the new contents of the BasicDialog (via DomTemplate). It looks like I'm going to have to recreate a portion of the BasicDialog constructor code to accomplish this.

    Is there a better way?

  2. #2
    Ext User
    Join Date
    Mar 2007
    Posts
    177
    Vote Rating
    1
    Domitian is on a distinguished road

      0  

    Default


    Couldn't you just reset the value of the innerHTML of the dialog box to the HTML you received after loading has complete. For example

    Code:
    getEl('dialog-center').dom.innerHTML = "text presented to user"

  3. #3
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    122
    Vote Rating
    0
    kalebwalton is on a distinguished road

      0  

    Default


    That doesn't help with the header or footer. Also, I may want it to auto-tab the new content, etc.

    I may put in a request that the various bits of logic are encapsulated within methods so they can be called individually. For example if there was:

    Code:
    render : function(el) {
      // Render the passed in el
    }
    We could easily re-render the existing BasicDialog with a different element without doing too much magic. It'd be nice to also be able to pass in a DomTemplate instead of an element.

  4. #4
    Ext Premium Member BernardChhun's Avatar
    Join Date
    Mar 2007
    Location
    Quebec, Canada
    Posts
    831
    Vote Rating
    2
    BernardChhun will become famous soon enough

      0  

    Default


    what I've been using for a while for the creation of dynamic BasicDialog is the autoCreate config parameter like so:

    Code:
    basicDialog = new YAHOO.ext.BasicDialog("", {
    autoCreate:true, 
    modal:true, 
    width:600, height:300, 
    shadow:true, resizable: false, 
    proxyDrag: false, shim:true, title:'myTitle' });
    using the reference to the BasicDialog you can get to the dynamically created body, header or footer like this:
    Code:
    getEl(basicDialog.body.id);
    getEl(basicDialog.header.id);
    getEl(basicDialog.footer.id);
    to overwrite the body of the dynamic BasicDialog with a template just do so:
    Code:
    yourTemplate.overwrite(basicDialog.body.id);

  5. #5
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    122
    Vote Rating
    0
    kalebwalton is on a distinguished road

      0  

    Default


    Thank you for the response but it's still doesn't quite hit the mark that I'm trying to hit.

    I understand that I can hook in and directly manipulate the DOM but wouldn't it be nice if we could simply redraw the BasicDialog using the same exact logic that Jack does without having to copy/paste the logic ourselves or destroy/recreate the BasicDialog?

  6. #6
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    122
    Vote Rating
    0
    kalebwalton is on a distinguished road

      0  

    Default


    I'd like to be able to do something like this:

    Code:
    var dlg = new BasicDialog('myEl', myCfg);
    dlg.show();
    then

    Code:
    dlg.redraw('myNewEl');
    or

    Code:
    var tpl = new YAHOO.ext.Template('...some html...');
    dlg.redraw(tpl);

  7. #7
    Ext Premium Member BernardChhun's Avatar
    Join Date
    Mar 2007
    Location
    Quebec, Canada
    Posts
    831
    Vote Rating
    2
    BernardChhun will become famous soon enough

      0  

    Default


    Quote Originally Posted by kalebwalton
    I'd like to be able to do something like this:

    Code:
    var dlg = new BasicDialog('myEl', myCfg);
    dlg.show();
    then

    Code:
    dlg.redraw('myNewEl');
    or

    Code:
    var tpl = new YAHOO.ext.Template('...some html...');
    dlg.redraw(tpl);
    You'll have to get your hands dirty with code and extend the BasicDialog class then :wink:

Similar Threads

  1. Re-render content in resizable column using custom renderer?
    By KimH in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 25 Jun 2008, 8:34 AM
  2. [OPEN] Bug in Dialog Render
    By Bobafart in forum Ext 1.x: Bugs
    Replies: 12
    Last Post: 14 Feb 2007, 7:40 PM
  3. BasicDialog autoTabs with dynamic content
    By sjivan in forum Ext 1.x: Help & Discussion
    Replies: 8
    Last Post: 20 Dec 2006, 10:31 AM
  4. Checkbox render
    By alex1er in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 9 Nov 2006, 6:56 AM
  5. BasicDialog incompatible with ylayout-inactive-content?
    By SteveEisner in forum Ext 1.x: Bugs
    Replies: 5
    Last Post: 6 Nov 2006, 3:10 PM

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi