Parent / child editing

nitink

I was going through your blog post about parent child editing see here

I see that you are using AJAX to retrieve the data for the child table. Also AJAX call to save that data back to server.

I my case, I get the data for child table when I make a AJAX server call for the parent. I am trying to create Parent / Child relationship for Question and Answers.

Here is how I am getting the data for the questions (which also has data for Answers). See JSON response below

{
  "data": [
    {
      "MediaFileType": null,
      "MediaFileId": null,
      "AnswerType": null,
      "Text": "First Quiz First Question",
      "Points": 20,
      "IsTextOnly": false,
      "AnswerTypeId": 0,
      "QuizId": 1,
      "Quiz": null,
      "Answers": [
        {
          "Text": "True",
          "IsRightAnswer": false,
          "SortOrder": 10,
          "ShowRandom": true,
          "QuestionId": 2,
          "Question": null,
          "Id": 4,
          "IsActive": true,
          "UpdateUser": "",
          "UpdateDate": "09/17/2019"
        },
        {
          "Text": "False",
          "IsRightAnswer": true,
          "SortOrder": 20,
          "ShowRandom": true,
          "QuestionId": 2,
          "Question": null,
          "Id": 5,
          "IsActive": true,
          "UpdateUser": "",
          "UpdateDate": "09/17/2019"
        }
      ],
      "QuestionMedias": [],
      "GuestCodes": [],
      "Tags": [],
      "Id": 2,
      "IsActive": true,
      "UpdateUser": "",
      "UpdateDate": "09/10/2019"
    },
    {
      "MediaFileType": null,
      "MediaFileId": null,
      "AnswerType": null,
      "Text": "First Quiz Second Question",
      "Points": 20,
      "IsTextOnly": false,
      "AnswerTypeId": 0,
      "QuizId": 1,
      "Quiz": null,
      "Answers": [
        {
          "Text": "Yes",
          "IsRightAnswer": true,
          "SortOrder": 10,
          "ShowRandom": true,
          "QuestionId": 3,
          "Question": null,
          "Id": 2,
          "IsActive": true,
          "UpdateUser": "",
          "UpdateDate": "09/17/2019"
        },
        {
          "Text": "No",
          "IsRightAnswer": false,
          "SortOrder": 20,
          "ShowRandom": true,
          "QuestionId": 3,
          "Question": null,
          "Id": 3,
          "IsActive": true,
          "UpdateUser": "",
          "UpdateDate": "09/17/2019"
        }
      ],
      "QuestionMedias": [],
      "GuestCodes": [],
      "Tags": [],
      "Id": 3,
      "IsActive": true,
      "UpdateUser": "",
      "UpdateDate": "09/10/2019"
    }
  ],
  "files": { "files": {} }
}

How can I use the Answers array that I get in the data returned from the server without making another trip to the server. Also, how I can update the Answers with the information user adds/edits before submitting the question back to the server.

allan

Since you already have the data for the child table, don't use ajax, just pass the data into the DataTable using data. e.g.:

table.DataTable( {
    data: rowData.Answers,
    ...
} );

Allan

allan

how I can update the Answers with the information user adds/edits before submitting the question back to the server.

Miss this bit - sorry. Assuming you want Editor to submit the edited child row to the server, you'd probably need to use postEdit (or postCreate / postRemove) to update the content of the parent table with the new data.

Allan

nitink

Thank you Allan. I was able to get it working. The only issue I am seeing now is that the inline child table (Answers) is not showing any headers. Do you know what I can do so that it shows the headers?

nitink

Never mind. I figured it out. I had forgotten to add title in column definitions

            columns: [
                { "data": "Id", "visible": false },
                { title: "Answer Text", "data": "Text" },
                { title: "Is Right Answer?", "data": "IsRightAnswer" },
                { title: "Show Random?", "data": "ShowRandom" },
            ],

It's working fine now. I will close this question as answered.

Once again, Thank You so much.