Viewport/Coolite Controls/ASP.NET Postbacks

  1. #1

    Viewport/Coolite Controls/ASP.NET Postbacks

    Hi,

    I'm using the Ext JS Complex Layout for my site. This involves the use of Ext JS Viewport. I had to implement the following fix http://extjs.com/forum/showthread.php?t=14261 to get my .NET controls to postback with data. The problem is when I add the Coolite DatePicker control to my usercontrol, I get an error saying "Ext.FormViewport is not a constructor". This is due to using FormViewport instead of Viewport. If I use Viewport then the DatePicker control works but I don't get data on postbacks so I'm in a bit of a bind.

    Is there anything I can do to have the best of both worlds?

    I can post code if neccesary but I'm using the code exactly as it is from the referenced link above.


    Thanks!
  2. #2

    RE: Viewport/Coolite Controls/ASP.NET Postbacks



    Hi Mike,

    This sounds like a problem with the order in which the <script>'s are included. If you have a Coolite ScriptManager control on your page, you may not (will not) need to separately include the ExtJS scripts as the required extjs .js files are automatically written to the <head> by the cool:ScriptManager.

    By default the ScriptManager will add the extjs scripts as the last items in the <head>. I suspect that because of this, your FormViewPort code is firing before the extjs files are being loaded. It's just a problem of order (i think/hope).

    The solution should be easy. Just add a <cool:ScriptContainer> within the <head> of your document before you include the FormViewPort code.

    Example

    <head runat="server">
        <cool:ScriptContainer ID="ScriptContainer1" runat="server" />
        <script type="text/javascript">
            // Add your JavaScript here...    
        </script>
    </head>
    The Coolite ScriptManager looks for the ScriptContainer and if it's present writes the scripts in that location, rather than last position in the head.

    Let me know if this solves the problem.

    Hope this helps.
    Geoffrey McGill
    Founder
  3. #3

    RE: Viewport/Coolite Controls/ASP.NET Postbacks

    Ah! That was it. Firebug produced no errors so it works now. Thanks for your prompt reply and great controls!

    Thanks,
    Mike
  4. #4

    RE: Viewport/Coolite Controls/ASP.NET Postbacks

    Well I thought the problem had been solved but I'm experiencing some new issues.

    Using the ScriptContainer in conjunction with the Complex Layout, I no longer am able to "split" windows in IE 7. It works perfectly in Firefox though. I can resize panes/windows within the Complex Layout in Firefox but not IE 7.

    When I take out the ScriptContainer and just include the normal ext js script (base and all) then it works in IE 7.

    Any ideas?
  5. #5

    RE: Viewport/Coolite Controls/ASP.NET Postbacks



    We're outputing version 2.0.1 of ExtJS. What version of ExtJS are you including manually?


    If you view the html source for the page, are the coolite rendered scripts getting included in the correct order? ie, ext-base and ext-all are being rendered to the page before your ViewPort script?


    I believe Vladimir's FormViewPort script was built with Ext 1.1.


    Posting the View > Html Source from your page might help us diagnose.


    >Is there anything I can do to have the best of both worlds?


    The best of both worlds is coming soon. The version 0.5 release should include the ViewPort control.


    The version 0.4 release (due out by next Tuesday) will include the TabPanel.
    Geoffrey McGill
    Founder
  6. #6

    RE: Viewport/Coolite Controls/ASP.NET Postbacks

    Thanks for the help.

    Here is the code from View -> Source:

    <!-- Coolite ASP.NET WebControls [Community Edition]. Version 0.3.1.12579. "Default" Theme. --><link rel="stylesheet" type="text/css" href="/Coolite/ExtJS/resources/css/ext-all-embedded/css/cool.axd" /><script type="text/javascript" src="/Coolite/ExtJS/adapter/ext/ext-base/js/cool.axd"></script><script type="text/javascript" src="/Coolite/ExtJS/ext-all/js/cool.axd"></script><script type="text/javascript">Ext.BLANK_IMAGE_URL='/WebResource.axd?d=S1TCOoHl5Ccl8zH0SUKP3aZJDQC6hzZpqT5VQyOX_WFmz7h6wV-EPPoyP6kDNlEC9IJSyQQ147eLDT_ZQZ_20RrHf8P9_VUE1PibDpHvw2E1&amp;amp;t=633386555640000000';Ext.onReady(function(){Ext.QuickTips.init();this.ctl00_ContentPlaceHolder1_ClientRecord1_txtFirstName=new Ext.form.TextField({id:"ctl00_ContentPlaceHolder1_ClientRecord1_txtFirstName",applyTo:"ctl00_ContentPlaceHolder1_ClientRecord1_txtFirstName_TextBox",value:"Mike",allowBlank:false,blankText:"Please enter a first name",width:200});this.ctl00_ContentPlaceHolder1_ClientRecord1_txtLastName=new Ext.form.TextField({id:"ctl00_ContentPlaceHolder1_ClientRecord1_txtLastName",applyTo:"ctl00_ContentPlaceHolder1_ClientRecord1_txtLastName_TextBox",value:"Williams",allowBlank:false,blankText:"Please enter a last name",width:200});this.ctl00_ContentPlaceHolder1_ClientRecord1_txtDOB=new Ext.form.DateField({id:"ctl00_ContentPlaceHolder1_ClientRecord1_txtDOB",applyTo:"ctl00_ContentPlaceHolder1_ClientRecord1_txtDOB_TextBox",value:"09/22/76"});this.ctl00_ContentPlaceHolder1_ClientRecord1_txtSSN=new Ext.form.TextField({id:"ctl00_ContentPlaceHolder1_ClientRecord1_txtSSN",applyTo:"ctl00_ContentPlaceHolder1_ClientRecord1_txtSSN_TextBox",value:"000-00-0000",allowBlank:false,regex:/^\d{3}-\d{2}-\d{4}$/,regexText:"Numeric field. Format XXX-XX-XXXX. Enter 000-00-0000 if you do not know the SSN."});this.ctl00_ContentPlaceHolder1_ClientRecord1_txtCommValue=new Ext.form.TextField({id:"ctl00_ContentPlaceHolder1_ClientRecord1_txtCommValue",applyTo:"ctl00_ContentPlaceHolder1_ClientRecord1_txtCommValue_TextBox",allowBlank:false,blankText:"Please enter a value",width:200});});</script></PRE>    <script src="js/ClientHome.js" type="text/javascript"></script>    <link href="css/ext-all.css" rel="stylesheet" type="text/css" /><link href="css/menus.css" rel="stylesheet" type="text/css" /><link href="css/xtheme-gray.css" rel="stylesheet" type="text/css" /><link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />        <style type="text/css">        body        {            overflow: hidden;            margin: 0;            padding: 0;            border: 0px none;        }        html, body        {            height: 100%;        }        form        {            width: 100%;            height: 100%;        }        .settings        {            background-image: url(../shared/icons/fam/folder_wrench.png);        }        .nav        {            background-image: url(../shared/icons/fam/folder_go.png);        }    </style>        </head><body>    <form name="aspnetForm" method="post" action="Default.aspx?id=1" onsubmit="return WebForm_OnSubmit();" id="aspnetForm" style="width:100%; height:100%;"><input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /><input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /></PRE><input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="t017oLHdLyRjGIUn9DRNHpOluRBaT7W4VgY6hzPE4kkEvgH3golJ39tP6pobwfA1av0ia3KFWUFISgFaCi0sXvLt+G49gd7GaU1DAWgndf3peJPQIJvvvRKZBxl0dIDbyQkGuMluYVVx/6brUvzrG0MDwfslpIOJm9rC99Ni4ibhvrdh4KWnXuG+CM7aAj6CUIsNcNDyFt7vQQyMvperKcPRQkh1Pq0CP3HVwn4sO6JJn6N9t79aLnwjVXMSBpz2f2/xJ2XCq9rvqcVIN+x1RbDHibI0VEJdcv9g26jEOY0OhFIFidxWimtcP+JYsw2dh1P7HYKMGYrvCIzHozNZlvopiqVDgGyAZtgSehWKIHZkP650cPWwAUNX1OkS5i3b9mvvSbhWsSH6e/Q6NmhY49B2yYDXwKQXkQKHYV61gKsh5yVk/rK7hXLRnRRqUfps1hiELmL6nSkB+kFjw3m1nlGPdzwmxRhxbOtG0jfUnxVBL47oCVTokQekA1gQRGo+xi/bfkJqD2fqRTX7SbqvguH5bEeYQ1QOGk0FkyvdhowQ820D/T/rPOhDO925yXbAYB93NIs+P1rmrC+qND2/dj2tzHdjXJGAyEOsulqOfwVJxE6+AzWD4X6DjSyBYX7EIi9LP+8sLGfjUMUhkvGhlf+01nyi4jfKEXNfLN4hjzY7eaREpkrB5V3gfHbO2aiauSULWRc2PabALg+AbF978mlWwskjlcCicygY/kLv0HKVHPWbULsxbVLB1EerriqWruJ1rCzEDQWYZJY2cC9N2sx9PuPJ6LSoUBDYjKnuIY0pzRjvGSrb9eJ2g1hlkkE/exgr9FZFLhRWlR5GRUN0by+DRBspcnRQI3OyYE+6E/XfqzkYQTOVKqIe31lOnR14dL6lQXl5hbQ6WHPOuwh73XuGF5HMS2+GCvTB60SvIH1LhrJz+sdOFuU0aESHNJkuWnWKk5++DcQhHN8CBvWH0DSnjdqz8npOrrWNcjoWXb1suCbrx9KuNRtfnm7WPw3mkpLDCFWQksehrpzW8aksUNTl0CsoGj1UsX48os+AIm9l/1Y7/GwC/iXO3GxFBq0DchnFZzAU4YaVr9HyrRt06XGmsWSqVxU0/1Io+zaB2gpes6d0ukmgaMNaxaBRMJ4u7UEfNaYqZp+P/yuFZdWsHlo0wDwTZPLbntfePv1OhsCAXl4W7/mxV4Dh7k/6RybgGRysb7dVIwIK0i3JWJAQ8+MX1akQEy/iK/fOjm2XScd3BvFvM9W/1+qoIEOOOtXKXY853ob0OLlehu2FrNDaUzLRsYqCPqPREcSQZ7X6BFpKAz6RBOKAUcDOFhR68z6TRNEf/eThGTjoL2VPzk/bZYOCDIuSOqSVZl/1GdIpkrLQH5eb18uDR789cjdXtkvlOd7OiO2yU/BuU6ZExXT8YjIpNrIc07e4eLBV53J679VTOM4lgfY6uBOjtUHHkZCYgq76YiN1mvVOEeFGor6ji7SyBc/G0JiQ4OjJjYP3tAXpnlEv7YK7DGhPDSm5ERdWEgmwePQ9VeLWX++pINstvZKH5zKU2iWWXZQiDEj0+cpozZKxe8zV6vp3kdHI01z2viLZ/DmAa3OHjrt1sdQrRNMVgYaeomXlxGz8SVOJckI=" />
    <script type="text/javascript">//<![CDATA[var theForm = &#100;ocument.forms['aspnetForm'];if (!theForm) {    theForm = &#100;ocument.aspnetForm;}function __doPostBack(eventTarget, eventArgument) {    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {        theForm.__EVENTTARGET.value = eventTarget;        theForm.__EVENTARGUMENT.value = eventArgument;        theForm.submit();    }}//]]></script><script src="/WebResource.axd?d=Up0oxAk4JrFxaS-O134eiw2&amp;amp;t=633310808667661127" type="text/javascript"></script><script src="/ScriptResource.axd?d=Acqab4y4klp_DF5HhPfa2kETx65McgEypzB_f7GIBZypQ5mYU5X9y1_kDxqnC0WkoDeA1sIHJZixSWZKtCEgWXYRLQQnqu8DrN6LwASG2ws1&amp;amp;t=633311451966879099" type="text/javascript"></script><script type="text/javascript">//<![CDATA[if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');//]]></script><script src="/ScriptResource.axd?d=Acqab4y4klp_DF5HhPfa2kETx65McgEypzB_f7GIBZypQ5mYU5X9y1_kDxqnC0Wkf-2YPbp9h0kT0JNJhhginF_CreYD9QS87UyRC-ljCLaIMwybD53NjAootpKkJCUQ0&amp;amp;t=633311451966879099" type="text/javascript"></script></PRE><script type="text/javascript">//<![CDATA[function WebForm_OnSubmit() {null;return true;}//]]></script>    <script type="text/javascript">//<![CDATA[Sys.WebForms.PageRequestManager._initialize('ctl00$ScriptManager1', &#100;ocument.getElementById('aspnetForm'));Sys.WebForms.PageRequestManager.getInstance()._updateControls(['tctl00$ContentPlaceHolder1$ClientRecord1$updPanelClient'], [], [], 90);//]]></script>

    <input type="hidden" name="__VIEWSTATEENCRYPTED" id="__VIEWSTATEENCRYPTED" value="" /><input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="qgcNZynIMxfnBcvwNXGedsPWsvobUWhkyvrxOtHac1Pcjq6eisJdm3zWAooI8NajTxxrzRAt026e4Qo76C4FpGUhubTlBhwLfzGI5Lu+/KfHca+ostLPOT7T6zilh3oe2i6j8jxgbtpU5I+p2mSoSB65+X9XLpVL5+O1kRie4Ggy3IDkAQWc55H5QNI7fjKYIeP7rZ6rbNIUpHtLFslfLPQUxde1SJEAGH9v23dj58VqnOyjFmmhmsdmdGRtFY9848g0j6GIsK3TWQqw25Sogg==" /></PRE>
    Thanks again!


    </PRE>
  7. #7

    RE: Viewport/Coolite Controls/ASP.NET Postbacks

    Hi Mike,

    Thought you might be interested in this...
    Last edited by geoffrey.mcgill; Feb 22, 2011 at 2:18 AM.
    Geoffrey McGill
    Founder

Similar Threads

  1. Viewport and dynamic loading controls
    By TheAlchemistBR in forum 1.x Help
    Replies: 2
    Last Post: Jan 19, 2012, 1:29 PM
  2. Replies: 1
    Last Post: Jan 27, 2011, 1:13 PM
  3. [CLOSED] Review Viewport and Dynamic Controls
    By tiramisu in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 21, 2010, 7:38 AM
  4. Partial Postbacks in a Viewport
    By westerncape1000 in forum Open Discussions
    Replies: 2
    Last Post: Jul 17, 2008, 3:44 AM
  5. Help with ViewPort / Coolite Panel / IFrame
    By ljcorreia in forum 1.x Help
    Replies: 6
    Last Post: Jun 04, 2008, 3:20 PM

Posting Permissions