How to build a string with array index and elements

Question

can anyone explain me how can I build a string out of the number of values inside an array with their elements.

For example right now I have this table, it pulls data out of the table if the we type a value inside the txtbox, anyway, this builds an array of data of the rows

function setValueAttr(el) {
  el.setAttribute('value', el.value)
}

function aplicar() {
  var myTab = document.querySelectorAll('#tableID tbody tr .txtID:not([value=""])');
  var tableData = [];
  Array.from(myTab).forEach(input => {
    var tds = input.closest('tr').children;
    var obj = {};
    obj.A = tds[0].textContent;
    obj.B = tds[1].textContent;
    obj.C = tds[2].textContent;
    obj.D = tds[3].textContent;
    obj.E = input.value;
    tableData.push(obj);
  });
  console.log(tableData);
}

<table class="table table-bordered" width="100%" cellspacing="0" id="tableID">
  <thead>
    <tr>
      <th>num</th>
      <th>mon</th>
      <th>doc</th>
      <th>type</th>
      <th>val</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td align="center">val1</td>
      <td align="center">val2</td>
      <td align="center">val3</td>
      <td align="center">1500</td>
      <td align="center" class="myID"><input type="number" name="txtID" class="txtID" oninput="setValueAttr(this)" value="" min="0" max="1000"></td>
    </tr>
    <tr>
      <td align="center">val1</td>
      <td align="center">val2</td>
      <td align="center">val3</td>
      <td align="center">1500</td>
      <td align="center" class="myID"><input type="number" name="txtID" class="txtID" oninput="setValueAttr(this)" value="" min="0" max="1000"></td>
    </tr>
    <tr>
      <td align="center">val1</td>
      <td align="center">val2</td>
      <td align="center">val3</td>
      <td align="center">1500</td>
      <td align="center" class="myID"><input type="number" name="txtID" class="txtID" oninput="setValueAttr(this)" value="" min="0" max="1000"></td>
    </tr>
  </tbody>
</table>
<form>
  <button type="button" onclick="aplicar()">Aplicar</button>
</form>

I need to create a string out of this data like this

total[]=&num1={}&mon1={}&doc1={}&type1={}&val1={}&num2={}&mon2={}&doc2={}&type2={}&val2={}

Where

total = *n* the number of elements inside tableData[]

And

numN monN typeN valN = the values inside an element of tableData[]

Used that structure because of the output of the html example

[
  {
    "A": "val1",
    "B": "val2",
    "C": "val3",
    "D": "1500",
    "E": "1000"
  }
]

Currently using this to post into Controller

<script>
    function setValueAttr(el) {
        el.setAttribute('value', el.value)
    }

    function aplicar() {
        var myTab = document.querySelectorAll('#DocumentosAbiertos tbody tr .txtID:not([value=""]):valid');
        var tableData = [];
        Array.from(myTab).forEach(input => {
            var tds = input.closest('tr').children;
            var obj = {};
            obj.A = tds[8].textContent;
            obj.B = tds[1].textContent;
            obj.C = tds[6].textContent;
            obj.D = tds[5].textContent;
            obj.E = input.value;
            tableData.push(obj);
        });
        console.log(tableData);

        data = JSON.stringify(tableData)
        $.ajax({
        url: '~/Controller/myView',
        type: 'post',
        contentType: 'application/json',
        data: data,
        success: function (response) {
            console.info(response);
        },
        error: function (error) {
            console.error(error);
        }
    });
    }
</script>

Therefor my Controller looks like this.

[HttpPost]
public JsonResult myView(IList<ModelPagosRecibidos> models)
{
    comercial.Models.ModelPagosRecibidos modelPagosRecibidos = new Models.ModelPagosRecibidos();
    return Json(modelPagosRecibidos);
}

And this is my model

public class ModelPagosRecibidos
{
public string A { get; set; }
public string B { get; set; }
public string C { get; set; }
public int D { get; set; }
public string E { get; set; }
}

Where it hits on this dataset, which is the whole point of the question, how to distribute the data inside this dataset string I build with the values of the array I post using AJAX dynamically.

    public System.Data.DataSet linkDoc()
    {
        
        string operacion = A;
        string metodo = B;
        string monto = C;
        string fecha = D;
        string fecha = E;
        string sURL = ("total_registros=" + operacion  + "&num_pago1=" + metodo  + "&monto1=" + monto  + "&num_documento1=" + fecha + "&tipo_documento1=" + E + "&");

        DataSet ds = utilities.get(sURL);
        return ds;
    }

This is not very clear. If "10" is entered in the value above, please can you show what the output string should look like. — Samuel Goldenbaum, Nov 19 '19 at 21:49
I wonder why you want to do this. I see you tagged it as MVC and this is not doing things the way I'd expect for model binding in MVC... — Nikki9696, Nov 19 '19 at 21:51
I'm trying to add the Model and the Controller I'm just cleaning up the code sorry for the delay — IceeFrog, Nov 19 '19 at 21:51
Well if you're sending this data to a controller, generally I'd see it as JSON, not a URL type looking string like this, so that's what I'm a little confused about — Nikki9696, Nov 19 '19 at 21:53
There updated the post sorry if I added a lot of information I think I got lost in the post I'll read it again mhm — IceeFrog, Nov 19 '19 at 22:01
Ah, I see. You don't need all that. Just send through an object array and the model binder will take care of making it a List for you — Nikki9696, Nov 19 '19 at 22:08
check this out https://stackoverflow.com/questions/309115/how-can-i-post-an-array-of-string-to-asp-net-mvc-controller-without-a-form — Nikki9696, Nov 19 '19 at 22:09
I find everything on that post usefull! Thanks Nikki, altho I can't pick an example I think they kinda fit for everything I'll try to read them again to see if something brights up — IceeFrog, Nov 19 '19 at 22:16
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/202684/discussion-between-iceefrog-and-nikki9696). — IceeFrog, Nov 19 '19 at 22:43

score 0 · Accepted Answer · answered Nov 20 '19 at 16:40

I solved this issue creating the string with the elements I have inside tableData like this

for (i = 0; i<tableData.length; i++) {
     total[i] = "&A" + (i + 1) + "=" + tableData[i].A +
     &B" + (i + 1) + "=" + tableData[i].E +
     "&C" + (i + 1) + "=" + tableData[i].B +
     "&D" + (i + 1) + "=" + tableData[i].C
    }

Aftermath added a hidden input inside the view

<form ="id">
<input type="hidden" name="zURL" id="zURL" class="form-control">
</form>

And added this js at the end of my first script

document.getElementById("zURL").value = zURL;

that way I get the input in a formcollection in my controller and distribute it in my Model as it was my need

How to build a string with array index and elements

1 Answers1