Problem with jquery sorting and pointers

Question

I have

<ul id="test-list" class="ui-sortable" >
   <li id="876e45a4-6a27-4f7b-95ca-9e2500f11801">text1</li>
   <li id="4df36ffb-561a-4eaa-9b1c-9e2500f16d6b">text2</li>
   <li id="cc4a57d5-1567-403c-888f-9e2500f1c171">text3</li>
</ul>

but $('#test-list').sortable('serialize');makes a line like this: 876e45a4-6a27-4f7b-95ca[]=9e2500f11801&79fbfdf7-e9b1-4e96-8e42[]=9e2400d2abb7&4df36ffb-561a-4eaa-9b1c[]

delete last 12 id characters

Any ideas why?

Answer 1

Two things:

Sortable.serialize Identifiers

Are you sure it Sortable serializedoes what you expect from it? According to docs , he expects the identifier of each sorted item to be on the form setname_number. Identifiers are expected to have an underscore, but will return to use =or -; from documents :

, 'setname_number', "setname [] = number & setname [] = number".
... : "set_number" , 3- id foo_1, foo_5, foo_2 foo[]=1&foo[]=5&foo[]=2. , . foo=1 foo-1 foo_1 foo[]=1.

( .) , (_), , -, (-), .

id CSS

, id CSS ; :

CSS ( , ) [a-zA-Z0-9] ISO 10646 U + 00A1 , (-) (_); , .

( true id HTML, , , CSS .)

CSS jQuery, , , id CSS. (, "G", GUID , x, - , G876e45a4x6a27x4f7bx95cax9e2500f11801 ..). .

Answer 2

. , , - , :

<div id="divItems">
@foreach (var item in Model)
{
    <div id="@string.Format("item_{0}", item.Id.ToString().Replace("-", string.Empty))">
        @item.Title
    </div>
}
</div>

: div ul/li .

javascript :

$("div#divItems").sortable({
    cursor: "move",
    update: function (event, ui) {
        var container = $(this);
        var sequence = container.sortable("serialize", { key: "Sequence" });
        $.post("@Url.Action("EditSequence")", sequence, function (data) {
            if (data.success) {
                container.fadeTo("normal", 0, function () {
                    container.fadeTo("normal", 1);
                });
            } else {
                alert(data.message);
            }
        });
    }
});

. "", fadeTo() , .

My Controller Action :

// POST: /Showcase/EditSequence?Sequence=<Guid List>
[Authorize]
[HttpPost]
public ActionResult EditSequence(List<Guid> Sequence)
{
    try
    {
        for (int i = 0; i < Sequence.Count; i++)
        {
            var item = repos.GetSingle(Sequence[i]);
            if (item != null)
            {
                item.Seq = (i + 1);
            }
        }

        repos.Save();

        return Json(new { success = true, message = "Sequence has been saved!" }, JsonRequestBehavior.DenyGet);
    }
    catch (Exception ex)
    {
        return Json(new { success = false, message = ex.Message }, JsonRequestBehavior.DenyGet);
    }
}

Guid List <Guid> Sequence.

Answer 3

$('#test-list').sortable('serialize').replace(/=\[\]/g, '-') , jQuery UI . .

, jquery.ui.sortable.js serialize():

$(items).each(function() {
    var res = ($(o.item || this).attr(o.attribute || 'id') || '').match(o.expression || (/(.+)[-=_](.+)/));
    if(res) str.push((o.key || res[1]+'[]')+'='+(o.key && o.expression ? res[1] : res[2]));
});

, , (-), , , / . , | serialize() .

Answer 4

id, 876e45a4-6a27-4f7b-95ca-9e2500f11801, .

$(this).sortable('serialize', {expression:(/(.+)[_](.+)/)})