Creating a SelectBox in intel XDK

Question

I have just started coding in Intel XDK. Instead of showing select items in usual way (drop down menu), i want them to show in popup and select one of item from there. I have gone through several sites, but i could not find a single example which will give me the desired result.

<div data-role="fieldcontain">
            <label for="select-choice-1" class="select">Choose shipping method:</label>
            <select name="select-choice-1" id="select-choice-1" data-native-menu="false" >
                <option value="standard">Standard: 7 day</option>
                <option value="rush">Rush: 3 days</option>
                <option value="express">Express: next day</option>
                <option value="overnight">Overnight</option>
            </select>
        </div>

It seems easy to implement in Jquery. But my problem is , i can only use APIs exposed by Intel XDK. I see there exists javascript file in plugins folder named af.selectBox.js. But i was unable to trace out how to use that. I tried Intel XDK documentation also. But no luck.

I'm not sure what you mean by "i can only use APIs exposed by Intel XDK". Jquery should work in the XDK, you just need to add the right files to your project. Or is it an external requirement for some reason? — OldGeeksGuide, Jul 08 '15 at 22:34
Thanks for your reply. Yes I have kinda requirement which states I can not use jquery or any 3rd party open source library. I totally want to do it with Intel xdk appui and appframework. — UnableToGoogle, Jul 09 '15 at 00:58
To only use the Intel XDK API's is making it for yourself very hard. Cordova, what is underneath it, makes heavy use of kinds of API's to get stuff working. Even the XDK IDE is not all Intel, with Bower / Git for example. — Flummox - don't be evil SE, Jun 23 '16 at 10:12

score 0 · Answer 1 · edited May 23 '17 at 10:34

If you were inclined to broaden your options, I came across this one, that did what you want. BUT it uses jQuery and Bootstrap:

<div class="form-group">
    <label class="control-label col-sm-offset-2 col-sm-2" for="company">Company</label>
    <div class="col-sm-6 col-md-4">
        <select id="company" class="form-control">
            <option>small</option>
            <option>medium</option>
            <option>large</option>
        </select> 
    </div>
</div>

2nd Answer

Creating a SelectBox in intel XDK

1 Answers1