проблема с сортировкой jquery и направляющими - PullRequest
3 голосов
/ 21 ноября 2010

У меня есть

<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>

, но $('#test-list').sortable('serialize'); делает такую ​​строку: 876e45a4-6a27-4f7b-95ca[]=9e2500f11801&79fbfdf7-e9b1-4e96-8e42[]=9e2400d2abb7&4df36ffb-561a-4eaa-9b1c[]

удаляет последние 12 символов идентификатора

Есть идеи почему?

Ответы [ 4 ]

5 голосов
/ 21 ноября 2010

Две вещи:

Sortable.serialize ID

Вы уверены, что Sortable s serialize делает то, что вы ожидаете??Согласно документам ожидается, что идентификатор каждого сортируемого элемента будет иметь вид setname_number.Ожидается, что идентификаторы будут иметь подчеркивание, но вернемся к использованию = или -;из документов :

По умолчанию он работает, просматривая id каждого элемента в формате 'setname_number', и выдает хеш вроде "setname [] =количество & SetName [] = число».
... Они должны быть в форме: "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 и выше, плюс дефис (-) и подчеркивание (_);они не могут начинаться с цифры или с дефиса, за которым следует цифра.

(Эти ограничения не действительны для id в HTML, который просто не может содержать пробелы и должен иметь хотя бы один символ, если он указан, но CSS более ограничительный.)

Поскольку вы используете селекторы CSS с jQuery, вероятно, было бы лучше убедиться, что атрибуты id являются действительными CSS.(Возможно, вы могли бы предварительно обработать их до «G», за которым следует GUID с дефисами, преобразованными в x, такого рода вещи, так что идентификаторы будут G876e45a4x6a27x4f7bx95cax9e2500f11801 и т.п.). Затем вы захотите дать имподчеркивание и суффикс, как указано выше.

2 голосов
/ 07 февраля 2018

Для RFC 4122 как 876e45a4-6a27-4f7b-95ca-9e2500f11801 вы можете добавить параметр.

$(this).sortable('serialize', {expression:(/(.+)[_](.+)/)})
2 голосов
/ 30 августа 2011

У меня была такая же проблема. Я решил это, изменив код представления, чтобы заменить символ тире пустой строкой:

<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);
            }
        });
    }
});

Примечание: я изменил ключ на 'Sequence', а комбо fadeTo () используется для визуальной обратной связи с пользователем, что последовательность успешно сохранена.

Мой метод действия контроллера выглядит так:

// 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 без черточек в список , связанный с параметром Sequence.

1 голос
/ 21 ноября 2010

Изменение его на $('#test-list').sortable('serialize').replace(/=\[\]/g, '-') обходит странную проблему, но это должно быть странностью в коде пользовательского интерфейса jQuery с длинными идентификаторами.Я посмотрю дальше.

Обновление

Право нарушающий код в 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() для своего использования.

...