Trying to understand the DataSource part II

[Paul]

Hi,

A seconde question about the DataSource is how can we get the Data of a subset into f.i. a grid. Here's the code we use for our JSON services.

[DataContract]

public partial class VMProject : VMRoot

{

public VMProject() {}

public static VMProject GetById(object sender, int id)

{

return CallGetVMById<VMProject>("", id);

}

public static VMEntitySet<VMProject> AllVMProjectList(object sender)

{

return (VMEntitySet<VMProject>)CallGetVMAllList<VMEntitySet<VMProject>>(sender);

}

[DataMember]

public String Name

{

get { return CallGetData<String>("Name"); }

set { CallSetData ("Name", value); }

}

[DataMember]

public VMEntitySet<VMProjectRegel> ProjectRegelList

{

get { return CallGetData<VMEntitySet<VMProjectRegel>>("ProjectRegelList"); }

// set { CallSetData ("ProjectRegelList", value); }

}

}

The consumed class VMRoot looks like this:

[DataContract]

public partial class VMRoot : Viewmodel

{

public VMRoot() {}

public static VMRoot GetById(object sender, int id)

{

return CallGetVMById<VMRoot>("", id);

}

public static VMEntitySet<VMRoot> AllVMRootList(object sender)

{

return (VMEntitySet<VMRoot>)CallGetVMAllList<VMEntitySet<VMRoot>>(sender);

}

[DataMember]

public Int32 Id

{

get { return CallGetData<Int32>("Id"); }

set { CallSetData ("Id", value); }

}

[DataMember]

public DateTime CreatedOn

{

get { return CallGetData<DateTime>("CreatedOn"); }

set { CallSetData ("CreatedOn", value); }

}

[DataMember]

public Int32 CreatedBy

{

get { return CallGetData<Int32>("CreatedBy"); }

set { CallSetData ("CreatedBy", value); }

}

[DataMember]

public DateTime ChangedOn

{

get { return CallGetData<DateTime>("ChangedOn"); }

set { CallSetData ("ChangedOn", value); }

}

[DataMember]

public Int32 ChangedBy

{

get { return CallGetData<Int32>("ChangedBy"); }

set { CallSetData ("ChangedBy", value); }

}

}

The VMEntitySet is an ObservableCollection which contains VMProjectRegel objects. These are defined like so:

[DataContract]

public partial class VMProjectRegel : VMRoot

{

public VMProjectRegel() {}

public static VMProjectRegel GetById(object sender, int id)

{

return CallGetVMById<VMProjectRegel>("", id);

}

public static VMEntitySet<VMProjectRegel> AllVMProjectRegelList(object sender)

{

return (VMEntitySet<VMProjectRegel>)CallGetVMAllList<VMEntitySet<VMProjectRegel>>(sender);

}

[DataMember]

public Int32 Aantal

{

get { return CallGetData<Int32>("Aantal"); }

set { CallSetData ("Aantal", value); }

}

[DataMember]

public Decimal Prijs

{

get { return CallGetData<Decimal>("Prijs"); }

set { CallSetData ("Prijs", value); }

}

[DataMember]

public Decimal BTW

{

get { return CallGetData<Decimal>("BTW"); }

set { CallSetData ("BTW", value); }

}

}

The JSON we receive looks like this:

[

{

"DatumAanvang": "\/Date(1345732135057+0200)\/",

"DatumFaktuur": "\/Date(1345732135059+0200)\/",

"Name": "Project onderhoud",

"ProjectRegelList": [

{

"Aantal": 99,

"Prijs": 99.000000000000,

"BTW": 1.000000000000,

"Id": 101,

"CreatedOn": "\/Date(1345732135085+0200)\/",

"CreatedBy": 10,

"ChangedOn": "\/Date(1345732135085+0200)\/",

"ChangedBy": 10

}

],

"Id": 1,

"CreatedOn": "\/Date(1345732135060+0200)\/",

"CreatedBy": 10,

"ChangedOn": "\/Date(1345732135060+0200)\/",

"ChangedBy": 10

}

]

The DataSource is defined like so:

var dataSourceprojecten = new kendo.data.DataSource(

{

// the transport tells the datasource what endpoints

// to use for CRUD actions

schema:

{

model:

{

id: "Id",

fields:

{

DatumAanvang:

{

type: "date"

},

DatumFaktuur:

{

type: "date"

},

Name:

{

type: "string"

},

CreatedOn:

{

"type": "date"

},

CreatedBy:

{

"type": "number"

},

ChangedOn:

{

"type": "date"

},

ChangedBy:

{

"type": "number"

}

}

}

},

transport:

{

read:

{

url: "../api/projectonderhoud/get",

dataType: "json"

}

}

});

after executing the dataSourceprojecten.read() the data is available for the main list but how do we specify the fetch for the ProjectRegelsList in f.i. a grid?

This is what I have tried (among many other attempts) to get it to work:

                      $("#projectregels").kendoGrid(

                {

                    dataSource:

                    {

                    schema:

                    {

                        model: ProjectRegel

                    },

                    data: dataSourceprojecten.ProjectRegelList

                    },                       

                    groupable: true,

                    sortable: true,

                    pagesize: 10,

                    columns:

                    [

                        {

                            field: "Id",

                            title: "Id"

                        },

                        {

                            field: "Aantal",

                            title: "Aantal"

                        },

                        {

                            field: "Prijs"

                        },

                        {

                            field: "BTW"

                        },

                        {

                            field: "CreatedOn",

                            title: "Created on",

                            template: '#= kendo.toString(CreatedOn,"dd MM yyyy") #'

                        },

                        {

                            field: "CreatedBy"

                        }

                    ]

                });

Regards
Paul

[Atanas Korchev]

Hi Paul,

 It looks that this data is already available:

[

{

"DatumAanvang": "\/Date(1345732135057+0200)\/",

"DatumFaktuur": "\/Date(1345732135059+0200)\/",

"Name": "Project onderhoud",

"ProjectRegelList": [

{

"Aantal": 99,

"Prijs": 99.000000000000,

"BTW": 1.000000000000,

"Id": 101,

"CreatedOn": "\/Date(1345732135085+0200)\/",

"CreatedBy": 10,

"ChangedOn": "\/Date(1345732135085+0200)\/",

"ChangedBy": 10

}

],

"Id": 1,

"CreatedOn": "\/Date(1345732135060+0200)\/",

"CreatedBy": 10,

"ChangedOn": "\/Date(1345732135060+0200)\/",

"ChangedBy": 10

}

]

How do you want to use that field?

Regards,
Atanas Korchev
the Telerik team

[Paul]

Atanas,

Ah, ok I will try and clarify. In fact the data represents a master detail page. We would like to use the Project data in page and on the same page a grid that shows the ProjectRegel collection. How do we go about that?

Regards
Paul

[Atanas Korchev]

Hi,

 It is still not clear how the ProjectRegel collection is going to be used from the grid data source. Please clarify.

Regards,
Atanas Korchev
the Telerik team

[Paul]

Please take a close look at the VMProject class at the top of this post. You will see there is a VMEntitySet<ProjectRegel> collection in that class. So what I want is to use 1 datasource that fetches the data from the server via a controller. The JSON returned will be a list within a list. Each 'Project' has many 'ProjectRegel' entities. We would like to show the first project in the list as the master and the list of ProjectRegel as a grid.

[Atanas Korchev]

Hi Paul,

 I created a sample which shows how to do the same: http://jsbin.com/uwipad/1/edit 

I hope this helps,
Atanas Korchev
the Telerik team