You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by Olaf Krueger <po...@olafkrueger.net> on 2017/07/26 20:58:52 UTC

[FlexJS][MDL] Bind data via bead or classic braces?

Hi,
I've some problems with the binding:
In the MDL examples, the model is always bound to the component by using the
"ConstantBinding" bead.
Is this the recommended way to bind data or should it also work by using the
classic Flex way, e.g.:

<mdl:Table shadow="2" selectable="true" dataProvider={users} />

Thanks,
Olaf



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
Thanks, I will give it a try!




--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15535.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Harbs <ha...@gmail.com>.
We have found that MDL components need to be nested inside <js:Div> elements.

> On Jul 27, 2017, at 1:19 PM, Olaf Krueger <po...@olafkrueger.net> wrote:
> 
> Just tried it, still no success.
> The only reason why I've chosen the mdl:Grid as root element was that it
> seems to me that e.g. js:view does not work together with mdl.
> Maybe I should try to replace mdl:grid by js:div later ...
> 
> Thanks again,
> Olaf
> 
> 
> 
> --
> View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15531.html
> Sent from the Apache Flex Users mailing list archive at Nabble.com.


Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Alex Harui <ah...@adobe.com.INVALID>.
The <ContainerDataBinding/> probably should be set at the document level.

HTH,
-Alex

On 7/27/17, 7:13 AM, "Olaf Krueger" <po...@olafkrueger.net> wrote:

>This is the relevant code which includes the binding which doesn't work
>for
>me [1]
>Cause I remember there were some issues with binding in the past I've
>tried
>different things:
>public/private var, {this.users}/{users}...
>
>ArrayList is still not working for me for whatever reason, even if I
>populate the dataProvider directly.
>(Yes, I've added "DataItemRendererFactoryForArrayList" to the css )
>I probably miss something.
>
>Thanks,
>Olaf
>
>[1]
>https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.co
>m%2Fok-at-github%2FFlexJSMDLTableDemo%2Fblob%2Fmaster%2Fsrc%2Forg%2FUsersL
>ist.mxml&data=02%7C01%7C%7C2b6cfe5f54fa485827cd08d4d4f9ae95%7Cfa7b1b5a7b34
>438794aed2c178decee1%7C0%7C0%7C636367616221602107&sdata=29%2F9X19jn7yJDwWD
>WQZt0MrlYTY2kNgZ8IhAq%2FmjgBw%3D&reserved=0
>
>
>
>--
>View this message in context:
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fapache-fle
>x-users.2333346.n4.nabble.com%2FFlexJS-MDL-Bind-data-via-bead-or-classic-b
>races-tp15508p15546.html&data=02%7C01%7C%7C2b6cfe5f54fa485827cd08d4d4f9ae9
>5%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636367616221602107&sdata=vl
>qBbc9WG6930XNHiboJ7MaNVg%2FYX3%2B%2Fqmk55HgWXOg%3D&reserved=0
>Sent from the Apache Flex Users mailing list archive at Nabble.com.


Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
This is the relevant code which includes the binding which doesn't work for
me [1]
Cause I remember there were some issues with binding in the past I've tried
different things:
public/private var, {this.users}/{users}...

ArrayList is still not working for me for whatever reason, even if I
populate the dataProvider directly.
(Yes, I've added "DataItemRendererFactoryForArrayList" to the css )
I probably miss something.

Thanks,
Olaf

[1]
https://github.com/ok-at-github/FlexJSMDLTableDemo/blob/master/src/org/UsersList.mxml



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15546.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

Just give me brief how your code look like. You have Group -> Table. Bead
ContainerDataBinding and try put simple:

[Bindable]
private var _dp:ArrayList; - to your Table

dataProvider={_dp}

Thanks,
Piotr




-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15545.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
The mdl:Table contains some data now, yeah! [1]

The main issues were:
- I've lost the  fx:Style source="resources/mdl-styles.css" assignment
during my tests
- I've passed just the relative path instead of the complete path to the
ItemRenderer inside the css [2]

But the binding still doesn't work... I have to take a look at this later.

@Piotr:
Please ignore my github repo until I've re-created it... cause this code is
still not workinf for whatever reason!

Thanks,
Olaf



[1] https://snag.gy/eJ5S1C.jpg

[2] 
IItemRenderer:
ClassReference("org.puremvc.as3.demos.flex.employeeadmin.view.components.item_renderer.ItemRendererUsersTable");



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15544.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Make sure that you have updated NextGen plugin. I would also try to Open this
project in Moonshine and see whether you have intellisense problem and you
are able to build it.

Do not forget exclude in additional compiler options
"-html-template=src/main/resources/mdl-js-index-template.html
-compiler.exclude-defaults-css-files=Basic-js.swc:default.css" - Not sure
whether name of swc is ok.

Thanks,
Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15543.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
>Could you commit your changes to github.
Done!
But please notice that this code doesn't compile for whatever reason.
It only compiles if you remove mdl:Table, but than it's even not working.
There's something broken (IntelliSense with VSCode also doesn't work).
I notice also that the $application.css is not created by the compiler.

I don't want o publish the other "working" origin repo cause it contains too
much other stuff.


>Did you change IDataProviderItemRendererMapper back to Array
Yes

>what version of FlexJS are you using ? 
The released 0.8.0

Thanks,
Olaf




--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15542.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

Could you commit your changes to github. Did you change
IDataProviderItemRendererMapper back to Array once you start choosing array.

Additionally what version of FlexJS are you using ? 

Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15541.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
I'm one step further now:
The table shows one row for each array item.
But each row just contains the string "EventDispatcher" inside the first
column [1].

What I've done so far is:
- Replaced ArrayList by Array
- Set js:Group as root element 
- Remove mdl:Grid
- Remove binding and populate dataProvider of the mdl:Table at
"initComplete"
- Add class .itemRendererUsersTable{} to css that refers to the mxml
ItemRenderer class

But it seems to me that the mdl:Table is still not able to resolve the
ItemRenderer class?

Thanks,
Olaf


[1] https://snag.gy/5jOyZx.jpg




--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15539.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

Try to use Group from Basic set and then Grid if you need some features
related to that component.

Thanks,
Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15536.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
Just tried it, still no success.
The only reason why I've chosen the mdl:Grid as root element was that it
seems to me that e.g. js:view does not work together with mdl.
Maybe I should try to replace mdl:grid by js:div later ...

Thanks again,
Olaf



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15531.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

I see another thing that you are using Grid but there is no GridCell. It is
recommended to use at least one GridCell. Your table should be bounded by
GridCell.

Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15526.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
I don't understand it but I've done what you've said... still no success.
I'll try to replace ArrayList by Array later...

Thanks,
Olaf



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15523.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

I see that you are using ArrayList in that case you have to change for Table
in your css IDataProviderItemRendererMapper to [1].

Let me know if it helped.

[1] https://paste.apache.org/iDfs

Thanks,
Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15522.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
>I will look into your project only after early next week.
Many thanks!

Olaf





--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15521.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Olaf,

I will look into your project only after early next week.

Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15520.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by Olaf Krueger <po...@olafkrueger.net>.
Thanks Piotr, but I've still no success.

To remove all other dependencies I've created a test project... and now I've
two issues:
1) As soon as the <mdl:Table> is part of UsersList.mxml, the compiler stops
working without any comment
2) In my origin project, the mdl:Table is compiled without problems (for
whatever reason) but I am still not able to populate the mdl:Table with some
data, even by just populating the dataProvider without using binding.

I'd highly appreciate it if you could take a look at my test project [1].
Probably I've overlooked something...

Thanks,
Olaf


[1] https://github.com/ok-at-github/FlexJSMDLTableDemo



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15518.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: [FlexJS][MDL] Bind data via bead or classic braces?

Posted by piotrz <pi...@gmail.com>.
Hi Olaf,

I think the other way of binding should work. Try to use 

<mdl:beads>
        <js:ContainerDataBinding/>
    </mdl:beads>

Or other type of bindings bead - depends what's containers are you using [1]

[1]
https://github.com/apache/flex-asjs/tree/develop/frameworks/projects/Binding/src/main/flex/org/apache/flex/binding

Piotr



-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-MDL-Bind-data-via-bead-or-classic-braces-tp15508p15509.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.