bartonh
September 14, 2015, 7:45pm
1
Hi - Love Webix! And I have it working fine w/ Meteor - Thanks!
What I need to do is have my Webix component reference a Meteor template which gets interpolated. This does not reference any data.
Given what I have below, I would expect to see the text “Hello” in the toolbar.
My nav.js:
webix.ui({
rows:[
{
view:"toolbar",
cols:[
{view:"label", width: 200, template: "<div>AccountsTemplates</div>"},
{view:"menu",
data:[
{ id:"menuHome",value:"Home", href: "/"},
{ id:"menuPrivate",value:"Private", href: "/private"}
]
},
{ id:"at-nav-button", template: "{{>atNavButton}}", width:100, align: "right" }
]
}
]
}, this.find("nav"));
my atNavButton template:
<template name="atNavButton">
<div id="atNavButton">Hello</div>
</template>
maksim
September 15, 2015, 2:22pm
2
Check
if (Meteor.isClient){
Template.Template.rendered = function(){
var templates = {
cols:[
{ header:"Webix Data Binding (select row in table)", body:{
id:"t1", view:"reactive", template: "info", data:{
name:"Test", author:"Record"
}}
},
{ header:"Meteor Data Binding", height:300, body:{
id:"t2", view:"reactive", template: "allinfo" }
}
]
};
this.ui = webix.ui({
type:"wide", rows:[ templates]
}, this.find("#template_area"));
This file has been truncated. show original
You can use a similar approach
{ id:"at-nav-button", view:"reactive", template: "atNavButton", width:100 }
bartonh
September 15, 2015, 7:28pm
3
Thanks maksim - that got me a small step forward.
I added the code to https://github.com/bartonhammond/webix-iron-router/blob/master/packages/app-core/lib/client/nav.js and it helped.
I still have a couple of things:
The generated html is not a Button.
Rendered HTML:
processing Meteor Spacebar expression (e.g. {{text}}) from w/in Webix referenced template does not occur
In the original question above, the atNavButton template had "Hello" hard coded. That shows up in the div as shown above. Possibly this isn't working as the Webix Button component isn't even rendered but I'm including for completeness.
If I change that "Hello" to "{{text}}" and have my helper as this:
https://github.com/bartonhammond/webix-iron-router/blob/master/packages/app-core/lib/client/atNavButton.js
I am expecting to see either the value of {{text}} or the label "Sigin!!" where the button should be. But neither display.
Again thanks for the help!!! I’m really excited about Meteor/Webix integration possibilities.
Note: my working project is available here if needed. https://github.com/bartonhammond/webix-iron-router.git
The running application in debug mode is here: http://webix-iron-router.meteor.com/
Barton
bartonh
September 20, 2015, 12:02am
4
In case anyone else is interested in Meteor & Webix integration, I’ve a project you can reference and see how I approached this.
Namely, when using Meteor, I exclusively use Webix HTML initialization. It works like a dream. Using this approach, there is no limitation wrt templates referencing templates (at least that I’ve run into…)
My project is Meteor UserAccounts with Webix and the associated example project is Meteor UserAccounts BoilerPlate Example . The running application (not complete) is http://useraccounts-webix.meteor.com
Note : I haven’t tried a “reactive” template using Webix HTML initialization.
dutu
November 22, 2016, 10:21pm
5
is view:“reactive” still supported in Webix 4.0.16?
Thanks
maksim
November 23, 2016, 10:11am
6
Webix itself doesn’t contain a code of “view:reactive”, it was available from webix package for Meteor - GitHub - dandv/meteor-webix: Meteor.js - Webix UI integration
dutu
November 23, 2016, 12:51pm
7
Thanks for the clarification!
I see this points to Webix repo on GitHub - webix-hub/webix-meteor-data: Meteor Data adapter for Webix UI
Is the Meteor data adapter still working with the newer version of Webix? If not tested, any changes suspected due to newer Webix (from 2.x to 4.x)?
maksim
November 23, 2016, 1:27pm
8
Not tested with Webix 4.0, but we are very careful with backward compatibility, and there was no any breaking changes in data API since version 2.0, so all functionality must work correctly.