Answers

• colin Posts: 15,240Questions: 1Answers: 2,599

  October 2019

  not able to get the data which are not editable

  When you say you're not able to get the data, where do you want to get it? On the server, or the client? Before editing, or before submitting? Please add more information so we can help you,

  Colin
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019

  Now I added few fields in the editor and made it as hidden now I am able to get in data of preSubmit event but unable to get it in the server side(not using datatable dll's, normal web Api's)

  Editor fields intialization

  editor = new $.fn.dataTable.Editor({
      table: "#exmp",
      ajax:"api/sample/post",
      formOptions: {
          inline: {    
              submit: 'all'
          }
      },
      idSrc: "count",
  fields: [ 
          {
              name: "rollNumber",
              type: "hidden"
          },{
              name: "firstName",
              type: "text"
          }]
   });
  

  Editor Presubmit event

  editor.on('preSubmit', function (event, obj, action) {
              if (action !== 'remove') {
                  console.log(obj);
  });
  

  and how to update that row with the updated data from the server?
• colin Posts: 15,240Questions: 1Answers: 2,599

  October 2019

  I'm still not clear, you didn't answer my questions. If you want to send data to the server in the preSubmit, then the second arg is data (you've got it wrong in your code above, see the link) - you can values to that and they'll be accessible on the server. The example on the reference page is doing something similar (there it's changing a value, you can add one too).
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019 edited October 2019

  I am sorry I am not getting what you are asking.

  In preSubmit the second argument is obj I mentioned.

  I can see the edited data and the obj data looks like below.

  action: "edit"
  data:
  1:
  rollNumber: "123"
  firstName: "Abhishek" //Consider this is the edited data

  In the Controller of MVC

  [Route("api/sample/post", Name = "PostTie")]
  public IHttpActionResult PostTie([FromBody]StudentModel obj)
  {
  //obj.rollNumber is null here
  //obj.firstName is null here
  // My logic goes here
  }

  In the obj object in Controller all the fields are null, data is not getting bind to that property.

  Hope I answered your questions clearly.
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019

  Editor field initialization.

  editor = new $.fn.dataTable.Editor({
      table: "#exmp",
      ajax: {
          edit: {
              type: 'POST',
              url: 'api/tie/samplepost',
              contentType: "application/json",
              data: function (data) {
                  return JSON.stringify(data);
              }
         }
      },
      formOptions: {
          inline: {   
              submit: 'all'
          }
      },
      idSrc: "count",
  fields: [
          {
              name: "rollNumber",
              type: "hidden"
          },{
              name: "firstName",
              type: "text"
          }]
   })
  
  

  Data in server side is null for all the fields, referredajax.data Submit data as JSON in the request body is not working
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  October 2019

  If you look at the network inspector in your browser, look at the Headers tab for the Ajax request that is being made - what does it show the parameters being sent to the server are?

  My guess is there is some issue reading the values on the server-side, rather than a client-side issue. For that, you might need to ask on SO or similar, but I'd like to check that the data is actually being sent to the server first. If you have a screenshot of that network / headers tab, that would be great. If that isn't possible perhaps you can give me a link to the page.

  Allan
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019 edited October 2019

  Hi @allan , if I change the return to JSON.stringify(data.data[1]) ,it is working, but my question is index value is keep on changing for ex Row1 it is 1 for Row2 it is 2.

  How can i get the index number of the data object?

   ajax: {
          edit: {
              type: 'POST',
              url: 'api/tie/samplepost',
              contentType: "application/json",
              data: function (data) {
                  return JSON.stringify(data.data[1]);
              }
         }
      },
  
  
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  October 2019

  Somewhat surprised by that. Does it work on all rows? The inner data object is keyed by the id property of the row(s) being edited. I would have expected Object.keys() or similar to be required to determine which rows were edited.

  Allan
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019

  I used like this to submit the data to server, yes @allan it is working.

  ajax: {
         edit: {
             type: 'POST',
             url: 'api/tie/samplepost',
             contentType: "application/json",
             data: function (data) {
                 return JSON.stringify(data.data[1]);
             }
        }
     },
  
  

  @allan/ @colin How can I update the row of the editor table with the new data from the server
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  October 2019

  The documentation here shows what Editor expects in return from the server to update the table.

  Allan
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019 edited October 2019

  Thank you @allan , I made changes like below in Wep Api now I am able to get the response same like it is mentioned in the documentation.

  var json = JToken.FromObject(new { data = result});
  return Ok(json);

  Again a new problem after the response from the Web api to submitComplete the row in the UI is disappearing.

   editor.on('submitComplete', function (e, json, data, action) {
     alert("To check the event is triggred")
      //Do I need to add anything in this to update the 
     // row with the new data received in json object           
    });
  

  What do I need to do to update the row with new data ?
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  October 2019

  Perhaps you can show me the JSON that your server-side script is returning please? It sounds like it isn't returning what Editor expects.

  Allan
• Abhishek K S Posts: 12Questions: 1Answers: 1

  October 2019 Answer ✓

  @allan this solved my problem.

  editor.on('postSubmit', function( e, json, data, action ) {
      json.data = [json];
  });
  
• SotirPleqaj Posts: 1Questions: 0Answers: 0

  March 2020 edited March 2020

  @Abhishek K S hey mate, i'm having the same issue. Where do you put the Editor postSubmit event? At what part of the code.
• Abhishek K S Posts: 12Questions: 1Answers: 1

  April 2020

  @SotirPleqaj , apologies for the late reply, I am not very active in this forum. Below is the answer to your question

  var editor ; // global variable
  
  editor = new $.fn.dataTable.Editor({
      table: "#exampleEditorTable",
      ajax: { 
      // Ajax call
      // Fields
  }); //Close the Editor Function
  
  // Below this call editor Post submit
  editor.on('postSubmit', function( e, json, data, action ) {
      json.data = [json];
  });