I'm currently attempting to connect to my MySQL database using the Django REST backend. On my frontend, I'm using Vue with Axios. Specifically, I have a junction table called TeacherSubjectJunction, and I want to access it through the following path to retrieve all subjects for a specific teacherid.
app/urls.py
path('teacherssubjects/<int:teacherid>/', TeacherSubjectJunctionList.as_view())
views.py:
class TeacherSubjectJunctionList(generics.ListAPIView):
queryset = TeacherSubjectJunction.objects.all()
serializer_class = TeacherSubjectJunctionDeepSerializer
filterset_class = TeacherSubjectJunctionFilter
serializer.py:
class TeacherSubjectJunctionDeepSerializer(serializers.ModelSerializer):
class Meta:
model = TeacherSubjectJunction
fields = ['teacherid', 'subjectid']
depth = 3
To filter, I am utilizing the third-party library django-filter.
filters.py
class TeacherSubjectJunctionFilter(filters.FilterSet):
class Meta:
model = TeacherSubjectJunction
fields = ['teacherid', 'subjectid']
models.py
class TeacherSubjectJunction(models.Model):
pk_teachersubject = models.AutoField(primary_key=True)
teacherid = models.ForeignKey(Teachers, models.CASCADE, db_column='TeacherID')
subjectid = models.ForeignKey(Subjects, models.CASCADE, db_column='SubjectID')
class Meta:
db_table = 'teacher_subject_junction'
In my Vue file, I'm trying to access this path with the given code snippet:
async getSubjectsforTeacher(teacher){
await getAPI.get('/teacherssubjects/?teacherid='+teacher)
.then(response =>{
this.SubjectsforTeacherData[teacher] = response.data
console.log(this.SubjectsforTeacherData)
}).catch(error =>{
if (error.response){
console.log( error.response )
}else if(error.request){
console.log( error.request )
}else if(error.message){
console.log( error.message )
}
})
}
The above setup results in the following error message:
GET http://127.0.0.1:8000/teacherssubjects/?teacherid=3 404 (Not Found)
Given that I'm relatively new to DRF, I suspect there might be an issue with my URL configuration. However, what's intriguing is that I have a similar setup for another junction table named StudentLectureJunction, as shown below:
app/url.py:
path('studentslectures/<int:lectureid>/', StudentLectureJunctionList.as_view())
views.py:
class StudentLectureJunctionList(generics.ListAPIView):
queryset = StudentLectureJunction.objects.all()
serializer_class = StudentLectureJunctionDeepSerializer
filterset_class = StudentLectureJunctionFilter
serializer.py:
class StudentLectureJunctionDeepSerializer(serializers.ModelSerializer):
class Meta:
model = StudentLectureJunction
fields = ['lectureid', 'studentid']
depth = 4
filters.py:
class StudentLectureJunctionFilter(filters.FilterSet):
class Meta:
model = StudentLectureJunction
fields = ['studentid', 'lectureid']
models.py
class TeacherSubjectJunction(models.Model):
pk_teachersubject = models.AutoField(primary_key=True)
teacherid = models.ForeignKey(Teachers, models.CASCADE, db_column='TeacherID')
subjectid = models.ForeignKey(Subjects, models.CASCADE, db_column='SubjectID')
class Meta:
db_table = 'teacher_subject_junction'
When implementing this setup in my Vue file, everything works correctly and returns the expected results. Can anyone assist me in troubleshooting the issue with my first setup?