Uncaught TypeError: Cannot set property 'isEditMode' of undefined

Multi tool use
I'm trying to convert an AngularJS app to Vue JS. However, I keep getting js errors like "Uncaught TypeError: Cannot set property 'isEditMode' of undefined".
What I'm trying to do here is make the page editable when a vuetify icon is clicked which in turn calls a function and displays some other icons. The code I currently have is as follows:
new Vue({
el: '#app',
data: {
saveView: false,
isPageEdit: false,
saveFailed: false,
isPageLocked: false,
editFailed: false,
timerMessage: false,
boundData:
{
sections: {
isEditMode: null
}
}
},
methods:
{
setedit: function (isEditMode, sectionId) {
this.boundData.sections[sectionId].isEditMode = isEditMode;
validation(sectionId);
How can this be resolved?
javascript angularjs vue.js vuejs2 vuetify.js
add a comment |
I'm trying to convert an AngularJS app to Vue JS. However, I keep getting js errors like "Uncaught TypeError: Cannot set property 'isEditMode' of undefined".
What I'm trying to do here is make the page editable when a vuetify icon is clicked which in turn calls a function and displays some other icons. The code I currently have is as follows:
new Vue({
el: '#app',
data: {
saveView: false,
isPageEdit: false,
saveFailed: false,
isPageLocked: false,
editFailed: false,
timerMessage: false,
boundData:
{
sections: {
isEditMode: null
}
}
},
methods:
{
setedit: function (isEditMode, sectionId) {
this.boundData.sections[sectionId].isEditMode = isEditMode;
validation(sectionId);
How can this be resolved?
javascript angularjs vue.js vuejs2 vuetify.js
add a comment |
I'm trying to convert an AngularJS app to Vue JS. However, I keep getting js errors like "Uncaught TypeError: Cannot set property 'isEditMode' of undefined".
What I'm trying to do here is make the page editable when a vuetify icon is clicked which in turn calls a function and displays some other icons. The code I currently have is as follows:
new Vue({
el: '#app',
data: {
saveView: false,
isPageEdit: false,
saveFailed: false,
isPageLocked: false,
editFailed: false,
timerMessage: false,
boundData:
{
sections: {
isEditMode: null
}
}
},
methods:
{
setedit: function (isEditMode, sectionId) {
this.boundData.sections[sectionId].isEditMode = isEditMode;
validation(sectionId);
How can this be resolved?
javascript angularjs vue.js vuejs2 vuetify.js
I'm trying to convert an AngularJS app to Vue JS. However, I keep getting js errors like "Uncaught TypeError: Cannot set property 'isEditMode' of undefined".
What I'm trying to do here is make the page editable when a vuetify icon is clicked which in turn calls a function and displays some other icons. The code I currently have is as follows:
new Vue({
el: '#app',
data: {
saveView: false,
isPageEdit: false,
saveFailed: false,
isPageLocked: false,
editFailed: false,
timerMessage: false,
boundData:
{
sections: {
isEditMode: null
}
}
},
methods:
{
setedit: function (isEditMode, sectionId) {
this.boundData.sections[sectionId].isEditMode = isEditMode;
validation(sectionId);
How can this be resolved?
javascript angularjs vue.js vuejs2 vuetify.js
javascript angularjs vue.js vuejs2 vuetify.js
asked Dec 31 '18 at 12:11


Archit BatraArchit Batra
305
305
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
you need to make sections an array of objects first. then you can access your property like that
so something like this
sections: [
{isEditMode: null},
{isEditMode: true},
]
or if you'd like to keep the current data structure you have then you can directly access isEditMode like that this.boundData.sections.isEditMode
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
add a comment |
Your data structure doesn't match how you're trying to index it. You have defined
`boundData.sections.isEditMode`
and you are trying to reference
`boundData.sections[sectionId].isEditMode`
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53987367%2funcaught-typeerror-cannot-set-property-iseditmode-of-undefined%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
you need to make sections an array of objects first. then you can access your property like that
so something like this
sections: [
{isEditMode: null},
{isEditMode: true},
]
or if you'd like to keep the current data structure you have then you can directly access isEditMode like that this.boundData.sections.isEditMode
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
add a comment |
you need to make sections an array of objects first. then you can access your property like that
so something like this
sections: [
{isEditMode: null},
{isEditMode: true},
]
or if you'd like to keep the current data structure you have then you can directly access isEditMode like that this.boundData.sections.isEditMode
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
add a comment |
you need to make sections an array of objects first. then you can access your property like that
so something like this
sections: [
{isEditMode: null},
{isEditMode: true},
]
or if you'd like to keep the current data structure you have then you can directly access isEditMode like that this.boundData.sections.isEditMode
you need to make sections an array of objects first. then you can access your property like that
so something like this
sections: [
{isEditMode: null},
{isEditMode: true},
]
or if you'd like to keep the current data structure you have then you can directly access isEditMode like that this.boundData.sections.isEditMode
answered Dec 31 '18 at 12:30


Omar EmadOmar Emad
6113
6113
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
add a comment |
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
Thanks but can you please tell how exactly the data structure can be modified in this case, keeping the sections intact?
– Archit Batra
Dec 31 '18 at 12:55
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
writing sections like that makes it an array. so vueJs will always look for a sections property of type array and as you may have expected it won't find it and will always return that undefined error to you. so as I said you have to either make sections an array of objects so you can access it with this line 'this.boundData.sections[sectionId].isEditMode' or keep it as it is and access it like that 'this.boundData.sections.isEditMode'
– Omar Emad
Dec 31 '18 at 13:04
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
I understand that but i need help regarding the exact syntax for that in terms of the code...
– Archit Batra
Dec 31 '18 at 13:22
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
you're asking vue to read a certain array that doesn't exist! so as far as I know it can't be done with the same exact snytax. you will have to change something
– Omar Emad
Dec 31 '18 at 15:05
add a comment |
Your data structure doesn't match how you're trying to index it. You have defined
`boundData.sections.isEditMode`
and you are trying to reference
`boundData.sections[sectionId].isEditMode`
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
add a comment |
Your data structure doesn't match how you're trying to index it. You have defined
`boundData.sections.isEditMode`
and you are trying to reference
`boundData.sections[sectionId].isEditMode`
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
add a comment |
Your data structure doesn't match how you're trying to index it. You have defined
`boundData.sections.isEditMode`
and you are trying to reference
`boundData.sections[sectionId].isEditMode`
Your data structure doesn't match how you're trying to index it. You have defined
`boundData.sections.isEditMode`
and you are trying to reference
`boundData.sections[sectionId].isEditMode`
answered Dec 31 '18 at 12:18


Roy JRoy J
26.8k33258
26.8k33258
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
add a comment |
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
Thanks but can you tell how that can be done?
– Archit Batra
Dec 31 '18 at 12:29
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53987367%2funcaught-typeerror-cannot-set-property-iseditmode-of-undefined%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
aI,w8ZaPkd92e7s OHdqIZfXQNp8v gef