This is a migrated thread and some comments may be shown as answers.

Filtering in javascript function and return value

6 Answers 96 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Aktzc
Top achievements
Rank 1
Aktzc asked on 03 Apr 2014, 01:32 PM
Hi,

Am new to kendo UI, so am not sure how I can do this task.

Problem: I have two data sources(Vtest.json file and Vdata.json file) that I want to populate in a single kendo grid. The grid is populated in such a way that the first three columns are populated from data.json file and the last column should be populated from Vtest.json file based on the first column in the grid. So I am trying to call a javascript function in the last column template in kendo grid. But am unable to filter the data and return the result to third column.

Here is the sample code:

 var vDS = new kendo.data.DataSource({
        transport: {
            read: {
                url: "/views/VTest.json",
                dataType: "json"
            }
        }
    });
    
    //alert(JSON.stringify(vendorDS));

 
    var nodeDS = new kendo.data.DataSource({
        transport: {
            read: {
                url: "/views/Vdata.json",
                dataType: "json"
            }
        },
        pageSize: 1000
    });

  $("#gridAllRuns").kendoGrid({
                    
                    dataSource: nodeDS,                    
                    groupable: true,
                    sortable: true,
                    pageable: {
                        refresh: true,
                        pageSizes: true,
                        buttonCount: 10
                    },
                    filterable: {
                        extra: false,
                        operators: {
                            string: {
                                startswith: "Starts with",
                                eq: "Is equal to",
                                neq: "Is not equal to"
                            }
                        }
                    },
                  
                    columns: [
                        {
                            title: "Node name",
                            field: "location",
                            template: "<a href=\"\">#= location.substr(7, location.length)#</a> ",
                            filterable: true
                            },
                              {
                                  title: "UTC Date",
                                  field: "date_UTC",
                                  filterable: false
                              },
                              {
                                  title: "Actual Value",
                                  field: "wavg_bin_value1",
                                  filterable: false
                              },
                          
                              {
                                  title: "Vendor",
                                  field: "",
                                  template: "#= getVendor(location) #",
                                  filterable: true
                              }
                            
                    ]
                })
//my javascript function....
  function getVendor(location) {
        var node = location.substr(7, location.length);
       vDS.filter({ field: "node", operator: "eq", value: node });
       return vDS.view()[0].Vndr;
}



6 Answers, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 07 Apr 2014, 11:12 AM
Hello Aktzc,

We cannot determine what exactly fails just from the code that you shared. Please demonstrate your case with a small Dojo example.

Kind Regards,
Petur Subev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Aktzc
Top achievements
Rank 1
answered on 07 Apr 2014, 08:43 PM
Hi Petur Subev,

I have two datasources for two grids. I want to merge them into one grid. There is one column in second grid that is dependent on the first grid. Can you please let me know how to merge two grids based on a column that is common in both the datasources.

Thanks!
0
Aktzc
Top achievements
Rank 1
answered on 08 Apr 2014, 01:14 PM
For Example, consider the following example:

http://jsbin.com/equtos/3/edit

Here it is populating two separate grids. I want to combine those grids on the OrderId Column, and should be able to sort/filter based on CustomerID or Employee ID.

Please help!
0
Petur Subev
Telerik team
answered on 09 Apr 2014, 09:21 AM
Hello Aktzc,

What do you mean by merge? The dataSource does not provide any JOIN functionality which you can use. Just create new collection out of the items from the two dataSources and then use it to create new dataSource that will represent both Grids.

Kind Regards,
Petur Subev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Aktzc
Top achievements
Rank 1
answered on 09 Apr 2014, 01:55 PM
Hi,

Thanks, for the reply! I am totally new to this. So, can you please help me.

For suppose, I have two dataSources like: 

var jobData =
    [
        { Id: 1, Title: 'Software Engineer' },
        { Id: 2, Title: 'Test Engineer' }
    ];
   
jobDS = new kendo.data.DataSource({
    data: jobData
});
   
var peopleData =
    [
        { Id: 1, FirstName: "John", LastName: "Doe", JobId: 1 },
        { Id: 2, FirstName: "Jayne", LastName: "Smith", JobId: 2 }
    ];
   
peopleDS = new kendo.data.DataSource({
    data: peopleData
});

How can I combine the two in jquery/javascript resulting in one datasource as follows:

var finalData = [
{ Id: 1, FirstName: "John", LastName: "Doe", Title: "Software Engineer", JobId: 1},
{Id: 2, FirstName: "Jayne", LastName: "Smith", Title: "Test Engineer", JobId: 2}
];
0
Accepted
Petur Subev
Telerik team
answered on 11 Apr 2014, 08:40 AM
Hello Aktzc,

Your question is not related to Kendo but to general JavaScript. Here is a small example that should bring you the idea:

http://trykendoui.telerik.com/@pesho/UJAf

Kind Regards,
Petur Subev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Aktzc
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Aktzc
Top achievements
Rank 1
Share this question
or