jQuery UI Widgets Forums Angular JQXCOMBOX AND GRID

This topic contains 1 reply, has 2 voices, and was last updated by  Hristo 6 years, 7 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • JQXCOMBOX AND GRID #97179

    nyaupane37
    Participant

    I have Combobox inside my grid column While editing data I have to show selected according as id received from api.
    The item_id column in grid does not set value (is empty), and combobox didn’t set selected.

     Getting data from api..
     
      this.rdmservice.show(id).subscribe(
          result => { 
    
            this.requisition_item = result;
            this.source.localdata = this.requisition_item;
            this.myGrid.updatebounddata("cells");
          }, 
          error => { 
            console.log(error);
          }
        );
        data receiced from api...
        [
            {  item_id: 2, quantity: 66, unit_id: 66, remarks: "Good",…},
            { item_id: 2, quantity: 66, unit_id: 66, remarks: "Good",…}
        ]
        
    
     this.gridSource =
        {
            localdata: {},// data from api..
            datatype: "json",
            datafields:
            [
                { name: "item_id", type: "string"},
                { name: "quantity", type: "number" },
                { name: "unit_id", type: "number" },
                { name: "remarks", type: "string" },
            ],
            id:"item_id"
        };
      
        this.dataAdapter = new jqx.dataAdapter(this.gridSource);
    
        this.comboboxSource =
        {
            datatype: "json",
            datafields: [
                { name: "id" },
                { name: "name" },
                ],
            async: false,
            url: this.apiUrl+"item?limit=all"
        };
        this.comboboxAdapter = new jqx.dataAdapter(this.comboboxSource, {
          autoBind:true,
          downloadComplete: (data, status, xhr) => {
            let tData = data.data;
            return tData;
        }
        });
    data for combobox received from api:
        [
            {id: 1, code: "22", name: "xyzSection", …}
           ,
            {id: 2, code: "34", name: "ABC Section",…},
           
            {id: 3, code: "67", name: "nnn",…},
           
            {id: 4, code: "hh", name: "hh", …}
            
        ]
    
        this.columns =
        [
            { text: "Item Name", datafield: "item_id", displayfield:"name", columntype: "combobox", width: 120 ,
              initeditor: (row: number,cellvalue:string, editor: any,celltext:string,cellwidth:number,cellheight:number): void => {
                  editor.jqxComboBox({
                    source: this.comboboxAdapter,
                    displayMember: "name",
                    valueMember: "id"
                  });
              }
             },
            { text: "Quantity", datafield: "quantity", width: 120 },
            { text: "Unit", datafield: "unit_id", columntype: "textbox", width: 70 },
            { text: "Remarks", datafield: "remarks", columntype: "textbox", width: 120 },
        ];
    • This topic was modified 6 years, 7 months ago by  nyaupane37.
    • This topic was modified 6 years, 7 months ago by  nyaupane37.
    JQXCOMBOX AND GRID #97242

    Hristo
    Participant

    Hello nyaupane37,

    You could use only createeditor callback of that column.
    Please, take a look at this demo (‘Ship City’ column):
    https://www.jqwidgets.com/angular/angular-grid/angular-grid-customizededitors.htm

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.