title: Pass all input values from a row in jQuery datatable to asp.net mvc
body: <p>Here is the table with the inputs I want to pass:</p>
  
  <p><a href="https://i.stack.imgur.com/96MwG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/96MwG.png" alt="The input I want to pass"></a></p>
  
  <p>Code:</p>
  
  <pre><code>        $(document).ready(function () {
  
              var table;
  
              $("#makeEditable").on("mousedown", "td .fa.fa-minus-square", function (e) {
                  table.row($(this).closest("tr")).remove().draw();
              })
  
              $("#makeEditable").on('mousedown.edit', "i.edit.material-icons", function (e) {           
                  $(this).text("save").removeClass().addClass("save material-icons");
                  var $row = $(this).closest("tr").off("mousedown");
                  var $tds = $row.find("td").not(':last');//.not(':first');
  
                  $.each($tds, function (i, el) {
                      var txt = $(this).text();
                      $(this).html("").append("&lt;input type='text' class=\"form-control valid\" value=\"" + txt + "\"&gt;");
                  });
  
              });
  
              $("#makeEditable").on('mousedown', "input", function (e) {
                  e.stopPropagation();
              });
  $("#makeEditable").on('mousedown.save', "i.save.material-icons", function (e) {
      var ubicacionesJquery = { ubicacion_id : $(this).attr("data-id"), armario: "input1", cajon: "input2" };
  
      $.ajax({
                      type: 'POST',
                      data: ubicacionesJquery,
                      url: '/gestiondeubicaciones/Editar',
                      cache: false,
                      success: function (result) {
                      }
             });
  
      $(this).text("edit").removeClass().addClass("edit material-icons");
      var $row = $(this).closest("tr");
      var $tds = $row.find("td").not(':last'); 
  
      $.each($tds, function (i, el) {
          var txt = $(this).find("input").val()
          $(this).html(txt);
      });
  });
  </code></pre>
  
  <p>Here is the html in My controller when NOT in editing mode</p>
  
  <pre><code>@using (Html.BeginForm("AnadirEditar", "gestiondeubicaciones", FormMethod.Post))
  {
      @Html.AntiForgeryToken()
      @Html.ValidationSummary(true)
      &lt;table class="table table-hover table-bordered" id="makeEditable"&gt;
          &lt;tfoot&gt;
  
              &lt;tr&gt;
                  &lt;td&gt;
                      &lt;div class="form-group"&gt;
                          @Html.TextBoxFor(a =&gt; a.armario, new { @class = "form-control", @id = "addArmario" })
                          @Html.ValidationMessageFor(model =&gt; model.armario, "", new { @class = "text-danger" })
                      &lt;/div&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;div class="form-group"&gt;
                          @Html.TextBoxFor(a =&gt; a.cajon, new { @class = "form-control", @id = "addCajon" })
                          @Html.ValidationMessageFor(model =&gt; model.cajon, "", new { @class = "text-danger" })
                      &lt;/div&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;a class="popup-add" href="#" onclick="AddData();" title="Anadir"&gt;
                          &lt;i class="add material-icons"&gt;add_box&lt;/i&gt;
                      &lt;/a&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tfoot&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;Armario&lt;/th&gt;
                  &lt;th&gt;Cajon&lt;/th&gt;
                  &lt;th&gt;&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
      &lt;/table&gt;
  }
  </code></pre>
  
  <p>And here is the html in the controller when in EDITING mode</p>
  
  <pre><code> &lt;table id="newRow" style="display:none"&gt;
          &lt;tbody&gt;
              &lt;tr&gt;
                  &lt;td&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;i class="material-icons" aria-hidden="true"&gt;edit&lt;/i&gt;
                      &lt;i class="delete material-icons"&gt;delete&lt;/i&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p>Here is the html that is generated when not in editing mode</p>
  
  <pre><code>&lt;table class="table table-hover table-bordered dataTable dtr-inline" id="makeEditable" role="grid" aria-describedby="makeEditable_info" style="width: 1749px; position: relative;"&gt;
      &lt;tfoot&gt;
  
          &lt;tr&gt;
              &lt;td rowspan="1" colspan="1"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input class="form-control" id="armario" name="armario" type="text" value=""&gt;
                      &lt;span class="field-validation-valid" data-valmsg-for="armario" data-valmsg-replace="true"&gt;&lt;/span&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
              &lt;td rowspan="1" colspan="1"&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input class="form-control" id="cajon" name="cajon" type="text" value=""&gt;
                      &lt;span class="field-validation-valid" data-valmsg-for="cajon" data-valmsg-replace="true"&gt;&lt;/span&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
              &lt;td rowspan="1" colspan="1"&gt;&lt;input type="submit" value="Salvar" class="btn btn-primary"&gt; &lt;a class="popup-add" href="#" onclick="AddData();" title="Anadir"&gt;&lt;i class="add material-icons"&gt;add_box&lt;/i&gt;&lt;/a&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tfoot&gt;
      &lt;thead&gt;
          &lt;tr role="row"&gt;&lt;th class="sorting_asc" tabindex="0" aria-controls="makeEditable" rowspan="1" colspan="1" style="width: 721.767px;" aria-label="Armario: Activar para ordenar la columna de manera descendente" aria-sort="ascending"&gt;Armario&lt;/th&gt;&lt;th class="sorting" tabindex="0" aria-controls="makeEditable" rowspan="1" colspan="1" style="width: 721.767px;" aria-label="Cajon: Activar para ordenar la columna de manera ascendente"&gt;Cajon&lt;/th&gt;&lt;th class="sorting" tabindex="0" aria-controls="makeEditable" rowspan="1" colspan="1" style="width: 190.767px;" aria-label=": Activar para ordenar la columna de manera ascendente"&gt;&lt;/th&gt;&lt;/tr&gt;
      &lt;/thead&gt;
  
      &lt;tbody&gt;&lt;tr role="row" class="odd"&gt;
              &lt;td class="sorting_1" tabindex="0"&gt;Grande E3&lt;/td&gt;
              &lt;td&gt;232&lt;/td&gt;
              &lt;td&gt;&lt;a class="popup-edit"&gt;&lt;i id="editSave" data-armario="Grande E3" data-id="23" class="edit material-icons" title="Detalles"&gt;edit&lt;/i&gt;&lt;/a&gt;&lt;a class="popup-delete" href="#" onclick="DeleteData(23);" title="Eliminar"&gt;&lt;i class="delete material-icons"&gt;delete&lt;/i&gt;&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
              &lt;tr role="row" class="even"&gt;&lt;td class="sorting_1" tabindex="0"&gt;Grande F23&lt;/td&gt;
              &lt;td&gt;527m&lt;/td&gt;
              &lt;td&gt;&lt;a class="popup-edit"&gt;&lt;i id="editSave" data-armario="Grande F23" data-id="29" class="edit material-icons" title="Detalles"&gt;edit&lt;/i&gt;&lt;/a&gt;&lt;a class="popup-delete" href="#" onclick="DeleteData(29);" title="Eliminar"&gt;&lt;i class="delete material-icons"&gt;delete&lt;/i&gt;&lt;/a&gt;&lt;/td&gt;
              &lt;/tr&gt;
     &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>This is what change when in editing mode.</p>
  
  <pre><code>&lt;td&gt;&lt;input type="text" class="form-control valid" value="232"&gt;&lt;/td&gt;
  </code></pre>
  
  <p>Where I wrote "input1" and "input2" I would like to have $tds[0] and $tds<a href="https://i.stack.imgur.com/96MwG.png" rel="nofollow noreferrer">1</a> but I don't know how to do int, I tried creating a var test=[];  and then <code>test.append(txt);</code> but it did not work. </p>
  
  <p>Any help would be appreciated. Thank you.</p>