Hello People, So I am working on a custom suitecom...
# suitecommerce
a
Hello People, So I am working on a custom suitecommerce extensions that would fetch some images from Netsuite and pass it to the template using addToViewContextDefinition. The issue that I am facing is that the template I am passing my context variable to gets loaded before the values can get to the template. Is there any way to pause the template load until the variable can get to the template? Thanks
s
It sounds like you're calling addToViewContextDefinition too late in the execution process, so you either need to call it earlier (for example in your entry point file) or re-render the view that the variables have been loaded.
a
I am calling the addToViewContextDefinition in my entrypoint file.
s
Then I have a hard time believing that the problem is the one you describe. Are you calling it in the mountToApp?
a
Yes, I am calling the function in mountToApp. I am adding images in header_menu.tpl file. The images I am adding do appear when I load the website, change to mobile view, and then go back to desktop view. I am assuming this is because the template is loading before the values can get to it.
I can see the response when website is loaded. but images don't appear.
s
Alright. Well I think that there’s either something up with your code or your code relies on something in the view to render first. The idea that it won’t load a property with a simple URL into the view before rendering is highly irregular. If you want, you could wrap your code in an event that waits for certain things to load first before running your code, eg:
Copy code
container.getLayout().on('beforeRender', function () {...}
But this is not the best way to solve this problem.
a
var arrToReturn = [];
function fetchCategoryImages() {
var myModel = new ImageFetchModel();
return myModel.fetch().done(function (imagesArr) {
imagesArr.forEach(image => {
arrToReturn.push(image.thumbnailurl)
});
});
}
return {
mountToApp: function (container) {
var layout = container.getComponent('Layout');
if (layout) {
var fetchPromise = fetchCategoryImages();
fetchPromise.then(function () {
layout.addToViewContextDefinition('Header.Menu.View', 'categoryImages', 'array', function () {
return arrToReturn;
});
});
}
}
}
I did wrap the code on an event as well but that wouldn't solve the issue. Can you see anything in the entry point file code that is wrong?
z
Hey @Steve Goldberg I am facing the same issue can you please help with that
m
I think the problem you currently have is that the mountToApp it’s not the right place to load this. The app wont wait the fetch to comeback before render.
s
Well, there you go — you’ve made a fetch and delayed your code until it completes
☝🏻 1
In this case, the best thing to do would be re-render the view in your
then()
block
🙌 1
☝️ 1
a
Thank You @Steve Goldberg @Martin