canjs/canjs

We CAN build the impossible! https://codepen.io/justinbmeyer/pen/yEGGoK

Jeroen Cornelissen

@jeroencornelissen

:point_up: 22 maart 2016 17:27
@cherifGsoul @pYr0x Do you mean something like this: http://jsbin.com/tuciqivuxi/1/edit?html,js,output
Look at the clicky function. It feels kind of wrong removing the component and inserting it again. I think the power of CanJS is the live binding, change one property and my app rerenders automaticilly.

Jeroen Cornelissen

@jeroencornelissen

@dbleier @pYr0x I added a reply to the existing forum topic:
http://forums.donejs.com/t/modifying-view-after-rendering-finishes/52/3

Julian

@pYr0x

@jeroencornelissen my jsbin example didnt help you?

http://jsbin.com/nakogenura/edit?html,js,console,output

and check on the my-input inserted event

is this also fired only once?

Jeroen Cornelissen

@jeroencornelissen

@pYr0x this could work, I already have a component for each input type so I could provide a focus attr from the backend.

I console log the inserted event and that gets triggered every time so this could work :+1:

Julian

@pYr0x

other option is to use autofocus

@jeroencornelissen http://www.w3schools.com/tags/att_input_autofocus.asp

Jeroen Cornelissen

@jeroencornelissen

@pYr0x autofocus only seems to werk first time, not when switching between forms.
With the extra focus attribute I can make it work! :clap:

Julian

@pYr0x

good.. if you can add your working example to the forum, would be nice

or provide a solution

Mohamed Cherif Bouchelaghem

@cherifGsoul

@jeroencornelissen thank you for submiting it in donejs forums

This message was deleted

Christopher Oliphant

@RALifeCoach

in the docs it recommends including css files with components

how best to do that?

is there some way of bringing the file into the component?

Guido Smeets

@gsmeets

Depending on how much css you have I wouldn't bother

Julian

@pYr0x

dont understand the question...

Christopher Oliphant

@RALifeCoach

there is a property on component for template, it would be nice to have a property for css - that could be a css, less or sass string or file

Julian

@pYr0x

what do you mean with property?

Christopher Oliphant

@RALifeCoach

can.Component.extend({
tag: ‘tag-name’
*template*: can.view(’path to stache file’)

wwould tag and template not be properties of the component?

Julian

@pYr0x

include css or less import 'path/to/style.css';

Christopher Oliphant

@RALifeCoach

except this project does not use steal

Julian

@pYr0x

or require();

tried <can-import>?

in the template

https://canjs.com/docs/can|view|stache|system.import.html

Christopher Oliphant

@RALifeCoach

interesting suggestion, can I use it to import a script as well?

Julian

@pYr0x

i think so

try it

Christopher Oliphant

@RALifeCoach

I will, do you know the docs mean when they say that can-import only works with can.autorender?

Julian

@pYr0x

it says with can.autorender or the system plugin

Christopher Oliphant

@RALifeCoach

even still, I am not sure what that means

Julian

@pYr0x

https://canjs.com/docs/can|view|stache|system.html

you have to use stache can/view/stache/system

it means, it works with stache templates and a script tag that is tagged as autorender

Christopher Oliphant

@RALifeCoach

This project is not using steal or system. There is no DI.

Julian

@pYr0x

you dont need steal

or system

it works with stache

and this plugin https://github.com/canjs/canjs/blob/master/view/stache/system.js

which is provided by stache

Christopher Oliphant

@RALifeCoach

okay - I will play with it and see what I can figure out

Christopher Oliphant

@RALifeCoach

I apologize for asking so many questions. And I now have another one.

I have a component like so:

<feature-icon type="photo" types="photos" isActive="{{isActive}}" hasMedia="{{hasMediaContent('photos')}}" profilesURL="options.profilesURL"></feature-icon>

The ‘hasMedia’ attribute changes, but the binding to ‘hasMedia’ doesn’t fire.

    can.Component.extend({
        tag: 'feature-icon',
        template: can.view('/modules/feature-icon/feature-icon.stache'),
        viewModel: can.Map.extend({
            init: function () {
                this.bind('hasMedia', function () {
                    debugger;
                });
            },
            hasMedia: false
        })
    });

Christopher Oliphant

@RALifeCoach

when I examine the element I can see that hasMedia has changed

Julian

@pYr0x

try

Where communities thrive

People

Repo info

Activity