Results 1 to 4 of 4

Thread: Help with Ext.Window

  1. #1
    Ext User mrras25's Avatar
    Join Date
    Dec 2007
    Location
    Seattle
    Posts
    123

    Default Help with Ext.Window

    I have a limited html box with details that could go beyond the limit, I am trying to add a 'More Info' button which would pop up an Ext.Window and grab the content of the div that is associated to the button call.

    I have tried contentEl however it blanks out the data on the main page where the more info was clicked I would like the text to stay. What am I missing:

    HTML Code:
    ....
          <div id="infobox">
    <div id="block1">
          <h2> Welcome! </h2>
          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.<br/><br/>Aliquam commodo ullamcorper erat. Nullam vel justo in neque porttitor laoreet. Aenean lacus dui, consequat eu, adipiscing eget, nonummy non, nisi. Morbi nunc est, dignissim non, ornare sed, luctus eu, massa. Vivamus eget quam. Vivamus tincidunt diam nec urna. Curabitur velit.</p>
    </div> <input type="button" id="moreinfo" value="More Info" /><br /><br />
          </div>
    ....
    Code:
    Ext.onReady(function(){
       var win;
       var button = Ext.get('moreinfo');
       button.on('click', function(){
          // create the window on the first click and reuse on subsequent clicks
          if(!win){
             win = new Ext.Window({
                contentEl: 'block1',
                layout:'fit',
                width:668,
                height:350,
                closeAction:'hide',
                plain: true,
                //constrain: true,
                modal: true
             });
         }
         win.show(this);
      });
    });

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

    Quick and somewhat dirty...

    Code:
    Ext.onReady(function(){
       var win;
       var button = Ext.get('moreinfo');
       button.on('click', function(){
          var myData = document.getElementById('block1').innerHTML;
          // create the window on the first click and reuse on subsequent clicks
          if(!win){
             win = new Ext.Window({
                layout:'fit',
                width:668,
                height:350,
                closeAction:'hide',
                plain: true,
                //constrain: true,
                modal: true,
                html: myData
             });
         }
         win.show(this);
      });
    });
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3
    Sencha User VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501

    Thumbs up

    Yeah, contentEl will do that. Try this instead...

    Code:
    ... 
                //contentEl: 'block1',
                layout:'fit',
                width:668,
                height:350,
                closeAction:'hide',
                plain: true,
                //constrain: true,
                modal: true,
                listeners: {
                    show: function(t){
                        t.body.update(Ext.get('block1').dom.innerHTML);
                    }    
                }
    ...

  4. #4
    Ext User mrras25's Avatar
    Join Date
    Dec 2007
    Location
    Seattle
    Posts
    123

    Default

    You both rock! Thanks for your time- If I wanted to make my button pass the block1, block2 block3 etc the listener has that ability to know which id is passed right? and its a variable like
    Code:
     var = button.id;
    or something in that sense?

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •