Ir para conteúdo


Foto

[Resolvido] Submit TabPanel


  • Por favor, faça o login para responder
5 respostas neste tópico

#1 vitormlopes

vitormlopes

    Member Avançado

  • Membros
  • PipPipPip
  • 47 posts

Postado 14 October 2009 - 13:14

Boas Tardes

recorro mais uma vez á preciosa ajudo do pessoal do forum...

tenho este codigo e pretendo fazer o submit de todas as tabs em simultaneo para a base de dados... de formpanel eu consigo fazer... mas de tabpanel??? Alguem pode ajudar


Submit da tab criapedidocotacaotab quando clico no botao buttonGuardarPedido


var buttonGuardarPedido =  new Ext.Button({
        id: 'criaUmPedidobuttonGuardarPedido',
        text:'Guardar',
        hidden: true,
        handler:function(){
            //addTecnicoPedido(userId);
            //Ext.getCmp('pedidoCotacao2000').getItem('pedcot').submit({
            //    waitMsg: 'Salvando alterações, por favor espere...'
            //});
            alert("Pedido Guardardo");
            buttonApagarPedido.show()
        }
    });

var criapedidocotacaotab = new Ext.TabPanel({
        id:                   'pedidoCotacao2000',
        anchor: '100% 100%',
        hideMode: "offsets",
        deferredRender:		false,
        activeTab:		0,
        buttonAlign: 'center',
        layoutOnTabChange: 	true,
        plain:			true,
        enableTabScroll: 	true,
        defaults:{autoScroll: true, autoHeight:true, bodyStyle:'padding:10px'},
        items:[{
            id: 'pedcot',
            title:'Ped Cot',
            layout:'form',
            anchor: '100% 100%',
            defaults: {width: 230, height: 20},
            defaultType: 'textfield',
            items: [{
                id: 'fieldset2000',
                autoHeight: true,
                anchor: '100% 100%',
                collapsible: false,
                xtype:'fieldset',
                border: false,
                //title: 'Localização na Direcção Comercial',
                defaults: {width: 230, height: 20},
                layout:'column',
                items:[{
                    columnWidth:.35,
                    layout: 'form',
                    autoHeight: true,
                    border:false, 
                    bodyBorder:false,
                    defaults: {width: 230, height: 20},
                    //defaults: {width: 75,  labelStyle: 'width:25'},
                    items: [{
                        id: 'criaUmPedidotecnico',
                        autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 100 }, 
                        fieldLabel: 'Tecnico',
                        name: 'tecnico',
                        allowBlank: false,
                        xtype: 'textfield'
                    },{
                        id: 'criaUmPedidomediador',
                        autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 100 }, 
                        fieldLabel: 'Mediador',
                        readOnly: true,
                        name: 'mediador',
                        allowBlank: false,
                        xtype: 'textfield'
                    }]
                },{        
                    columnWidth:.65,
                    layout: 'form',
                    border:false, 
                    bodyBorder:false,
                    autoHeight: true,
                    defaults: {width: 75,  labelStyle: 'width: 125'},
                    items: [buttonPesquisaTecnico,buttonPesquisaMediador]
                }]
            }]
        },{
            id: 'cliente',
            title:'Cliente',
            layout:'form',
            //buttonAlign: 'left',
            anchor: '100% 100%',
            //height: 700,
            disabled: true,
            autoScroll : true,
            defaults: {width: 230, height: 20},
            defaultType: 'textfield',
            items: [{
                id: 'fieldset2000',
                autoHeight: true,
                anchor: '100% 100%',
                collapsible: false,
                xtype:'fieldset',
                border: false,
                //title: 'Localização na Direcção Comercial',
                defaults: {width: 230, height: 20},
                layout:'column',
                items:[{
                    columnWidth:.35,
                    layout: 'form',
                    autoHeight: true,
                    border:false, 
                    bodyBorder:false,
                    defaults: {width: 230, height: 20},
                    //defaults: {width: 75,  labelStyle: 'width:25'},
                    items: [{
                        id: 'contribuinte' + userId,
                        autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 15},
                        fieldLabel: 'Contribuinte',
                        allowBlank: false,
                        xtype: 'textfield'
                    }]
                },{        
                    columnWidth:.65,
                    layout: 'form',
                    border:false, 
                    bodyBorder:false,
                    autoHeight: true,
                    defaults: {width: 75,  labelStyle: 'width: 125'},
                    items: [{
                        xtype: 'button',
                        text:'Pesquisar Entidades',
                        handler:function(){
                            pesquisaAS(userId);
                        }
                    }]
                }]
            },{
                id: 'fieldset2001',
                autoHeight: true,
                anchor: '100% 100%',
                collapsible: false,
                xtype:'fieldset',
                border: false,
                defaultType: 'textfield',
                //title: 'Localização na Direcção Comercial',
                defaults: {width: 230, height: 20},
                items: [{
                    id: 'titular' + userId,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 100}, 
                    allowBlank: false,
                    fieldLabel: 'Titular',
                    name: 'titular'
                },{
                    id: 'nome' + userId,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 100}, 
                    width: 500,
                    allowBlank: false,
                    fieldLabel: 'Nome',
                    name: 'nome'
                },{
                    id: 'morada' + userId,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 30}, 
                    fieldLabel: 'Morada'
                },{
                    id: 'codPostal' + userId,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 30}, 
                    fieldLabel: 'Codigo Postal'
                },{
                    id: 'profissao' + userId,
                    allowBlank: false,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 30},
                    fieldLabel: 'Prof./Actividade'
                },{
                    id: 'cae' + userId,
                    allowBlank: false,
                    autoCreate: {tag: "input", type: "text", autocomplete: "off", maxlength: 20},
                   fieldLabel: 'CAE'		
                },{
                    id: 'descActividade' + userId,
                    width: 500,
                    xtype:'textarea',
                    multiline: true,
                    height: 50,
                    autoCreate: {tag: "textarea",style: "font-family: 'Courier'",wrap: 'hard',autocomplete: "off"},
                    fieldLabel: 'Desc. Complementar Actividade'
                },{
                    xtype: 'radiogroup',
                    fieldLabel: 'Cliente Empresa',
                    itemCls: 'x-check-group-alt',
                    columns: 3,
                    width: 300,
                    //height: 50,
                    items: [
                        {width: 100, boxLabel: 'Retalho', name: 'tcliente', inputValue: 1},
                        {width: 100, boxLabel: 'Empresa', name: 'tcliente', inputValue: 2},
                        {width: 100, boxLabel: 'Institucional', name: 'tcliente', inputValue: 3}
                    ]
                },{
                    xtype: 'radiogroup',
                    fieldLabel: 'Protocolo',
                    itemCls: 'x-check-group-alt',
                    columns: 2,
                    width: 200,
                    //height: 50,
                    items: [
                        {width: 100, boxLabel: 'Sim', name: 'protocolo', inputValue: 1},
                        {width: 100, boxLabel: 'Nao', name: 'protocolo', inputValue: 2}
                    ]
                },{
                    xtype: 'radiogroup',
                    fieldLabel: 'Cliente BANIF/BCA',
                    itemCls: 'x-check-group-alt',
                    columns: 2,
                    width: 200,
                    //height: 50,
                    items: [
                        {width: 100, boxLabel: 'Sim', name: 'clientebanif', inputValue: 1},
                        {width: 100, boxLabel: 'Nao', name: 'clientebanif', inputValue: 2}
                    ]
                },{
                    xtype: 'combo',
                    id: 'risco' + userId,
                    name: 'risco',
                    displayField: 'desc',
                    valueField: 'cod_risco',
                    store: new Ext.data.SimpleStore({
                        fields: ['cod_risco', 'desc'],
                        data: [["1","Bom"],["2","Mau"]]
                    }),
                    fieldLabel: "Risco Moral",
                    mode: 'local',
                    triggerAction: 'all',
                    emptyText: 'Select a type...',
                    allowBlank: true
                },{
                    id: 'Observacoes' + userId,
                    xtype:'textarea',
                    width: 500,
                    multiline: true,
                    height: 50,
                    autoCreate: {tag: "textarea",style: "font-family: 'Courier'",wrap: 'hard',autocomplete: "off"},
                    fieldLabel: 'Obs.' 
                },{
                
                    id: 'fildsetcotacoesdocliente',
                    xtype: 'fieldset',
                    title: 'Pedidos do Cliente',
                    autoHeight: true,
                    anchor: '98% 100%',
                    defaultType: 'textfield',
                    //collapsible: true,
                    //collapsed: true,
                    defaults: {width: 200,  labelStyle: 'width:220'},
                    items:[gridPedCotPesquisaAS(userId)]
                }]
            }]
        },{
            id: 'produ',
            title:'Produtos',
            disabled: true,
            layout:'form',
            autoWidth: true,
            autoHeight: true,
            defaultType: 'textfield',
            items: [gridForm]
        }],
        buttons: [buttonGuardarPedido,buttonApagarPedido,buttonSubmeterPedido,buttonSeguinte]
    });


pus so a parte do codigo que importa pois o restante penso que nao faz falta e excedio o limite de caracteres aqui do forum.  Cumprimentos

obrigado

#2 Miguel Cartagena

Miguel Cartagena

    Member Avançado

  • Membros
  • PipPipPip
  • 163 posts
  • LocationBlumenau/SC

Postado 14 October 2009 - 14:10

Você pode criar um FormPanel e colocar o TabPanel dentro. Eu fiz isso quando precisei e funciona perfeitamente. O código ficaria mais ou menos assim:


var form = new Ext.form.FormPanel({
                url: 'save',
                autoScroll: true,
                border: false,
                defaults: {
                    border: false
                },
                items: criapedidocotacaotab 
            });


#3 vitormlopes

vitormlopes

    Member Avançado

  • Membros
  • PipPipPip
  • 47 posts

Postado 15 October 2009 - 04:57

sim eu tinha feito isso. mas tenho depois uma "form dinamica" que quero criar e que dá erro se puser o tab dentro da form...

o que tenho é o seguinte: na grid que esta na tab 'produ' tem um botao que lança o seguinte codigo:

    function addTabcoberturasProduto(name, userId){
	var tabs = Ext.getCmp('pedidoCotacao2000');
	var tab = tabs.getComponent('novoPedidoCotacao');
	if(!tab){
            tab = tabs.add({
                id:			'novoPedidoCotacao',
                title:			name,
                autoScroll:		true,
                height:                 600,
                closable:		true,
                items:		[addprodutopedido2(gridprodcob.getSelectionModel().getSelected().get('id_prodped'),gridprodcob.getSelectionModel().getSelected().get('descricao'))]
            });
            tabs.setActiveTab(tab);
	}
        else{
            alert('Grave o proposta em ediçao para editar nova proposta');
        } 
    }



que por sua vez lança a função addprodutopedido2

function addprodutopedido2(userId,descricao){

    var windinamico = new Ext.Panel({
        labelWidth: 75, 
        id: 'windinamico',
        anchor: '100% 100%',
        frame:true,      
        formId: "formdinamica",
        //width: 350,
        hideLabel: false,
        defaultType: 'textfield',
        items:{
            xtype:'metaform',
            url:'getFields.do?id_produto=' + userId
        },
        buttons: [{
            text: 'Guardar',
            handler: function(){
                var tabs = Ext.getCmp('pedidoCotacao2000');
                //var tab = tabs.getComponent("Editar [" + userId + "]");
                //if(tab){
                tabs.remove("novoPedidoCotacao");
                tabs.remove("Editar [" + userId + " - " + descricao + "]");
                tabs.getItem('pedcot').enable(); 
                tabs.getItem('cliente').enable(); 
                //tabs.getItem('infocom').enable(); 
                tabs.getItem('produ').enable();
                tabs.setActiveTab(tabs.getComponent('produ'));
                //}
            }
        }]
    });  
    
    return windinamico;
}

o erro que dá quando quero criar esse tab é:

this.body is null
[Break on this error] Ext.Panel=Ext.extend(Ext.Container,{base...toLoad})}});Ext.reg("panel",Ext.Panel);\n


#4 Bruno Tavares

Bruno Tavares

    Member Avançado

  • Membros
  • PipPipPip
  • 1166 posts
  • LocationRedwood City, CA, USA

Postado 15 October 2009 - 13:10

Lembro de ter problemas com form dentro de form. Nessas ocasiões eu parto do seguinte princípio: cada aba deve conter um método getValue que me retorne os seus valores. Desaconselho qualquer rotina que vá acessando aba por aba e catando lá dentro os valores. Geralmente essas rotinas acabam sendo um monte disso

var clienteID = Ext.getCmp("meuTabPanel").get(1).getComponent("form").form.findField("comboCliente").getValue();

Sempre que preciso fazer essas rotinas (várias) procedo da seguinte maneira :

/*
 * Listener disparado ao clicar no submit
 */
onBtnSubmitClick: function()
{
    var values = {};
    var isValid = true;
 
    //para cada aba
    this.tabPanel.items.each(function( tab )
    {
            //verifico se é valido
            if( !tab.isValid() )     
            {
				isValid = false
				tab.active();
				return false;  
            }
			
			Ext.apply(values,tab.getValue())
    })
	
	if( !isValid )
		return;
		
	//TODO: faz requisição passando values
}

Detalhe: getValue e isValid não existem por padrão do Ext. Eu que crio esses métodos e implemento.

Abs!
Bruno Tavares, Sr. UI Engineer
Netflix

#5 vitormlopes

vitormlopes

    Member Avançado

  • Membros
  • PipPipPip
  • 47 posts

Postado 19 October 2009 - 12:32

obrigado pela ajuda bt_bruno.... Eu solucionei o problema de outra form... tirei a form de dentro da form e criei um pop-up so com o formulario dinamico....

Vou pôrcomo resolvido se alguem quiser ver a soluçao peço que me mandem PM que eu tento postar aqui.

Obrigado



#6 edivaldoms

edivaldoms

    Iniciante

  • Membros
  • Pip
  • 1 posts

Postado 24 January 2012 - 11:47

Solução mais adequada para isso http://edivaldoms.bl...xttabpanel.html




0 usuário(s) está(ão) lendo este tópico

0 membros, 0 visitantes, 0 membros anônimos