Editing of array in reactjs
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I am trying to edit my list in an array but it doesn't work.
I am trying the single input value update it works but I don't know how to
update the array.
why this method was not working, and give the solution for the array edit
I store the data from the array but it says [object object] what can I do?
state={
name:'Ajith',
name1: 'kumar',
name2 : ,
changeEdit:false
}
edit = () => {
this.setState({
changeEdit : !this.state.changeEdit
});
let array = {
name : this.state.name,
name1 : this.state.name1
};
let Name = this.state.name2;
Name.push(array);
this.setState({
name2 : Name
})
console.log(this.state.name2)
}
update = (e) => {
this.setState({
changeEdit : !this.state.changeEdit,
name : this.refs.Edit.value,
name1 : this.refs.Edit1.value,
name2 : this.refs.Edit2.value
})
}
inputEditEvent = (e) => {
return(
<div
<div>
<input type="text" defaultValue={this.state.name} ref = "Edit" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name1} ref = "Edit1" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name2} ref = "Edit2" style={{height:'30px'}}/>
</div>
<div>
<Editings cancel={this.edit} update={this.update}/>
</div>
</div>
)
}
editEvent = (e) => {
return(
<div>
<button onClick={this.edit}>
Edit
</button>
<h2>
{this.state.name}<br/>
{this.state.name}<br/>
<br/>
{this.state.name}
</h2>
</div>
)
}
render()
{
return this.state.changeEdit ?
this.inputEditEvent() : this.editEvent()
}
}
javascript reactjs
add a comment |
I am trying to edit my list in an array but it doesn't work.
I am trying the single input value update it works but I don't know how to
update the array.
why this method was not working, and give the solution for the array edit
I store the data from the array but it says [object object] what can I do?
state={
name:'Ajith',
name1: 'kumar',
name2 : ,
changeEdit:false
}
edit = () => {
this.setState({
changeEdit : !this.state.changeEdit
});
let array = {
name : this.state.name,
name1 : this.state.name1
};
let Name = this.state.name2;
Name.push(array);
this.setState({
name2 : Name
})
console.log(this.state.name2)
}
update = (e) => {
this.setState({
changeEdit : !this.state.changeEdit,
name : this.refs.Edit.value,
name1 : this.refs.Edit1.value,
name2 : this.refs.Edit2.value
})
}
inputEditEvent = (e) => {
return(
<div
<div>
<input type="text" defaultValue={this.state.name} ref = "Edit" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name1} ref = "Edit1" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name2} ref = "Edit2" style={{height:'30px'}}/>
</div>
<div>
<Editings cancel={this.edit} update={this.update}/>
</div>
</div>
)
}
editEvent = (e) => {
return(
<div>
<button onClick={this.edit}>
Edit
</button>
<h2>
{this.state.name}<br/>
{this.state.name}<br/>
<br/>
{this.state.name}
</h2>
</div>
)
}
render()
{
return this.state.changeEdit ?
this.inputEditEvent() : this.editEvent()
}
}
javascript reactjs
add a comment |
I am trying to edit my list in an array but it doesn't work.
I am trying the single input value update it works but I don't know how to
update the array.
why this method was not working, and give the solution for the array edit
I store the data from the array but it says [object object] what can I do?
state={
name:'Ajith',
name1: 'kumar',
name2 : ,
changeEdit:false
}
edit = () => {
this.setState({
changeEdit : !this.state.changeEdit
});
let array = {
name : this.state.name,
name1 : this.state.name1
};
let Name = this.state.name2;
Name.push(array);
this.setState({
name2 : Name
})
console.log(this.state.name2)
}
update = (e) => {
this.setState({
changeEdit : !this.state.changeEdit,
name : this.refs.Edit.value,
name1 : this.refs.Edit1.value,
name2 : this.refs.Edit2.value
})
}
inputEditEvent = (e) => {
return(
<div
<div>
<input type="text" defaultValue={this.state.name} ref = "Edit" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name1} ref = "Edit1" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name2} ref = "Edit2" style={{height:'30px'}}/>
</div>
<div>
<Editings cancel={this.edit} update={this.update}/>
</div>
</div>
)
}
editEvent = (e) => {
return(
<div>
<button onClick={this.edit}>
Edit
</button>
<h2>
{this.state.name}<br/>
{this.state.name}<br/>
<br/>
{this.state.name}
</h2>
</div>
)
}
render()
{
return this.state.changeEdit ?
this.inputEditEvent() : this.editEvent()
}
}
javascript reactjs
I am trying to edit my list in an array but it doesn't work.
I am trying the single input value update it works but I don't know how to
update the array.
why this method was not working, and give the solution for the array edit
I store the data from the array but it says [object object] what can I do?
state={
name:'Ajith',
name1: 'kumar',
name2 : ,
changeEdit:false
}
edit = () => {
this.setState({
changeEdit : !this.state.changeEdit
});
let array = {
name : this.state.name,
name1 : this.state.name1
};
let Name = this.state.name2;
Name.push(array);
this.setState({
name2 : Name
})
console.log(this.state.name2)
}
update = (e) => {
this.setState({
changeEdit : !this.state.changeEdit,
name : this.refs.Edit.value,
name1 : this.refs.Edit1.value,
name2 : this.refs.Edit2.value
})
}
inputEditEvent = (e) => {
return(
<div
<div>
<input type="text" defaultValue={this.state.name} ref = "Edit" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name1} ref = "Edit1" style={{height:'30px'}}/>
<input type="text" defaultValue={this.state.name2} ref = "Edit2" style={{height:'30px'}}/>
</div>
<div>
<Editings cancel={this.edit} update={this.update}/>
</div>
</div>
)
}
editEvent = (e) => {
return(
<div>
<button onClick={this.edit}>
Edit
</button>
<h2>
{this.state.name}<br/>
{this.state.name}<br/>
<br/>
{this.state.name}
</h2>
</div>
)
}
render()
{
return this.state.changeEdit ?
this.inputEditEvent() : this.editEvent()
}
}
javascript reactjs
javascript reactjs
edited Jan 3 at 17:41
Emile Bergeron
10.8k44673
10.8k44673
asked Jan 3 at 16:16
Abinash MAbinash M
11
11
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
This is not an array, is an object
let array = {
name : this.state.name,
name1 : this.state.name1
};
This is an array
let array = [
{name : this.state.name },
{name1 : this.state.name1 },
];
Also notice setState is async:
this.setState({
name2 : Name // next value
})
console.log(this.state.name2) // will print previous value
Correct way to log state:
this.setState({
name2 : Name // next state
},
() => console.log(this.state.name2) // next state
);
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
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%2f54026038%2fediting-of-array-in-reactjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
This is not an array, is an object
let array = {
name : this.state.name,
name1 : this.state.name1
};
This is an array
let array = [
{name : this.state.name },
{name1 : this.state.name1 },
];
Also notice setState is async:
this.setState({
name2 : Name // next value
})
console.log(this.state.name2) // will print previous value
Correct way to log state:
this.setState({
name2 : Name // next state
},
() => console.log(this.state.name2) // next state
);
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
add a comment |
This is not an array, is an object
let array = {
name : this.state.name,
name1 : this.state.name1
};
This is an array
let array = [
{name : this.state.name },
{name1 : this.state.name1 },
];
Also notice setState is async:
this.setState({
name2 : Name // next value
})
console.log(this.state.name2) // will print previous value
Correct way to log state:
this.setState({
name2 : Name // next state
},
() => console.log(this.state.name2) // next state
);
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
add a comment |
This is not an array, is an object
let array = {
name : this.state.name,
name1 : this.state.name1
};
This is an array
let array = [
{name : this.state.name },
{name1 : this.state.name1 },
];
Also notice setState is async:
this.setState({
name2 : Name // next value
})
console.log(this.state.name2) // will print previous value
Correct way to log state:
this.setState({
name2 : Name // next state
},
() => console.log(this.state.name2) // next state
);
This is not an array, is an object
let array = {
name : this.state.name,
name1 : this.state.name1
};
This is an array
let array = [
{name : this.state.name },
{name1 : this.state.name1 },
];
Also notice setState is async:
this.setState({
name2 : Name // next value
})
console.log(this.state.name2) // will print previous value
Correct way to log state:
this.setState({
name2 : Name // next state
},
() => console.log(this.state.name2) // next state
);
edited Jan 3 at 16:27
answered Jan 3 at 16:19
Mosè RaguzziniMosè Raguzzini
4,7601226
4,7601226
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
add a comment |
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
after that it not working
– Abinash M
Jan 3 at 16:23
after that it not working
– Abinash M
Jan 3 at 16:23
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
This is not an edit for your code, I'm pointing out a misunderstood of data types
– Mosè Raguzzini
Jan 3 at 16:24
okay thanks bro
– Abinash M
Jan 3 at 16:27
okay thanks bro
– Abinash M
Jan 3 at 16:27
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%2f54026038%2fediting-of-array-in-reactjs%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