jquery - How to post table rows, added via Javascript, to the server in ASP.NET?

Question

Welcome To Ask or Share your Answers For Others

jquery - How to post table rows, added via Javascript, to the server in ASP.NET?

posted Oct 24, 2021 in Technique[技术] by 深蓝 (71.8m points)

jquery - How to post table rows, added via Javascript, to the server in ASP.NET?

This question has been asked before: Access <asp:table> table rows added by javascript in asp.net webform . Apologies for the duplicate question but I'd really like an explanation why this is the case. It is probably due to my lack of understanding on how browsers process HTML tables on submission to the server.

If I have a <HTML> table or an <asp:table> control on an aspx page and I add rows to it client-side using JQuery / Javascript, why can I not include these added rows in a post-back to the server?

I've been trying to get this to work and it looks like I can't do it based on the answer to the previous question. But can someone explain why this is the case? The table itself can be returned in the post-back but the only rows present are the rows that were part of the table when it was sent to the browser originally - it does not include the rows added by the browser.

I would have thought there was a way to include these new rows in the post-back, the same as any client-side user input?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

1 Reply

深蓝 · Answer 1 · 2021-10-23T18:24:44+0000

You could do something like this:

// Get the data from your table into an array
var tableData = [];
$("table tr.some-class").each(function () {
  var row = [];
  $(this).find("td").each(function () {
    row.push(this.innerHTML);
  });
  tableData.push(row);
});

// Make your form
var form = $("<form>").attr("action", "some/path/on/server")
                      .attr("method", "post");

// Make a form field with your tableData (JSON serialized in this case)
var tableInput = $("<input>").attr("type", "hidden")
                             .attr("value", JSON.stringify(tableData));

// Some browsers require the form to be in the dom before it'll submit.
$(document.body).append(form);
// Add the field to the form and submit
form.append(tableInput).submit();

This is a basic implementation of this answer.

Categories

jquery - How to post table rows, added via Javascript, to the server in ASP.NET?

jquery - How to post table rows, added via Javascript, to the server in ASP.NET?

Please log in or register to add a comment.

Please log in or register to reply this article.

1 Reply

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags