Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Bem como todos os componentes da camada social do Fluig, a Timeline utiliza o facilitador SuperWidget na camada de Javascript.

Para saber mais sobre o funcionamento da SuperWidget consulte o manual em https://gist.github.com/chambs/e0799862508c3ba3c1cc

 

Bind de elementos HTML a funções

Para associar um evento a um elemento HTML, é preciso seguir o formato abaixo.
O componente HTML deve possuir um atributo data- o qual receberá o bind de funções da widget.

Exemplo de um bind da função salvar em um botão

No HTML:

<button data-salvar-dados>Salvar dados</button>

No arquivo .js da widget:

bindings: {
    local: {
        'salvar-dados': ['click_salvarDados']
    }
}

 //implementação da função salvar

salvarDados: function(el, ev) {
    //escreva a ação do botão salvar-dados aqui
},

A função atribuida a um elemento HTML possui 2 parâmetros:

  • el: Representa o próprio botão. No caso do exemplo: <button data-salvar-dados>Salvar dados</button>
  • ev: representa o objeto do evento disparado

Note que não é necessário adicionar o prefixo data-.
O array atribuido é uma string no padrão EVENTO_FUNÇÃO. Várias combinações de evento x função podem ser atribuidos a um único elemento.
Os bindings feitos no objeto local são referentes a elementos HTML dentro do div da widget. E os binds feitos no objeto global são para elementos fora do div da widget, ou retirados do div da widget por outro script, como é o caso das modais do jQueryUI.


 



 teste