Smart Select - Reset or Set value

Questions
1

Hi All,

I am unable to set or reset value of smart select.

<li class="item-content item-input item-input-with-info">
    <a class="item-link smart-select smart-select-init" data-open-in="popup" style="width:100%;">
        <select name="gender" id="gender" required>
            <option value="" selected disabled>--Select--</option>
            <option value="M">Male</option>
            <option value="F">Female</option>
        </select>
        <div class="item-content item-input item-input-with-info" style="padding-left: 0px;">
            <div class="item-inner">
                <div class="item-input-wrap" style="padding-top:8px;">
                    <div class="item-title item-label">Coverage</div>
                    <div class="item-input-info"></div>
                </div>
            </div>
        </div>
    </a>
</li>

To get value in javascript:

$("#gender").val() //working fine as expected

To set value in javascript:

$("#gender").val(“M”) //Its setting but value not changing in item-after

Please help on this.

2

Value on selects must be set on options

$('#gender option[value="M"]').props('selected', true);

And then [v2] Smart Select value change does not trigger update

1 Like
3

Hi @nolimits4web,

I have tried given code

$(’#gender option[value=“M”]’).prop(‘selected’, true);

Its setting the value but not on screen text (item-after class)

Also i tried given link code also…

var ss=awnicapp.smartSelect.get('#gender');
ss.setValue("M");

But no use… it giving below error.

VM6170:2 Uncaught TypeError: Cannot read property 'setValue' of undefined
    at <anonymous>:2:4
4

Sorry must be “prop”, not “propS”. You need to pass smart-select link/element to smartSelect.get method, not the <select>

5

Thanks @nolimits4web… Now its working fine…

Is there any plan to correct/update this work around in framework itself…

6

With me, this one worked fine:
$('#currency option[value="'+res.rows.item(0).geld+'"]').attr("selected",true);

BUT what DID NOT update is the text after the pop up inside the list. I also do not have an item-after class set and it works out of the box but not after i re-select something from a list.

7

Have you guys figured this out? any solutions to updating the select value as well as the text.
Thank you,

8

Post your code we will help you

9

start from => Framework7
navigate to “smart select” page,
open console and copy-paste-enter:

let el = document.getElementsByClassName('smart-select-init');
let ss = Array.from(el).reduce((p,i) => ({
  ...p,
  [i.f7SmartSelect.selectName]: i.f7SmartSelect
}),{});

//console.log(ss);

ss.fruits.setValue('banana');
ss.car.setValue(['toyota', 'volvo']);
10

Thank you for your reply.

11

Thank you for your reply.