Inline Grid combobox set value in javascript

6 posts, 1 answers
  1. Merve
    Merve avatar
    19 posts
    Member since:
    Aug 2020

    Posted 14 Aug 2020 Link to this post

    function GetWarehouseReleationByWarehouseId() {<br>    $.AjaxData.push({ key: 'WarehouseId', value: selectedWarehouse_OnWarehouseManagement.Id });<br>    AjaxTransactions(<br>        '../Warehouse/GetAllWarehouseRelationList/',<br>        $.AjaxData,<br>        function (result) {<br>            selectedWarehouseReleationData = result.Objects;<br><br>            KendoData('grdWarehouse_OnWarehouseRelation').dataSource.data([]);<br>            $.each(selectedWarehouseReleationData, function (index, data) {<br>                <br>                debugger;<br>                KendoData('grdWarehouse_OnWarehouseRelation').dataSource.add({<br>                    Id: data.Id,<br>                    Warehouse: { Id:1,WarehouseName:'test'},<br>                    ProcessType: { Value: data.WarehouseRelationProcessTypeId }<br>                   <br>                });              <br>            });<br><br>        }, 'post', 'json', false, false);<br>};

    This My JavaScript fonks I set Value ınline Grid Combobox Here!!


        grid._schemaMethod = {<br>        model: {<br>            id: 'Id',<br>            fields: {<br>                Warehouse: { defaultValue: { Id: '', WarehouseName: '' } },<br>                ProcessType: { defaultValue: { Value: '', Text: '' } },<br>            }<br>        }<br>        };<br>    grid._columns.push(grid.GridColumn('Id', null, '200px', null, null, null, null, null, null, null, true));<br>    grid._columns.push(grid.GridColumn('Warehouse', Field_RelatedWarehouse, '200px', null, "#=Warehouse.WarehouseName#", null, null, null, null, null, null, null, null, null, RelatedWarehouseEditor));<br>    grid._columns.push(grid.GridColumn('ProcessType',Field_ProcessType, '200px', null, "#=ProcessType.Text#", null, null, null, null, null, null, null, null, null, ProcessTypeEditor));<br>    grid._columns.push(grid.GridColumn(null, '&nbsp;', '200px', { style: 'text-align:right' }, null, null, null, null, null, null, null, null, null, ['edit', 'destroy']));


    This Part my Inlıne grid !!

     

    1.function ProcessTypeEditor(container, options) {<br><br>    var processType = [<br>        { "Text": "Transfer" , 'Value': 1 },<br>        { "Text": "Talep" , 'Value': 2 }<br>    ];<br>    $('<input name="' + options.field + '"/>')<br>        .appendTo(container)<br>        .kendoComboBox({<br>            autoBind: false,<br>            dataTextField: "Text",<br>            dataValueField: "Value",<br>            dataSource: { data: processType },<br>        });<br>};<br>function RelatedWarehouseEditor(container, options) {<br><br>    GetWarehouseListByFacilityId();<br><br>    $('<input name="' + options.field + '"/>')<br>        .appendTo(container)<br>        .kendoDropDownList({<br>            autoBind: true,<br>            dataTextField: "WarehouseName",<br>            dataValueField: "Id",<br>            dataSource: { data: warehouseList_OnContactInfo },<br>        });<br>};

    And I this Combobox Value 

     

    What Can I now I cant set my result to combobox Can you Help Me ? !  !!

  2.
  3. Merve
    Merve avatar
    19 posts
    Member since:
    Aug 2020

    Posted 14 Aug 2020 in reply to Merve Link to this post

    I sorry Bad View  ı add this.JavaScript Part

    01.function GetWarehouseReleationByWarehouseId() {
    02.    $.AjaxData.push({ key: 'WarehouseId', value: selectedWarehouse_OnWarehouseManagement.Id });
    03.    AjaxTransactions(
    04.        '../Warehouse/GetAllWarehouseRelationList/',
    05.        $.AjaxData,
    06.        function (result) {
    07.            selectedWarehouseReleationData = result.Objects;
    08. 
    09.            KendoData('grdWarehouse_OnWarehouseRelation').dataSource.data([]);
    10.            $.each(selectedWarehouseReleationData, function (index, data) {
    11.                 
    12.                debugger;
    13.                KendoData('grdWarehouse_OnWarehouseRelation').dataSource.add({
    14.                    Id: data.Id,
    15.                    Warehouse: { Id:1,WarehouseName:'test'},
    16.                    ProcessType: { Value: data.WarehouseRelationProcessTypeId }
    17.                    
    18.                });             
    19.            });
    20. 
    21.        }, 'post', 'json', false, false);
    22.};
  5. Merve
    Merve avatar
    19 posts
    Member since:
    Aug 2020

    Posted 14 Aug 2020 Link to this post

    My Grid Again=)

    01.function WarehouseGridOperations() {
    02.    var grid = new BaseGrid('grdWarehouse_OnWarehouseRelation');
    03.    grid._batch = true;
    04.    grid._autoBind = false;
    05.    grid._dataSourceAutoSync = false;
    06.    grid._toolbar = ['create'/*, 'save', 'cancel'*/];
    07.    grid._editable = {
    08.        mode: "inline",
    09.        create: true,
    10.        update: true,
    11.        destroy: true,
    12.        edit: false,
    13.    };
    14.    grid._autoBind = true;
    15. 
    16.    grid._schemaMethod = {
    17.        model: {
    18.            id: 'Id',
    19.            fields: {
    20.                Warehouse: { defaultValue: { Id: '', WarehouseName: '' } },
    21.                ProcessType: { defaultValue: { Value: '', Text: '' } },
    22.            }
    23.        }
    24.        };
    25.    grid._columns.push(grid.GridColumn('Id', null, '200px', null, null, null, null, null, null, null, true));
    26.    grid._columns.push(grid.GridColumn('Warehouse', Field_RelatedWarehouse, '200px', null, "#=Warehouse.WarehouseName#", null, null, null, null, null, null, null, null, null, RelatedWarehouseEditor));
    27.    grid._columns.push(grid.GridColumn('ProcessType',Field_ProcessType, '200px', null, "#=ProcessType.Text#", null, null, null, null, null, null, null, null, null, ProcessTypeEditor));
    28.    grid._columns.push(grid.GridColumn(null, ' ', '200px', { style: 'text-align:right' }, null, null, null, null, null, null, null, null, null, ['edit', 'destroy']));
    29. 
    30. 
    31.    grid._updateMethod = function (options) {
    32. 
    33.    };
    34. 
    35.    grid._editMethod = function (options) {
    36. 
    37.    };
    38. 
    39.    grid._createMethod = function (options) {
    40.        
    41.        for (var a = 0; a < options.data.models.length; a++) {
    42.            for (var i = a+1 ; i < options.data.models.length; i++) {
    43.                if (options.data.models[i].ProcessType.Value == options.data.models[a].ProcessType.Value && options.data.models[i].Warehouse.Id == options.data.models[a].Warehouse.Id) {
    44.                    toastr.error(Message_DefinedRecord);
    45.                    return null;
    46.                }
    47.            }
    48.        }  
    49.        KendoData('grdWarehouse_OnWarehouseRelation').refresh();
    50.    };
    51. 
    52.    $(".k-grid-update").on("click", function (e) {
    53.    });
    54.    grid._readMethod = function (e) {
    55.    };
    56.    grid._cancelMethod = function (e) {
    57.        KendoData('grdWarehouse_OnWarehouseRelation').refresh();
    58.    };
    59.    grid._dataBoundMethod = function (e) {
    60.        e.sender.items().each(function () {
    61.             
    62.            var dataItem = e.sender.dataItem(this);
    63.            kendo.bind(this, dataItem);
    64.        });
    65.    };
    66.    grid.GetGrid();
    67.};

     

    My Set Value

    01.function ProcessTypeEditor(container, options) {
    02. 
    03.    var processType = [
    04.        { "Text": "Transfer" , 'Value': 1 },
    05.        { "Text": "Talep" , 'Value': 2 }
    06.    ];
    07.    $('<input name="' + options.field + '"/>')
    08.        .appendTo(container)
    09.        .kendoComboBox({
    10.            autoBind: false,
    11.            dataTextField: "Text",
    12.            dataValueField: "Value",
    13.            dataSource: { data: processType },
    14.        });
    15.};
    16.function RelatedWarehouseEditor(container, options) {
    17. 
    18.    GetWarehouseListByFacilityId();
    19. 
    20.    $('<input name="' + options.field + '"/>')
    21.        .appendTo(container)
    22.        .kendoDropDownList({
    23.            autoBind: true,
    24.            dataTextField: "WarehouseName",
    25.            dataValueField: "Id",
    26.            dataSource: { data: warehouseList_OnContactInfo },
    27.        });
    28.};
  7. Eyup
    Admin
    Eyup avatar
    4074 posts

    Posted 18 Aug 2020 Link to this post

    Hello Merve,

     

    Do you want to achieve something like filtering for the combo based on some value from the grid? Or vice versa?

    Kendo combobox supports both filtering on client and server-side. All you need to do is set the filter property:
    https://demos.telerik.com/kendo-ui/combobox/serverfiltering

    And then use the value() + trigger() methods to force a filtering action:
    https://docs.telerik.com/kendo-ui/api/javascript/ui/combobox/methods/value

    If you have different requirements or further instructions, could you share some screenshots or video and modify the following live sample to simulate your configuration with some dummy data?
    https://dojo.telerik.com/iNuwuGEg/2

     

    Regards,
    Eyup
    Progress Telerik

  9. Merve
    Merve avatar
    19 posts
    Member since:
    Aug 2020

    Posted 19 Aug 2020 Link to this post

    I  find the way and I'm sharing my code for the friend who will face the same Problem...

     

    function GetWarehouseReleationByWarehouseId() {
        var tranferTypeName, warehouseId,warehouseName;
        
     
        $.AjaxData.push({ key: 'WarehouseId', value: selectedWarehouse_OnWarehouseDefinition.Id });
        AjaxTransactions(
            '../Warehouse/GetAllWarehouseRelationList/',
            $.AjaxData,
            function (result) {
                selectedWarehouseReleationData = result.Objects;
                 
                KendoData('grdWarehouse_OnWarehouseRelation').dataSource.data([]);
                $.each(selectedWarehouseReleationData, function (index, data) {
                    if (data.WarehouseRelationProcessTypeId==1) {
                        tranferTypeName = "Transfer"
                        warehouseId = data.TargetWarehouseId
                        warehouseName= data.WarehouseTargetName;
                    }
                    else {
                        tranferTypeName = "Request";
                        warehouseId = data.SourceWarehouseId;
                        warehouseName = data.WarehouseSourceName;
                    }
                   
                    KendoData('grdWarehouse_OnWarehouseRelation').dataSource.add({
                         
                        Id: data.Id,
                        Warehouse: { WarehouseName: warehouseName , Id: warehouseId },
                        ProcessType: { Text: tranferTypeName , Value : data.WarehouseRelationProcessTypeId}
                        
                    });             
                });
     
            }, 'post', 'json', false, false);
    };
  11. Answer
    Eyup
    Admin
    Eyup avatar
    4074 posts

    Posted 20 Aug 2020 Link to this post

    Hi Merve,

     

    I'm glad the issue is now resolved and thank you for sharing your solution with our community.

     

    Regards,
    Eyup
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top