View Full Version : Divs, form and not working submit

13 Oct 2010, 9:42 PM

I have a form with some DIVs.
The form work fine, submit button send input elements.
When I add ExtJS and I render DIVs elements into Panels and TabPanel, rendering is ok, without error.
But submit button not work (don't send).

May you help me?

Here the simplified code:

<div id='main'></div>

<form action="update" method="post" >

<div id="bottoniAnagrafica" align="center">
<input type="submit" value="Salva le modifiche" "/>

<div id='datiAnagraficiBase'>
<input type="hidden" name="sf_method" value="put" />
<input type="hidden" name="persona_fisica[id]" value="1" id="persona_fisica_id" />
<input type="text" name="persona_fisica[cognome]" value="" id="persona_fisica_cognome" />
<input type="text" name="persona_fisica[nome]" value="" id="persona_fisica_nome" />

<div id="datiAnagrafici">
<select name="persona_fisica[sesso]" id="persona_fisica_sesso">
<option value="F" selected="selected">F</option>
<option value="M">M</option>

<div id='div-1'>

<input type="text" name="persona_fisica[eav_7]" id="persona_fisica_eav_7" />
<input type="text" name="persona_fisica[eav_24]" id="persona_fisica_eav_24" />

<div id='div-2'>

<input type="text" name="persona_fisica[eav_28]" id="persona_fisica_eav_28" />
<input type="text" name="persona_fisica[eav_27]" id="persona_fisica_eav_27" /> <input type="text" name="persona_fisica[eav_9]" id="persona_fisica_eav_9" />
<input type="text" name="persona_fisica[eav_8]" id="persona_fisica_eav_8" />

<div id="documenti" align="center">

<input type="checkbox" name="persona_fisica[tipo_docs_1]" id="persona_fisica_tipo_docs_1" />
<input type="checkbox" name="persona_fisica[tipo_docs_3]" id="persona_fisica_tipo_docs_3" />
<input type="checkbox" name="persona_fisica[tipo_docs_2]" id="persona_fisica_tipo_docs_2" />
<label for="persona_fisica_tipo_docs_2">Scheda Anagrafica</label></td>


var height = Ext.lib.Dom.getViewHeight()-100;
var datiAnagraficiBase = new Ext.Panel ({
el: 'datiAnagraficiBase',
region: 'north',
frame: false,
border: false
var tabPanel = new Ext.TabPanel ({
resizeTabs: true,
minTabWidth: 100,
tabWidth: 150,
activeTab: 'tab-1',
enableTabScroll: true,
defaults: { autoScroll: true },
region: 'center',
autoTabs: true,
border: true,
plain: true,
margins: '5 5 5 5',
items: [
{ id: 'tab-0',
title: 'Dati anagrafici',
el: 'datiAnagrafici' },
{ id: 'tab-1',
title: 'Contatti',
el: 'div-1' },
{ id: 'tab-2',
title: 'Dati Fiscali',
el: 'div-2' }
scripts: true,
height: height,
deferredRender: false
var center = new Ext.Panel ({
items: [datiAnagraficiBase,tabPanel],
region: 'center',
frame: true,
border: false
var bottoniAnagrafica = new Ext.Panel ({
el: 'bottoniAnagrafica',
region: 'north',
layout: 'border',
border: true
var documenti = new Ext.Panel ({
el: 'documenti',
region: 'center',
layout: 'border'
var latoDx = new Ext.Panel ({
items: [bottoniAnagrafica, documenti],
region: 'east',
border: false,
frame: true,
width: 300,
split: true
var main = new Ext.Panel ({
items: [center,latoDx],
layout: 'border',
split: true,
height: height
return {
init: function () {


Ext.onReady(main.init, main);