How can I render a section template with AJAX on a product page?

Technical Q&A
1

I am looking for a button click to render a section template or reload the current product via AJAX. Currently, I have all the products set up and can click a button to trigger an API call to get the section. But even though I am passing the product ID the section comes back without product data. Is there a way to have an AJAX call on a product page that will allow me to replace the current product with another one?

request = new XMLHttpRequest()
request.open('GET', '/?section_id=product-name-template&product_id='+event.target.dataset.productId, true)
request.send()

My current request including the product_id

1 Like
2

Hey

Your API call is a request for a homepage’s section! So, obviously, it has no product/collection data

With section rendering, if you want to add product/collection context simply call

fetch(`/products/your-product-handle?section_id=your-section-id`)

Same for collection.