jquery mobile and Durandal

Question

Please anyone suggest me, it's good idea to use Durandal and JuqueryMobile for mobile based application (Browser). I am planning to develop an application using Durandal, Jquerymobile, MVC4, KnockoutJs, and BreezeJs.

Thanks

Answer 1

Yes I believe this is a sound approach. We're using jquery UI (not the mobile version) with the durandal framework with success on a large web app.

If you include the jquery ui widget bindings by Steve Saunderson (https://github.com/SteveSanderson/knockout/wiki/Bindings---jqueryui-widgets) you can achieve a fully declarative UI approach.

It will allow you to declare something like the jquery ui autocomplete control within the HTML like this:

<input type="text" data-bind="
            css: { 'song-valid': isValid, 'song-invalid': isInvalid },
            value: songSearchText, 
            valueUpdate: 'afterkeydown', 
            attr: { placeholder: placeholderText },
            jqueryui: {
                widget: 'autocomplete',
                options: {
                    source: function(request, response) { return $data.songAutoCompleteSource(request, response); },
                    minLength: 2,
                    select: function (event, ui) {
                        $data.songSelected(ui.item.id, ui.item.value);
                        $parent.songSelected();
                    }
                }
            }" />

Simply include the jquery ui widget bindings found in this gist: https://github.com/SteveSanderson/knockout/wiki/Bindings---jqueryui-widgets

Make sure you include the above javascript after you have already loaded jquery and knockout.

Answer 2

I would say no. I made a simple PhoneGap app with 3 pages with JQuery Mobile. It looked good. I then tried to implement Durandal and it broke all my JQuery mobile styling. I came to the conclusion that the 2 do not play well together as Jquery Mobile tries to implement it's own page navigation model. I am now going to try Bootstrap instead or possibly handcode the css for the UI.

If anyone can prove otherwise, please let me know!

Answer 3

I wouldn't recommend using jQuery mobile because it has a lot of overlapping features w/ durandal. Unless you want to just use jQuery mobile for the controls.

I asked on the google group forums and ratchet was suggested instead.

Not exactly the answer your looking for but.. it might be good to consider other options too.