We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

ejGrid -> column referencing an array (multiple values)

Thread ID:

Created:

Updated:

Platform:

Replies:

118264 Feb 17,2015 03:39 PM Feb 18,2015 07:18 AM JavaScript 1
loading
Tags: ejGrid
Duran
Asked On February 17, 2015 03:39 PM

I have an ejGrid with a column that is referencing a foreign data source using multiple values, but it is only displaying correctly for single-value arrays.  Is there a way to display multiple values?

example: 

var tableData = [
{
someGUID: '3eaf4e59-a462-417c-94b9-46d321b155e7',
someProperty: 'Default',
someIntID: 2,
arrayOfIDs: [2]
},
{
someGUID: '3eaf4e59-a462-417c-94b9-46d321b155e7',
someProperty: 'Default',
someIntID: 2,
arrayOfIDs: [2, 4]
}
];

var staticMappedData = [
{ID: 0, value: "a"},
{ID: 1, value: "b"},
{ID: 2, value: "c"},
{ID: 3, value: "d"}
];

$(document).ready(function () {
$("#grid").ejGrid({
dataSource: tableData,
columns: [
{ field: "someGUID" },
{ field: "someProperty" },
{
field: "arrayOfIDs",
foreignKeyField: "ID",
foreignKeyValue: "value",
dataSource: staticMappedData
}
]
});
});

Thanks.

-dave

Attachment: demo_fc46f206.zip

Madhu Sudhanan P [Syncfusion]
Replied On February 18, 2015 07:18 AM

Hi Dave,

Thanks for using Syncfusion products.

We have analyzed the attached sample and we would like to let you that it is not feasible to bind array value in columns using foreign key. But we can achieve your requirement with the column template feature of the grid.

Please refer the below code snippet.

//Helper function

function arrayMatch(){

       var fullData = this.data.arrayOfIDs, res = [];

             

       staticMappedData.filter(function(data){

              if($.inArray(data.ID,fullData) != -1){

                     res.push(data.value);

              }

       });

               

       return res.join(",");

}

$(document).ready(function () {

             

        //Registering helper

              $.views.helpers({ DisplayArray: arrayMatch});

             

                     $("#grid").ejGrid({

                           dataSource: tableData,

                           columns: [

                                  { field: "someGUID" },

                                  { field: "someProperty" },

                                  {

                                      field: "arrayOfIDs",

                                      //Defining the template of the column

                                      template: "{{:~DisplayArray()}}"

                                  }

                           ]

                     });

              });

 

For you convenience, we have modified the attached sample with the above code snippet and the same can be downloaded from the below location.

Sample Location: http://www.syncfusion.com/downloads/support/directtrac/118264/arraybinding1771230755.zip

For your kind information, we cannot perform grid actions such as sorting, filtering, grouping etc on template column.

Please let us know if you have any queries.

Regards,

Madhu Sudhanan. P



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;