Framework7 Smart Select показать выбранный элемент

У меня есть этот маленький умный выбор:

<div class="list-block">
    <ul>
        <li>
            <a href="#" class="item-link smart-select" data-back-on-select="true" data-open-in="popup">
                <select name="projects" id="projects">
                  <option value="0" selected>Please choose...</option>
                  <option value="1" >House build</option>
                </select>
                <div class="item-content">
                    <div class="item-inner">
                        <div class="item-title">Aufträge</div>
                    </div>
                </div>
            </a>
        </li>
    </ul>
</div>

Когда пользователь выбирает элемент, я создаю cookie и записываю в него значение. После перезагрузки или закрытия страницы я прочитал в куки и выбрал пункт. Это работает. Но я всегда использую запись "Пожалуйста, выберите", а не выбранный элемент. Но когда я нажимаю на список, выбирается правильный пункт, а затем закрывает список, который я вижу снова. Пожалуйста, выберите. Вот как я выбираю значение:

$$("#projects").val(getCookie("timerTasks"));

2 ответа

Для тех, кому нужен этот ответ сейчас, find("option:selected") больше не работает для этой цели. Использоватьfind("option:checked") вместо.

Окончательный код будет

$$("#projects").val(getCookie("timerTasks")).parent().find('.item-title').html($$("#projects").find("option:checked").text());

@tinyCoder понял это почти правильно, за исключением того, что вам нужно обновить .item-afterне .item-title, .item-title это "метка" умного выбора, и .item-after отображает выбранное значение.

Кроме того, так как .html() будет отображать HTML, и нам нужен только текст, я думаю, что более целесообразно использовать .text(), Итак, мой однострочник будет выглядеть так:

$$("#projects").val(getCookie("timerTasks")).parent().find('.item-after').text($$("#projects").find("option:selected").text());

Framework7 v1.6.5 (сентябрь 2017 г.)

Ну, я столкнулся с этим раньше. Вы должны обновить item-title Класс после выбора значения из куки:

Подробно:

// Select your value
$$("#projects").val(getCookie("timerTasks"));

// Selected value text
var selected_text = $$("#projects").find("option:selected").text();

// Change item-title
$$("#projects").parent().find('.item-title').html(selected_text);

Одна линия:

$$("#projects").val(getCookie("timerTasks")).parent().find('.item-title').html($$("#projects").find("option:selected").text());

Вы можете видеть, что это общая проблема, мне интересно, почему она еще не исправлена.

Другие вопросы по тегам