This is a migrated thread and some comments may be shown as answers.

Newbie, how to call function in app.js on change of a form, select object.

3 Answers 155 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Boris
Top achievements
Rank 1
Boris asked on 20 Nov 2013, 10:13 PM
Hello,

I'm  new to both KendoUI and JQuery.
I'm trying to create a new application and it's starting well.

I'm creating a "Settings" page where a user would be able to choose skin, "Native" or "Flat".
Those chooses are in a <form> and <select>,

The part of view
<li>
                    <label>Skin
                        <select class="skinchange">
                            <option value="">Native</option>
                            <option value="flat">Flat</option>
                        </select>
                    </label>
                </li>

I would like to call a function in "app.js" when an option is chosen.
app.changeSkin = function (e) {
        if (e.sender.element.value() === "flat") {
            mobileSkin = "flat";
        }
        else {
            mobileSkin = "";
        }

        app.application.skin(mobileSkin);
    };

I don't know how to do it or if it's possible :)

By having following code in the index.html I can change the skin but I would prefer If I could concentrate all that stuff in .js files.
<script>
    $( ".skinchange" ).change(function() {
        
        var mobileSkin = $(".skinchange").val();
        
        app.application.skin(mobileSkin);
    });
    </script>

Best regards and thanks in advance!

3 Answers, 1 is accepted

Sort by
0
Steve
Telerik team
answered on 21 Nov 2013, 07:57 AM
Hello Boris,

The default Kendo UI Mobile template in Icenium already contains the code that does that in a separate .js file, which is invoked on a button click from html page. You can review it and adapt it to work for your application from that template.

Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
0
Boris
Top achievements
Rank 1
answered on 21 Nov 2013, 08:31 AM
Hello Steve,

Thank for you help!

You are absolutely right but I tried to apply same function on a <select> object. I thought it would be nice to create a settings "view" with possibility to, through select object, directly change the skin. 
Is it possible to invoke same function you are talking about, found in app.js, via a <select> object?

If it's not possible then I must change my approach :)
If it's possible then I would appreciate an example of how I can invoke function in app.js from an html object.

Best regards!
0
Steve
Telerik team
answered on 22 Nov 2013, 04:35 PM
Hi Boris,

Thanks for the clarification, I now understood what you're trying to accomplish. Unfortunately it is not possible to reuse the same code, as it relies on the fact that the button is a Kendo UI widget. However Kendo UI Mobile does not have a DropdownList/Combo widget yet, which means that the select cannot be converted to a widget to make the current code applicable for select as well. Your approach of using jQuery to hook up appropriate event is the correct way to go!

Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
Tags
General Discussions
Asked by
Boris
Top achievements
Rank 1
Answers by
Steve
Telerik team
Boris
Top achievements
Rank 1
Share this question
or