CODEWITHSUNDEEP
knockout.jsangularjskendo-uibreezeknockout-mvvm
user1843640
user1843640

Reputation: 3949

Combination of MVVM and mobile UI frameworks for use with Breeze

I've been working with the Breeze/knockout combination for a while now and have been overall quite satisfied. Twitter Bootstrap was a suitable UI place holder while experimenting but time has come to focus on the UI (mobile web app) and I've run up against an issue that has me looking elsewhere (other than knockout, that is). The problem I am running into with knockout has to do with the inability/difficulty to integrate existing UI components/widgets.

The trouble is that most of these widgets/frameworks/libraries (like jquery mobile) manipulate the DOM in order to accomplish what they are doing. This conflicts with Knockout.

So I moved on to Angular (whose binding syntax I much prefer) and I started my quest again. Well... same problem. Although someone wrote an Angular/Jquery Mobile adapter, I would hate to rely on it staying current with new versions of jquery mobile. Furthermore, the more I worked with jquery mobile, the less I liked it. It seems to be geared more towards mobile web sites than web apps and I found myself wanting to replace it's navigation router and more. Interestingly, at the same time (only a couple of days ago), I noticed the Angular ToDo demo in the latest version of Breeze.

The Angular Breeze demo got me thinking I should try Breeze with Kendo UI, whose MVVM implementation I don't particularly care for, but whose UI is very polished. I didn't spend too much time on this since there is no official support, and not surprisingly, I ran into problems.

So, my question(s):

Will Breeze ever work with Kendo UI MVVM? If yes, are we talking days, weeks or months? If no, any ideas on how to solve the real problem which can be summed up like this:

toolsToRapidlyDevelopProfessionalWebApp = [Breeze, MVVM, UI]

Breeze: I know of no alternative that solves the problems described above.

MVVM: which implementation will work with Breeze and a solid UI library (mobile in my case)?

UI: which pro quality UI library will work with an MVVM implementation that also works with Breeze?

BTW, in my quest for answers, I ran into the following:

http://feedback.kendoui.com/forums/127393-kendo-ui-feedback/suggestions/3247342-integrate-with-breeze-js

Upvotes: 4

Views: 1960

Answers (2)

Ting
Ting

Reputation: 1658

Yes, KendoUI support is on the roadmap for Breeze. As you saw on Kendo's feedback page from your link, our two companies are in contact and have a mutual interest in this.

Edit: Telerik reviews Breeze here and shows the initial integration code with KendoUI: https://gist.github.com/derickbailey/258716b0107f9067616a

Edit 2: Completed version of BreezeDataSource for KendoUI is now working: http://www.kendoui.com/blogs/teamblog/posts/13-02-21/breeze_js_and_the_kendo_ui_datasource.aspx

Upvotes: 2

Jonathan Rowny
Jonathan Rowny

Reputation: 7588

I know this isn't answering your question about breeze/kendo/ui but I wanted to point something out about Angular, and probably Knockout as well, that might help you find your answer.

You're allowed to manipulate the DOM with Angular... I mean, that's all angular does. But you just have to do it in the right place: directives. Those connector libraries you see are just implementing directives to connect to the DOM from angular. You do NOT need to rely on third parties for them and they're easy to maintain.

Don't overthink this, it's really simple. A directive is just a "link" function basically which does your DOM stuff. It's really easy to use.

angular.diretive("something", function(){
   return {
       restrict: 'EACM', //just tells angular where this can be used
       link: function(scope, element, attrs){ 
           //do DOM stuff here, element works with jQuery if included
           element.someJqueryPlugin();
       }
   }
}

Now anywhere in your code you can say <something> or <div something> and your directive is called and properly linked. You can even use templates, controllers and use dependency injection.

Upvotes: 2

Related Questions