레이블이 combo인 게시물을 표시합니다. 모든 게시물 표시
레이블이 combo인 게시물을 표시합니다. 모든 게시물 표시

2008년 4월 2일 수요일

Ajax Json으로 값을 받아온 combo

data를 서버로 부터 받아오는 경우

// 택배사 콤보 박스 출력
    m_params['template']    = "E900";
    m_params['action']      = "get_transcode";
    transcorp_store = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy(
                   new Ext.data.Connection({
                        url: './function.htm',
                        extraParams: m_params,
                        method: 'POST'
                })),
        reader: new Ext.data.JsonReader({
            root: "corp_list",
            fields: ["id", "trans_corp"]
        }),
        autoLoad:true
    });

// combo box 출력
    m_combo = new Ext.form.ComboBox({
            name: "combo_trans_corp",
            fieldLabel: '택배사',
            mode:'local',       // 중요
            displayField:'trans_corp',
            valueField:'id',
            store: transcorp_store,
            emptyText:'Select a 택배사...'
    });


사용자 삽입 이미지


기본 combo 만들기 - 값 설정 가능

기본 콤보 생성
값을 임의로 설정할 수 있는 콤보
case 1
var combo_transwho = new Ext.form.ComboBox({
            name: "combo_transwho",
            fieldLabel: '선착불',
            store: new Ext.data.SimpleStore({
                fields: ['id', 'disp'],
                data : [
                    ['고객','고객부담'],
                    ['자사','자사부담']
                ]
            }),
            valueField:'id',
            displayField:'disp',
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Select 선착불...',
            selectOnFocus:true
    });

사용자 삽입 이미지


case 2
            // 일반 콤보           
            this.combo_common = function( title, id, arr_data )
            {
                var _store = new Ext.data.SimpleStore({
                    fields: ['id', 'value'],
                    data : arr_data // from states.js
                });

                o = new Ext.form.ComboBox({
                    name: id,
                    id: id,
                    width: 90,
                    hideLabel: true,
                    store: _store,
                    emptyText: title,
                    displayField:'value',
                    valueField: 'id',
                    mode: 'local',
                    editable:false,
                    triggerAction:'all'
                })
               
                return o;
            }