Framework7智能选择显示选择项。

时间:2023-01-19 10:13:33

i have this little 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>

When the user select an item, I created a cookie an wrote the value in it. After a reload or closing the page I read in the cookie an select the item. That works. But, I alaways the "Please choose" entry and not the selected item. But when I click on the list the correct item is select but then close the list I see again Please choose. This is how I select the value:

当用户选择一个项目时,我创建了一个cookie,并在其中写入了值。在重新加载或关闭页面后,我在cookie中读取一个选项。这工作。但是,我总是选择“请选择”条目,而不是选中的条目。但是当我点击列表时,正确的条目是选择,然后关闭列表,请选择。这就是我选择的值:

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

2 个解决方案

#1


2  

@tinyCoder got it almost right, except you need to update .item-after, not .item-title. .item-title is the "label" of smart select, and .item-after displays the selected value.

@tinyCoder几乎是正确的,除了你需要更新。item-after,而不是。item-title。item-title是smart select的“标签”,以及。item-after显示所选的值。

Also, since .html() will render HTML, and we only need text, I think it's more appropriate to use .text(). So, my one-liner would look like this:

另外,由于. HTML()将呈现HTML,而我们只需要文本,所以我认为使用.text()更合适。因此,我的一行代码是这样的:

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

Framework7 v1.6.5 (September 2017.)

Framework7 v1.6.5(2017年9月)。

#2


1  

Well, I ran into this before. You have to update the item-title class after choosing the value from the cookie:

我之前碰到过这个。在从cookie中选择值之后,您必须更新itemtitle类:

In details:

详细:

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

One Line:

一行:

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

You can see this is a common issue there, I'm wondering why it is not fixed yet.

你可以看到这是一个常见的问题,我想知道为什么它还没有被修复。

#1


2  

@tinyCoder got it almost right, except you need to update .item-after, not .item-title. .item-title is the "label" of smart select, and .item-after displays the selected value.

@tinyCoder几乎是正确的,除了你需要更新。item-after,而不是。item-title。item-title是smart select的“标签”,以及。item-after显示所选的值。

Also, since .html() will render HTML, and we only need text, I think it's more appropriate to use .text(). So, my one-liner would look like this:

另外,由于. HTML()将呈现HTML,而我们只需要文本,所以我认为使用.text()更合适。因此,我的一行代码是这样的:

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

Framework7 v1.6.5 (September 2017.)

Framework7 v1.6.5(2017年9月)。

#2


1  

Well, I ran into this before. You have to update the item-title class after choosing the value from the cookie:

我之前碰到过这个。在从cookie中选择值之后,您必须更新itemtitle类:

In details:

详细:

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

One Line:

一行:

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

You can see this is a common issue there, I'm wondering why it is not fixed yet.

你可以看到这是一个常见的问题,我想知道为什么它还没有被修复。