JJ.Pdpimagechild.Pdpimagechild.js
define(
'JJ.Pdpimagechild.Pdpimagechild'
, [
'JJ.Pdpimagechild.Pdpimagechild.View'
]
, function (
PdpimagechildView
)
{
'use strict';
return {
mountToApp: function mountToApp (container)
{
// using the 'Layout' component we add a new child view inside the 'Header' existing view
// (there will be a DOM element with the HTML attribute data-view="Header.Logo")
// more documentation of the Extensibility API in
// https://system.netsuite.com/help/helpcenter/en_US/APIs/SuiteCommerce/Extensibility/Frontend/index.html
var pdp = container.getComponent('PDP');
if (pdp) {
pdp.addChildView('ImageViewPdp', function myViewConstructor()
{
return new PdpimagechildView();
});
}
}
};
});
product-details-full.tpl
<div data-view="ImageViewPdp"></div>
Pdpimagechild.View.js
// @module JJ.Pdpimagechild.Pdpimagechild
define('JJ.Pdpimagechild.Pdpimagechild.View'
, [
'jj_pdpimagechild_pdpimagechild.tpl'
//, 'JJ.Pdpimagechild.Pdpimagechild.SS2Model'
, 'Backbone'
]
, function (
jj_pdpimagechild_pdpimagechild_tpl
//, PdpimagechildSS2Model
, Backbone
)
{
'use strict';
// @class JJ.Pdpimagechild.Pdpimagechild.View @extends Backbone.View
return Backbone.View.extend({
template: jj_pdpimagechild_pdpimagechild_tpl
, initialize: function (options) {
/* Uncomment to test backend communication with an example service
(you'll need to deploy and activate the extension first)
*/
// this.model = new PdpimagechildModel();
// var self = this;
// this.model.fetch().done(function(result) {
// self.message = result.message;
// self.render();
// });
}
, events: {
}
, bindings: {
}
, childViews: {
}
//@method getContext @return JJ.Pdpimagechild.Pdpimagechild.View.Context
, getContext: function getContext()
{
//@class JJ.Pdpimagechild.Pdpimagechild.View.Context https://www.publicdomainpictures.net/pictures/320000/nahled/background-image.png
/*this.message = this.message || 'Hello World!!'
return {
message: this.message
};*/
this.message = "img/discover.png"
return {
message: this.message
};
}
});
});
jj_pdpimagechild_pdpimagechild.tpl
<section class="pdpimagechild-info-card">
<span class="pdpimagechild-info-card-content">
<img src=" {{message}}" alt="image using child view">
</span>
</section>