Магистральные формы с пользовательским шаблоном Dust
У меня проблемы с пониманием того, как отображать настраиваемые опорные формы с помощью шаблона Dust.js.
Соответствующая часть моего кода здесь.
// 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 ответ
Не пытайтесь получить шаблон из DOM.. у вас есть пыль.
this.profileForm = new Backbone.Form({
template: require('./profile-form.dust'),
model: this.model,
validate: true
});
также.. не добавляйте представление вручную.. backbone-form - это представление основы... просто создайте его, добавьте область в макет и
this.getRegion('formRegion').show(this.profileForm);