1. #1
    Ext User
    Join Date
    Sep 2008
    Posts
    7
    Vote Rating
    0
    AJuniorCoder is on a distinguished road

      0  

    Default RESOLVED::Issue with ASP.NET form server tag

    RESOLVED::Issue with ASP.NET form server tag


    I just started learning extjs a day or two ago and I have limited experience with javascript. I created a very simple aspx page and copied code example from dynamic.js.

    Code:
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="EMM.Web.WebForm1" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <link rel="stylesheet" type="text/css" href="~/css/EMM.css"/>
        <link rel="stylesheet" type="text/css" href="<%= Page.ResolveClientUrl("~/ExtJs/resources/css/ext-all.css")%>" />
        <script type="text/javascript" src="<%= Page.ResolveClientUrl("~/ExtJs/adapter/ext/ext-base.js")%>"></script>
        <script type="text/javascript" src="<%= Page.ResolveClientUrl("~/ExtJs/ext-all-debug.js")%>"></script>    
        <script type="text/javascript">
            Ext.onReady(function() {
                Ext.QuickTips.init();
                var simple = new Ext.FormPanel({
                    labelWidth: 75, // label settings here cascade unless overridden
                    url: 'save-form.php',
                    frame: true,
                    title: 'Simple Form',
                    bodyStyle: 'padding:5px 5px 0',
                    width: 350,
                    defaults: { width: 230 },
                    defaultType: 'textfield',
    
                    items: [{
                        fieldLabel: 'First Name',
                        name: 'first',
                        allowBlank: false
                    }, {
                        fieldLabel: 'Last Name',
                        name: 'last'
                    }, {
                        fieldLabel: 'Company',
                        name: 'company'
                    }, {
                        fieldLabel: 'Email',
                        name: 'email',
                        vtype: 'email'
                    }, new Ext.form.TimeField({
                        fieldLabel: 'Time',
                        name: 'time',
                        minValue: '8:00am',
                        maxValue: '6:00pm'
                    })
            ],
    
                    buttons: [{
                        text: 'Save'
                    }, {
                        text: 'Cancel'
    }]
                    });
    
                    //simple.render(document.body);
                    //simple.render(Ext.getDom('search'));
                    simple.render('search');
                })
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div id="search"></div>
        </form>
    </body>
    </html>
    Everything works fine if I render the FormPanel to document.body using syntax 'simple.render(document.body)'. However, I get 'the.body is null' error when I try to render the FormPanel to the div 'search'. Below call stack from firebug (and I'm new to this tool as well).


    Code:
    onRender()(Object dom=div#search id=search visibilityMode=1, null)ext-all-debug.js (line 15992)
    onRender()(Object dom=div#search id=search visibilityMode=1, null)ext-all-debug.js (line 28809)
    render()("search", undefined)ext-all-debug.js (line 12454)
    render()()ext-all-debug.js (line 14062)
    (?)()()webform1.aspx (line 52)
    fire()()ext-all-debug.js (line 1488)
    fireDocReady()()ext-all-debug.js (line 1592)
    getViewWidth()()
    If I move the div tag *out* of the form tag, the FormPanel is rendered successfully.

    Please help . I have spent 6-8 hours searching for the info on the forums, tutorials, etc. but was unable to resolve this error.

  2. #2
    Ext User
    Join Date
    Sep 2008
    Posts
    7
    Vote Rating
    0
    AJuniorCoder is on a distinguished road

      0  

    Default RESOLVED

    RESOLVED


    I resolved this by replacing Ext.FormPanel with Ext.Panel. The screen is now rendered without an error.

  3. #3
    Ext User Blackhand's Avatar
    Join Date
    May 2008
    Posts
    42
    Vote Rating
    0
    Blackhand is on a distinguished road

      0  

    Default


    Someone else also had this problem a little while ago and solved it in a similar way.

    The problem is, Ext.form.FormPanel creates a <form> HTML element, this allows the form to easily post its values to the server as a normal HTML form would. It is however not valid to nest form tags, which is a bit of a problem with integration with ASP.Net, as ASP.Net controls need to be placed within a form tag with runat=server to create the postback model and implement things like the viewstate.

    I believe the easiest solution to this problem, is to add a configuration option to the Ext.form.FormPanel to disable the rendering of the <form> element and perhaps render a <div> instead. The user can still submit values back to the server making use of things like web services.

    This of course won't be an issue when using the ASP.Net MVC framework, as the "wrapping" form tag is no longer used.

  4. #4
    Ext User
    Join Date
    Sep 2008
    Posts
    7
    Vote Rating
    0
    AJuniorCoder is on a distinguished road

      0  

    Default


    Quote Originally Posted by Blackhand View Post
    I believe the easiest solution to this problem, is to add a configuration option to the Ext.form.FormPanel to disable the rendering of the <form> element and perhaps render a <div> instead. The user can still submit values back to the server making use of things like web services.
    Do you happen to know off hand the syntax of the config option? If not, I'll do more research on this. Thank you so much.

  5. #5
    Ext User Blackhand's Avatar
    Join Date
    May 2008
    Posts
    42
    Vote Rating
    0
    Blackhand is on a distinguished road

      0  

    Default


    Sorry, I probably wasn't clear enough when I said this, but there currently is no such configuration option, I was more suggesting it to be added to the FormPanel if someone from the dev team happened to stumble on this thread .

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar