Question

我在表单中有一个可排序的排序列表，用户可以对其进行排序，然后在表单中填写一些输入字段，然后提交表单。我正在使用php和jquery可排序插件。.如何发送带有其他表单值的列表或将可排序项放在textarea中的任何想法？

Answer 1

jQuery UI可排序功能具有serialize method，易于使用
这是一个简单的示例，一旦元素的位置发生变化，该数据便立即将数据发送到指定的URL：

  $('#your-ulelement').sortable({
    axis: 'y',
    update: function (event, ui) {
        var data = $(this).sortable('serialize');
        // POST to server using $.post or $.ajax
        $.ajax({
            data: data,
            type: 'POST',
            url: 'any url for get data'
        });
    }
});

然后您可以轻松地在PHP中将其用作数组

Answer 2

谢谢你，我解决了这个问题：我将<!DOCTYPE html> <html lang="en"> <head> <title>CSS Grid</title> <style> .wrapper_main { display: grid; grid-template-columns: repeat(5, 1fr); grid-auto-rows: minmax(100px, auto); grid-gap: 1em; justify-items: stretch; align-items: stretch; } .box0 { grid-column: 1/6; grid-row: 1; border: 1px solid #333; } .box1 { grid-column: 1/6; grid-row: 2/6; border: 1px solid #333; } .seconds01 { position: fixed; right: 20px; top: 50px; } .seconds05 { position: fixed; right: 100px; top: 50px; } </style> </head> <body> <div class="wrapper_main"> <div class="box box0">Box 0</div> <div class="box box1"> <a class="seconds01"><img src="img/Candle_Box_Tag.png"></a> <a class="seconds05"><img src="img/Candle_Box_Tag.png"></a> </div> </div> </body> </html>与所有列表项一起使用，然后使用了以下javascript代码：

draggable="true"

该用户之后可以拖动任何列表项并将其放在文本区域

如何使用PHP发送带有包含其他输入的表单的可排序列表值

2 个答案: