Hello Telerik team
--------------- Problem ---------------
I'm using Kendo template to show a Grid. Data bind to this Grid retrieves from 3 tables, each table in Database map to a class in source.
I build my grid using Kendo template, and bind to div using Kendo.
html
<div id="GridQuestion" data-bind="..."></div>
<
script
type
=
"text/html"
id
=
"temp-grid"
>
<
div
data-bind
=
"..."
>
.... grid structure
</
div
>
</
script
>
kendo.bind($('#GridQuestion'), questionViewModel);
Grid shows data as this: List groupQuestionSet, each groupQuestionSet contains many QuestionSet, each QuestionSet contains many Question.
This is Grid screen in browser:
This is Table Relationship.
This is storeprocedure, SQL query :
SELECT
GroupQuestionSet.Id
AS
'GroupQuestionSetId'
, GroupQuestionSet.GroupQuestionSetName, QuestionSet.Id
AS
'QuestionSetId'
, QuestionSet.QuestionSetName, Question.Id
as
'QuestionId'
, Question.QuestionContent
FROM
GroupQuestionSet
INNER
JOIN
QuestionSet
ON
GroupQuestionSet.Id = QuestionSet.GroupQuestionSetId
INNER
JOIN
Question
on
Question.QuestionSetId = QuestionSet.Id
This is JSON test data :
function
initTestData() {
//This is data from GroupQuestionSetTable in database
var
GroupQuestionSetTable = [
{
"Id"
: 1,
"GroupQuestionSetName"
:
"GroupQuestionSet 1"
},
{
"Id"
: 2,
"GroupQuestionSetName"
:
"GroupQuestionSet 2"
},
{
"Id"
: 3,
"GroupQuestionSetName"
:
"GroupQuestionSet 3"
}
];
//This is data from QuestionSetTable in database
//GroupQuestionSetId if foreign key link to Id column of GroupQuestionSetTable
var
QuestionSetTable = [
{
"Id"
: 1,
"GroupQuestionSetId"
: 1,
"QuestionSetName"
:
"QuestionSet 1"
},
{
"Id"
: 2,
"GroupQuestionSetId"
: 1,
"QuestionSetName"
:
"QuestionSet 2"
},
{
"Id"
: 3,
"GroupQuestionSetId"
: 1,
"QuestionSetName"
:
"QuestionSet 3"
},
{
"Id"
: 4,
"GroupQuestionSetId"
: 2,
"QuestionSetName"
:
"QuestionSet 4"
}
];
//This is data from SubQuestionTable in database
//QuestionSetId if foreign key link to Id column of QuestionSetTable
var
QuestionTable = [
{
"Id"
: 1,
"QuestionSetId"
: 1,
"QuestionContent"
:
"QuestionContent 1"
},
{
"Id"
: 2,
"QuestionSetId"
: 1,
"QuestionContent"
:
"QuestionContent 2"
},
{
"Id"
: 3,
"QuestionSetId"
: 1,
"QuestionContent"
:
"QuestionContent 3"
},
{
"Id"
: 4,
"QuestionSetId"
: 2,
"QuestionContent"
:
"QuestionContent 4"
}
];
}
------------------------ need ------------------------
When I create, update, delete Question inside QuestionSet (or GroupQuestionSet or QuestionSet) Grid only interact with Database and only reload that row. The same as when we use Kendo grid with create, read, update, delete
------------------------ My curent solution ------------------------
When insert, update, del: Browser rebind all grid. -> it will slow if we have large data.
------------------------ My temporary solution ------------------------
I have read this topic http://stackoverflow.com/questions/16097878/kendo-ui-unable-to-bind-data-to-list-view-using-mvvm but I don't understand.
My temporary solution is :
Source:
Contruct a Temp object the same as result table from above query-->Load Kendo grid using that list of Temp object and use Kendo grid with create, read, update, delete -> In create, read, update, delete I will write code to create, read, update, delete to only GroupQuestionSet or QuestionSet or Question
I still looking for some other solutions.
Thank you.