0

我正在尝试在 asp.net mvc 中创建一个可排序的 UL 列表，类似于在此处输入链接描述，我可以在 HTML 和 jquery 中完成此操作。

<div data-role="page" id="page1">
<div data-role="content">
    <ul data-role="listview" data-divider-theme="b" data-inset="true">
        <li data-role="list-divider" role="heading">Re-order</li>
        <li data-theme="c">1</li>
        <li data-theme="c">2</li>
        <li data-theme="c">3</li>
        <li data-theme="c">4</li>
        <li data-theme="c">5</li>
        <li data-theme="c">6</li>
        <li data-theme="c">7</li>
    </ul>
    <a data-role="button">Submit</a>
</div>


$(document).ready(function(e) {
$('li').removeClass('ui-corner-bottom');
$('ul')
    .addClass('ui-corner-top')
    .removeClass('ui-corner-all')
    .sortable({
        'containment': 'parent',
        'opacity': 0.6,
        update: function(event, ui) {
            alert("dropped");
        }
    });

});

4

2 回答 2

0

是的 - MVC 中没有任何东西可以阻止你。视图页面由标准 HTML 和 Javascript 组成，因此返回一个带有适当 HTML 和 JS 的视图，它就可以正常工作。

将该代码复制到视图中并从操作中返回。例如，将它放在 Home 的 Index.cshtml 中，它应该可以工作。

于 2013-09-16T22:06:27.117 回答
0

通过执行以下操作，我能够很好地发布数据

  $(document).ready(function () {

    $("#sendData").click(function () {
        var items = $("#sortable li");
        var tosubmit = [];
        $(items).each(function (index, e) {
            if ($(e).text() != "List") {
                var nextItem = { "id": e.id, "val": $(e).text() };
                tosubmit.push(nextItem);
            }
        });

        $.ajax({
            type: 'POST',
            url: 'Home/GetOrderListJSON',
            data: JSON.stringify(tosubmit),
            contentType: 'application/json; charset=utf-8',
            success: function (response) {
                alert("success");
            },
            error: function (xhr) {
                alert("error");
            }
        });

    });

});

于 2013-09-25T19:41:08.667 回答