Inline Create Add Dynamic Data

Inline Create Add Dynamic Data

Pierre-LouisPierre-Louis Posts: 10Questions: 3Answers: 0

Hi,

Is there a way to add dynamic data to a row that is being added via inline create ?
There is the def parameter for the default value but i can't figure out how to add data dynamically on inline create

 articlePrixRefsTable = $('#articlePrixRefsTable').DataTable({    
          columns: [
              {
                  data: 'Annee',
                  name: 'Annee'
              },
              {
                  data: 'PrixReference',
                  name: 'PrixReference',
                  render: function (data, type, row) {
                      if (type == "display")
                          return `<div>${parseFloat(data).toFixed(2)}</<div>`;
                      return data;
                  }
              },
              {
                  data: 'TempsGameRetenuCalc',
                  name: 'TempsGameRetenuCalc',
                  render: function (data, type, row) {
                      if (type == "display")
                          return `<div>${parseFloat(data).toFixed(2)}</<div>`;
                      return data;
                  }
              },
              {
                  data: 'CoefTemps',
                  name: 'CoefTemps'
              },
              {
                  data: 'TempsGammeStdCalc',
                  name: 'TempsGammeStdCalc'
              },
              {
                  data: 'PctRebut',
                  name: 'PctRebut'
              },
              {
                  data: 'IsAchete',
                  name: 'IsAchete',
                  render: (data, type, row) => 
                      type === "display" ?
                          '<input type="checkbox" disabled class="editor-active">' : data,
                      className: 'dt-body-center'
              },
              {
                  data: 'CodeSourceListe2',
                  name: 'CodeSourceListe2',
                  render: (data, type, row) => {
                      if (type === "display") return listCodeSource.find(o => o.value == data)?.label
                      return data;
                  }
              },
              {
                  data: 'DateCreation',
                  name: 'DateCreation',
                  render: function (data, type, row) {
                      if (type === "display")
                          return new Date(data).toLocaleDateString() ?? data;
                      return data;
                  }
              },
              {
                  data: 'IdArticlePrixRef',
                  name: 'IdArticlePrixRef',
                  visible: false
              }
          ]
      });
  }

  articlePrixRefsTableEditor = new DataTable.Editor({
      table: $('#articlePrixRefsTable'),
      idSrc: 'IdArticlePrixRef',
      fields: [
          {
              name: 'Annee',
              def: new Date().getFullYear(),
              type: 'readonly'
          },
          {
              name: 'PrixReference',
              def: 0.00,
              type: 'readonly'
          },
          {
              name: 'IsAchete',
              type: 'readonly',
          },
          {
              name: 'CodeSourceListe2',
              type: 'select',
              options: listCodeSource
          },
          {
              name: 'DateCreation',
              type: 'readonly',
              def: new Date().toLocaleString()
          },
          {
              name: 'CoefTemps',
              def: ''
          }
      ]
  })

  articlePrixRefsTable.on('click', 'tbody td:first-child,td:nth-child(2),td:nth-child(8)', function (e) {
      articlePrixRefsTableEditor.inline(this);
  })

  articlePrixRefsTableEditor.on('submitSuccess', () => {
      enableSaveButton();
  })

  $('#btnAddRowPrixRefsTable').on('click', function () {

// I guess somewhere around here i want to make an ajax call to retrieve some data to add dynamically to the row


      articlePrixRefsTableEditor.inlineCreate(({
          onBlur: 'submit'
      }))
  })

Answers

  • allanallan Posts: 63,498Questions: 1Answers: 10,471 Site admin

    If you want the data to be based on the result from an Ajax call, I would add an Ajax call immediately after your inlineCreate() call, and then use field().val() to set the value of the field with the result from your Ajax call.

    Allan

Sign In or Register to comment.