I'm preparing a small project for university and I need help The project is an app for Corona accessible high school students. As part of the app, I have the option to be a "teacher user" and I need to enter grades for students. This is where the problem comes in. I want when I go to the "Enter Grades" page, I get a list of all the names of the students(currently checking it on teachers) that appear in the data base, and when I click on one of them I can change their grade.
I can get the list of all users in Checkbox but I can't manage to make Checkbox display them as checked or unchecked. (I working with FireBase) ** I already did tests with console log to check values and everything look fine
class EnterGrades extends React.Component {
state= {
students: null,
isLoaded: false,
checked: false
}
getStudentsOnQeueu = async () => {
let students = await this.studentsRef.orderByChild("fullname")
return students
}
componentDidMount(){
console.log('mounted')
db.collection('Teacher').get().then( snapshot =>{
const students = []
snapshot.forEach( doc =>{
KEY = Object.keys(doc.data());
console.log("KEYS is :"+KEY);
KEY.forEach( (key_id) => {
if(key_id=='fullname'){
const data = doc.data()
console.log(data)
students.push(data)
console.log('name is:'+doc.data().fullname)
}
else{
}
})
})
this.setState({ students: students})
this.setState({isLoaded:true})
getStudentsOnQeueu();
})
.catch( error => Alert.alert('Error',error))
}
renderStudentList(){
if(this.state.isLoaded!=false)
return this.state.students.map((item,key)=> {
return(
<TouchableOpacity style= key={key} onPress={()=> {this.value=!this.value}}>
<CheckBox value={false}/>
<Text style=>{item.fullname}</Text>
</TouchableOpacity>
)
})
}
onChecked(id){
const data = this.state.students
const index = data.findIndex(x => x.id === id);
console.log('id is '+ id)
console.log('index is '+index)
const isInList = false;
const checked = []
if(checked.length > 0){
console.log('checked length wasnt 0')
for(let i=0;i<checked.length;i++){
if(checked[i]==data[index])
isInList = true;
}
if(isInList== false)
checked.push(data[index]);
}
else{
console.log('checked length was 0')
console.log('data is' + data[index])
checked.push(data[index]);
}
this.setState({ checked: checked})
}
render(){
if(this.state.isLoaded!=false){
return (
<View style={styles.InputContainer}>
<Text>Enter Grades</Text>
<FlatList
data = {this.state.students}
renderItem ={({item}) =>
<Text>
{`Student name: ${item.fullname}\n`}
{`Email is: ${item.email}`}
</Text>
}
/>
<RadioForm
radio_props={this.dataList}
onPress={(value) => {this.setState({value:value})}}
/>
{this.renderStudentList()}
<Button
title="Update Students "
onPress={() => {
{this.getSelectedStudents}}
}
/>
</View>
)
}
}
each teacher has uid,email,checked(false/true) etc.
Aucun commentaire:
Enregistrer un commentaire