PDA

View Full Version : ASP.NET form tag and rendering into the div tag



Mindzor
8 Nov 2010, 9:05 PM
Hello

If the div tag is inside the form tag then error appears. How solve this problem?
Test.aspx


<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" href="ext-3.3.0/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="ext-3.3.0/resources/css/xtheme-gray.css" />
<script type="text/javascript" src="ext-3.3.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-3.3.0/ext-all-debug.js"></script>
<script type="text/javascript" src="Test.js"></script>
</head>
<body>

<form id="form1" runat="server">
<div id="form-ct"></div>
</form>
</body>
</html>

Test.js


Ext.chart.Chart.CHART_URL = 'ext-3.3.0/resources/charts.swf';

Ext.onReady(function () {
var store3 = new Ext.data.JsonStore({
fields: ['name', 'visits', 'views'],
data: [
{ name: '07 07', visits: 245000, views: 3000000 },
{ name: '08 07', visits: 240000, views: 3500000 },
{ name: '09 07', visits: 355000, views: 4000000 },
{ name: '10 07', visits: 375000, views: 4200000 },
{ name: '11 07', visits: 490000, views: 4500000 },
{ name: '12 07', visits: 495000, views: 5800000 },
{ name: '01 08', visits: 520000, views: 6000000 },
{ name: '02 08', visits: 620000, views: 7500000 }
]
});

var chart = new Ext.Panel({
title: '',
width: 700,
height: 300,
layout: 'fit',
items: {
xtype: 'linechart',
store: store3,
xField: 'name',
yField: 'visits',
listeners: {
itemclick: function (o) {
var rec = store.getAt(o.index);
Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('name'));
}
}
}
});

var checkGroup = {
xtype: 'fieldset',
title: 'Checkbox Groups (initially collapsed)',
autoHeight: true,
layout: 'column',
items: [{
xtype: 'checkboxgroup',
fieldLabel: 'Single Column',
itemCls: 'x-check-group-alt',
// Put all controls in a single column with width 100%
columns: 1,
items: [
{ boxLabel: 'Item 1', name: 'cb-col-1' },
{ boxLabel: 'Item 2', name: 'cb-col-2', checked: true },
{ boxLabel: 'Item 3', name: 'cb-col-3' }
]
}]
};

var fp = new Ext.FormPanel({
title: '',
renderTo: 'form-ct',
frame: true,
labelWidth: 110,
bodyStyle: 'padding:0 10px 0;',
items: [
{
layout: 'column',
border: false,
defaults: {
columnWidth: '.5',
border: false
},
items: [checkGroup, chart]
}
]
});

});


Thanks

Condor
9 Nov 2010, 12:01 AM
You can't render a FormPanel inside a <form> tag (you would end up with nested <form> tags).

Do you actually need a FormPanel or were you planning on submitting 'form1' anyway? In that case you only need a Panel with layout:'form' and not a FormPanel.

dan_b
9 Nov 2010, 3:30 AM
You can't render a FormPanel inside a <form> tag (you would end up with nested <form> tags).

Do you actually need a FormPanel or were you planning on submitting 'form1' anyway? In that case you only need a Panel with layout:'form' and not a FormPanel.

One of the idiosyncrasities of ASP.Net Webforms - every page gets wrapped in a <form> tag. This is how they build the illusion of state over http. Mindzor, have a look at Ext.Net if you must use Webforms.

Mindzor
9 Nov 2010, 4:42 AM
Thanks