Having Problems With Ajax/Fetch Method

Using Django
1

Hi, i am trying to load data through Ajax, it console logs perfectly but does not appear in my webpage, can anyone help please :slight_smile:

My Views File:

def post_data(request):

qs = Post.objects.all()

data = []

for obj in qs:

item = {

'title': obj.title,

}

data.append(item)

return JsonResponse({"data": data})

My JavaScript File:

const pb = document.getElementById("post-box")

async function Start1() {
	const a = await fetch("data/")
	const data = await a.json()
	console.log(data)
	renderHTML(data)
}

Start1()

function renderHTML (OurData) {
	var htmlstring =""
	for (i=0; i < OurData.length; i++){
		htmlstring += `<p> ${OurData[i]} </p>`
	} 
	pb.insertAdjacentHTML("beforeend",htmlstring)

It console logs perfectly: here is the pic

1280×160 43.7 KB

2

I think this is more of a Javascript issue rather than a Django one.

It gets to the console.log statement and then?
I suggest you to follow what’s happening inside your renderHTML function using the browser debugger.

1 Like
3

hi i fixed it by calling OurData.data[i]

i was not putting the .data that’s all

thank you for your time :slight_smile:

1 Like