Ir para conteúdo


Foto

[RESOLVIDO] Carregar Grid com Tabelas Relacionadas


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

#1 vagner.montenegro

vagner.montenegro

    Novato

  • Membros
  • PipPip
  • 29 posts
  • LocationRecife - Pernambuco - Brasil

Postado 19 June 2008 - 15:03

Ola a todos,

Desenvolvi um grid onde sempre que clicamos na linha ele carrega o form com os dados, tudo certo onde for com uma única tabela do banco mas quando é com duas tabelas relacionadas a coisa muda de figura. situação : tenho uma tabela de despesas e outra de tipo de despesas onde à uma chave estrangeira da segunda tabela na primeira. se carregar o grid ele vai trazer os codigos e não os nomes, ai mudei o retorno (uso php) em vez de retornar o  valor da chave estrangeira retorno o nome do tipo da despesa, tudo funcionou normal até..... quando decidir atualizar ele tenta inserir o texto e não o value, sei que retorno o json sem o id do tipo de despesa e esse é o mitivo mas vendo desta forma como eu alteraria o meu codigo?

Esse é o codigo da tela de despesas:
/**
 * ================  Form Despesas =======================
 */
var stVeiculo = new Ext.data.JsonStore({
    url           : 'ControllerAjax.class.php',
    id            : 'id',
    root          : 'data',
    baseParams    : {ajaxClass : 'VeiculoControl', ajaxMethod : 'listCombo'},
    fields        : [
        {name : 'id'}, 
        {name : 'placa'}
    ],
    sortInfo   : {field : 'placa', direction : 'ASC'}
});

stVeiculo.load();

var stTipoDespesa = new Ext.data.JsonStore({
    url           : 'ControllerAjax.class.php',
    id            : 'id',
    root          : 'data',
    baseParams    : {ajaxClass : 'TipoDespesaControl', ajaxMethod : 'listCombo'},
    fields        : [
        {name : 'id'}, 
        {name : 'nome'}
    ],
    sortInfo   : {field : 'nome', direction : 'ASC'}
});

stTipoDespesa.load();

var comboVeiculo = new Ext.form.ComboBox({
    fieldLabel     : 'Veículo',
    hiddenName     : 'id_veiculo',
    store          : stVeiculo,
    displayField   : 'placa',
    valueField     : 'id',
    mode           : 'local',
    forceSelection : true,
    typeAhead      : true,
    emptyText      : 'Selecione...',
    selectOnFocus  : true,
    width          : 105,
    tabIndex       : 1,
    listWidth      : 105
    
});

comboVeiculo.on("change", function() {
    //alert("ok");
});

var comboTipoDespesa = new Ext.form.ComboBox({
    fieldLabel     : 'Tipo de Debito',
    hiddenName     : 'id_tipo_despesa',
    store          : stTipoDespesa,
    displayField   : 'nome',
    valueField     : 'id',
    mode           : 'local',
    forceSelection : true,
    typeAhead      : true,
    emptyText      : 'Selecione...',
    selectOnFocus  : true,
    width          : 300,
    tabIndex       : 2,
    listWidth      : 300 
});

var formDespesas = new Ext.form.FormPanel({
    labelAlign : 'top',
    bodyStyle  : 'padding:5px',
    width      : 600,
    layout       : 'table',
    layoutConfig : {
        columns : 1
    },
    border     : false,
    url        : 'ControllerAjax.class.php',
    items      : [
        {xtype : 'hidden', name : 'ajaxClass', value : 'DespesasControl'},
        {xtype : 'hidden', name : 'ajaxMethod', value : 'save'},
        {xtype : 'hidden', name : 'id', id : 'id', value : 0},
        {
            layout : 'column',
            border : false,
            items  : [
                {
                    columnWidth : .9,
                    width       : 140,
                    layout      : 'form',
                    border      : false,
                    items       : [
                        comboVeiculo,
                        {
                            xtype      : 'textfield',
                            fieldLabel : 'Exercicio',
                            name       : 'exercicio',
                            tabIndex   : 3
                        },
                        {
                            xtype      : 'datefield',
                            fieldLabel : 'Data Vencimento',
                            name       : 'vencimento',
                            tabIndex   : 5
                        },
                        {
                            xtype      : 'datefield',
                            fieldLabel : 'Data do Pagto.',
                            name       : 'dt_pagamento',
                            tabIndex   : 7
                        }
                    ]
                },
                {
                    columnWidth : .9,
                    width       : 330,
                    layout      : 'form',
                    border      : false,
                    items: [
                       comboTipoDespesa,
                        {
                            xtype      : 'textfield',
                            fieldLabel : 'Parcela',
                            name       : 'parcela',
                            tabIndex   : 4
                        },
                        {
                            xtype      : 'textfield',
                            fieldLabel : 'Valor Devido',
                            name       : 'valor_devido',
                            tabIndex   : 6
                        },
                        {
                            xtype      : 'textfield',
                            fieldLabel : 'Valor Pago',
                            name       : 'valor_pago',
                            tabIndex   : 8
                        }
                    ]
                }
            ]
        },
        {
            layout : 'column',
            border : false,
            items  : [
                {
                    columnWidth : .9,
                    width       : 267,
                    layout      : 'form',
                    border      : false,
                    items       : [
                        {
                            xtype      : 'textfield',
                            fieldLabel : 'Número Bancário',
                            name       : 'numero_banco',
                            anchor     : '100%',
                            width      : 266,
                            tabIndex   : 9
                        }
                    ]
               }
           ]
        }
        
    ],
    buttons : [
        {
            text     : 'Salvar',
            tabIndex : 10,
            formBind : true, 
            handler  : function(){
                formDespesas.getForm().submit({
                    method    : 'POST',
                    waitTitle : 'Conectando',
                    waitMsg   : 'Enviando dados...',
                    success   : function(){
                        Ext.Msg.alert('Status', 'Despesa salva!.', function(btn, text){
                            formDespesas.getForm().reset();
                            dsDespesas.load({params : {start : 0, limit : 6}});
                        });
                    },
                    failure   : function(form, action){
                        Ext.Msg.alert(action.failureType);
                        if (action.failureType == 'server') {
                            obj = Ext.util.JSON.decode(action.response.responseText);
                            Ext.Msg.alert('Erro!', obj.errors.reason);
                        } else {
                            Ext.Msg.alert('Atenção!', 'Não foi possivel salvar os dados tente novamente!');
                        }
                    }
                });
            }
        },
        {
            text     : 'Cancelar',
            formBind : true,
            tabIndex : 11,
            handler  : function(){
                formDespesas.getForm().reset();
            }
        }
    ]
});

var dsDespesas = new Ext.data.JsonStore({
    url           :'DataGridAjax.class.php',
    id            : 'id',
    totalProperty : 'total',
    root          : 'data',
    baseParams    : {entity : 'Despesas', nameDateFieldFormat : 'vencimento, dt_pagamento', nameForeignField : 'id_tipo_despesa, tipoDespesa'},
    fields        : [
        {name : 'id'}, 
        {name : 'id_veiculo'},
        {name : 'id_tipo_despesa'},
        {name : 'exercicio'},
        {name : 'parcela'},
        {name : 'vencimento'},
        {name : 'dt_pagamento'},
        {name : 'valor_devido'},
        {name : 'valor_pago'},
        {name : 'numero_banco'}
    ],
    sortInfo   : {field : 'vencimento', direction : 'ASC'},
    remoteSort : true
});

var smDespesas = new Ext.grid.CheckboxSelectionModel({
    listeners : {
        rowselect : function(smDespesas, row, rec) {
            formDespesas.getForm().loadRecord(rec);
            formDespesas.getComponent('id').value = rec.id;
        },
        rowdeselect : function(smDespesas, row, rec) {
            if ((smDespesas.getCount() == 0)) {
                formDespesas.getForm().reset();
            }
        }
    }
});

var absFormDespesas = {
    id         : 'abs-form-despesas-panel',
    title      : 'Cadastro de Despesas',
    layout     : 'border',
    bodyBorder : false,
    defaults   : {
        collapsible  : true,
        split        : true,
        animFloat    : false,
        autoHide     : false,
        useSplitTips : true,
        bodyStyle    : 'padding:15px'
    },
    items : [{
        collapsible : false,
        region      :'center',
        margins     : '5 0 0 0',
        cls         : 'email-form',
        layout      : 'fit',
        frame       : true,
        items       : formDespesas
    },{
        scroll   : true,
        region   : 'south',
        layout   : 'fit',
        height   : 270,
        minSize  : 75,
        maxSize  : 300,
        cmargins : '5 0 0 0',
        frame    : true,
        items    : [{
            title  : 'Despesas',
            xtype  : 'grid',
            layout : 'absolute',
            tbar   : [{
                text      : 'Remover Selecionados',
                tooltip   : 'Remove os itens selecionados',
                iconCls   : 'remove',
                handler   : function () {
                    var conn = new Ext.data.Connection();
                    var selecteds = smDespesas.getSelections();
                    var text = '';
                    for (var i = 0; i < smDespesas.getCount(); i++) {
                        if (i+1 == smDespesas.getCount()) {
                            text += selecteds[i].id;
                        } else {
                            text += selecteds[i].id+', ';
                        }
                    }
                    conn.request({
                        url     : 'ControllerAjax.class.php',
                        method  : 'POST',
                        params  : {ajaxClass : 'DespesasControl', ajaxMethod : 'delete', id : text},
                        success : function(responseObject) {
                            Ext.Msg.alert('Status', 'Despesa(s) removida(s) com sucesso!.', function(btn, text){
                                formDespesas.getForm().reset();
                                dsDespesas.load({params:{start : 0, limit : 6}});
                            });
                        },
                        failure : function(form, action) {
                            Ext.Msg.alert('Aten&ccedil;&atilde;o!', 'Não foi possivel executar esta ação tente novamente!'); 
                        }
                    });
                }
            }],
            sm : smDespesas,
            ds : dsDespesas,
            columns : [
                smDespesas,
                {id : 'vencimento', header : "Vencimento", width : 100,  sortable : true, dataIndex : 'vencimento'},
                {header : "Data do Pagamento", width : 120,  sortable : true, dataIndex : 'dt_pagamento'},
                {header : "Valor Devido",      width : 100, sortable : true, dataIndex : 'valor_devido'},
                {header : "Valor Pago",        width : 100, sortable : true, dataIndex : 'valor_pago'},
                {header : "Tipo do Pagamento", width : 150,  sortable : true, dataIndex : 'id_tipo_despesa'}
            ],
            bbar : new Ext.PagingToolbar({
                store    : dsDespesas,
                pageSize : 6
            
            }),
            stripeRows : true
        }]
    }]
};

Obrigado a todos!
O Buscador de Pronéquios
http://www.solucoesnaweb.com.br

#2 ReapeR

ReapeR

    Member Avançado

  • Expert User
  • 854 posts
  • LocationBlumenau - SC

Postado 23 June 2008 - 12:20

Pelo q eu vi, vc nao usa um renderer do id_despesa no grid, e como os combos são mode: 'local' teoricamente deveria funcionar... Agora é assim mesmo que vc está usando, ou vc alterou o código antes de postar aqui?

vlw

#3 vagner.montenegro

vagner.montenegro

    Novato

  • Membros
  • PipPip
  • 29 posts
  • LocationRecife - Pernambuco - Brasil

Postado 25 June 2008 - 10:49

Valeu pela resposta ReapeR.
    Não fiz nenhuma alteração do meu código antes de postar, deixa eu ver se explico melhor o meu problema.
    Fiz um form e um grid quando carrego o grid com dados vindo de uma única tabela tudo ok, fiz um selection model e tudo mais, quando clico na linha do grid ele carrega o form para alteração, se preencho o form sem clicar no grid ele insere um novo registro e atualiza o form, se selecionar um ou mais registros na grid e clicar em "remover selecionados" remove os intens selecionados, como disse esta tudo funcionando, mas quando se tem tabelas relacionadas ? (acredito que alguem já trabalhou com o grid e tabelas relacionadas), exemplo: tenho uma tabela de despesas e outra de tipo de despesas, guardo na tabela despesas os gastos mas existem uma ralação entre as tabelas de despesas e tipo de despesas, onde despesas recebe um chave estrangeira da tabela tipo de despesas, eu utilizo campos auto numericos como chaves primarias de minhas tabelas então, quando listo a tabela de despesas ela irá mostrar no campo do tipo de despesas os id's dos tipos e não a sua descrição, alterei o retorno do php, para que ao invés de retornar os valores da chave estrangeira retorne as descrições dos tipos de despesas até ai tudo bem, clico no grid para listar ele lista corretamente, quando seleciono um registro no grid ele carrega o form como deveria mas quando mando atualizar da erro pois utilizo um combobox no form que lista todos os tipos de despesas cadastradas, mas ao invés de cadastrar o descrição cadastro o id do tipo de despesas (em outro tópico tirei a dúvida de como fazer isso); sei o por que, pois o tipo do campo chave estrangeira de minha tabela despesas é integer e quando clico no grid ele não tem esse valor mas o descrição do tipo ai pergunto alguem já passou por isso? lendo a documentação do Extjs vi que tem algo com mapping seria isso? será que dessa vez fui mais claro ??? acho que não ;D
Grato.
O Buscador de Pronéquios
http://www.solucoesnaweb.com.br

#4 vagner.montenegro

vagner.montenegro

    Novato

  • Membros
  • PipPip
  • 29 posts
  • LocationRecife - Pernambuco - Brasil

Postado 30 June 2008 - 17:05

Galera quero agradecer a todos....
Resolvi o problema, na verdade era uma besteira, eu alterei o retorno; antes retornava um json +- assim:

{"total":"8", "data":[{"id":"2","id_veiculo":"1","id_tipo_despesa":"2","vencimento":"31\/12\/1969"}]}

ai tinha alterado o valor em que vinha o id_tipo_despesa:
{"total":"8", "data":[{"id":"2","id_veiculo":"1","id_tipo_despesa":"IPVA","vencimento":"31\/12\/1969"}]}

obvio que tinha que ter problema onde foi parar o id do tipo da despesa ?  :-[
então alterei novamente para:
{"total":"8", "data":[{"id":"2","id_veiculo":"1","id_tipo_despesa":"2","tipoDespesa":"IPVA","vencimento":"31\/12\/1969"}]}

No meu JsonStore tambem alterei para receber este novo "campo" e no grid ao invés de mostrar o id mostro tipoDespesa.

Agradeço novamente e peço desculpas pela minha ignorância. ;D ;D ;D
O Buscador de Pronéquios
http://www.solucoesnaweb.com.br

#5 Antonio Junior

Antonio Junior

    Member Avançado

  • Membros
  • PipPipPip
  • 52 posts
  • LocationSão Luís

Postado 24 April 2014 - 11:34

Pelo q eu vi, vc nao usa um renderer do id_despesa no grid, e como os combos são mode: 'local' teoricamente deveria funcionar... Agora é assim mesmo que vc está usando, ou vc alterou o código antes de postar aqui?

vlw


ReapeR, como seria usando o render e model para relacionar no grid, sem usar uma consulta relacionada.

#6 ReapeR

ReapeR

    Member Avançado

  • Expert User
  • 854 posts
  • LocationBlumenau - SC

Postado 24 April 2014 - 13:30

@Antonio, sugiro que vc abra um novo tópico pra tratar do seu problema, pois imagino que vc está usando o EXT 4 e não o 2.

De qualquer forma, o certo é fazer como o vagner.montenegro fez.. criar um novo campo no store e exibir essa coluna no grid, invés da coluna com o ID do registro que vc tem relacionado. Dúvidas abra um post para vermos o seu código :)




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

0 membros, 0 visitantes, 0 membros anônimos