Как передать содержимое таблицы html в виде данных формы на POST?

У меня есть список групп в <select> и <input type="button" value="Add Selected">, чтобы добавить выбранную группу в <table> значений.

Список добавленных групп отображается в <table>, строки динамически добавляются javascript при каждом нажатии кнопки "Добавить выбранный". Каждая строка в таблице имеет ссылку "удалить", которая удаляет элемент из таблицы.

Все работает отлично, за исключением того, что я хочу, чтобы POST содержимое таблицы было URL-адресом, и я не уверен, как это сделать.

Должен ли я добавить скрытое поле для каждой строки таблицы? Или есть лучший способ сделать это?

Любые предложения приветствуются!

Rob

Ответ 1

Оберните таблицу в форму и поместите данные, которые вы хотите опубликовать, но не отображаете пользователю в скрытых вводах

<form method="post" action="">
    <!-- your table -->
    <input type="hidden" name="name" value="your value"/>
    <button type="submit">Post</button>
</form>

Ответ 2

Я сделал это:

function sendTableArticles() {
        var columns = [
            'articulo.id',
            'articulo.descripcion',
            'unidadMedida.descripcion',
            'precio',
            'importe',
            'totalRequerido',
            'totalIngresado'
        ];

        var tableObject = $('#table_articles tbody tr').map(function (i) {
            var row = {};
            $(this).find('td').each(function (i) {
                var rowName = columns[i];
                row[rowName] = $(this).text();
            });

            return row;
        }).get();


        $.post('@{OrdenComprasDetalles.update()}',
                {objects:tableObject},
                function (response) {
                    console.log(response);
                }
        )
    }

в контроллере

public static void update(List<OrdenCompraDetalle> objects){
        int i=0;
        renderJSON(i);
    }

Итак, мой DTO

@Entity(name = "ordencompradetalle")
public class OrdenCompraDetalle extends AbstractTableMapper {

    @ManyToOne
    public Articulo articulo;

    public Float precio;

    public Float importe;

    public Boolean ingresado;

    @Column(name = "total_requerido")
    public Float totalRequerido;

    @Column(name = "total_ingresado")
    public Float totalIngresado;

    @ManyToOne
    public OrdenCompra ordenCompra;

    @ManyToOne
    public UnidadMedida unidadMedida;

    @OneToMany(mappedBy = "ordenCompraDetalle")
    public List<Movimiento> movimientos;
}

Я использую его, и он слишком полезен, надеюсь, что это тоже поможет.

Ответ 3

<form method="post" action="your_server_action">
  <table>
    <!-- Table row display elements -->
    <input type="hidden" name="name" value="your value"/>
  </table>
  <input type="submit" value="Submit"/>
</form>

Ответ 4

Я сделал что-то подобное на днях, мое решение состояло в том, чтобы создать массив объектов из моей таблицы, который я мог бы отправить в веб-службу. Веб-служба должна ожидать массив объектов.

// Read all rows and return an array of objects
function GetAllRows()
{
    var myObjects = [];

    $('#table1 tbody tr').each(function (index, value)
    {
        var row = GetRow(index);
        myObjects.push(row);
    });

    return myObjects;
}

// Read the row into an object
function GetRow(rowNum)
{
    var row = $('#table1 tbody tr').eq(rowNum);

    var myObject = {};

    myObject.ChangeType = row.find('td:eq(1)').text();
    myObject.UpdateType = row.find('td:eq(2)').text();
    myObject.CustomerPart = row.find('td:eq(3)').text();
    myObject.ApplyDate = row.find('td:eq(9)').text();
    myObject.Remarks = row.find('td:eq(10)').text();

    return myObject;
}

Ответ 5

имя select as array, добавив [], как этот

<select name="modules[]" id="modules" class="inputbox" size="10" multiple="multiple">
<option value="1">Module 01</option>
<option value="2">Module 02</option>
<option value="3">Module 03</option>
</select>

Я думаю, что после отправки у вас будет массив в $_POST, названный в этом примере модулями