2016-12-29 17 views
0

У меня возникли проблемы с отображением customized backbone-forms с Dust.js template.Магистральные формы с пользовательским шаблоном пыли

Соответствующая часть моего кода находится здесь.

// Index.jx

<head> 
    [...] 
    <script type="text/javascript" src="scripts/jquery.js"></script> 
    <script type="text/javascript" src="scripts/underscore.js"></script> 
    <script type="text/javascript" src="scripts/backbone.js"></script> 
    <script type="text/javascript" src="scripts/backbone-forms.js"></script> 

</head> 

// dashboard.dust

<div id="placeholderForm"></div 
<section id="formTest"> 
      <form> 
        <h1>My Title here</h1> 
        <div data-editor="firstname,lastname,birthday"></div> 
        <hr> 
        <p> 
        some info 
        <div data-fields="address"></div> 
        </p> 
       </form> 
       </section> 

// DahsboardView.js

const 
    UserModel = require('../../models/user-model'), 
    _ = require('underscore'); 

let View = Backbone.Marionette.LayoutView.extend({ 
    template: require('./profile-dashboard.dust'), 


    initialize: function() { 
     let self = this; 
     _.bindAll(this, "render"); 

     this.model.bind('change', this.render); 
     this.model.fetch({ reset: true }); 
     console.log('model', this.model); 


    this.profileForm = new Backbone.Form({ 
     template: this.template, 
     model: this.model, 
     validate: true 
    }); 
     /* 
     this.profileForm = new Backbone.Form({ 
     model: this.model, 
     //template: _.template($('#formTest').html), //this.template, 
     validate: true 
     }).render(); 
     */ 
    }, 

    onRender: function() { 
     console.log('render init'); 
     console.log('form', this.profileForm); 
     let self = this; 
     this.profileForm.render(); // Got problem here because template is not recognise as function or generally just not recognise as valid template 
     $('#placeholder').append(this.profileForm.el); 
     return this; 
    } 

}); 

module.exports = View; 

Я также пытаюсь сделать форму после того, как прилагая элементов, но не повезло.

$('#userInfoForm').append(this.profileForm.render()el); 

Ошибки каждый раз разные, но в основном приходят, потому что this.profileForm не определен при вызове в render() и от моего понимания this.profileForm не определен, потому что this.template не является действительным

Любые идеи, как правильно общаться с магистральным-форм ?

Codepen (не работает, но, чтобы показать лучше код)

+1

включает в себя [mcve ]. –

+0

поблагодарить за комментарий @EmileBergeron. Я добавил всю соответствующую часть в моем представлении, а codePen не работал, но, по крайней мере, показал код, организованный как мой. –

ответ

0

не попробовать и получить шаблон из DOM .. у вас есть пыль.

this.profileForm = new Backbone.Form({ 
    template: require('./profile-form.dust'), 
    model: this.model, 
    validate: true 
}); 

также .. не присоединяют вид вручную .. магистральная форма представляет собой вид магистральный .. так просто создать его, добавьте область в макет и

this.getRegion('formRegion').show(this.profileForm);