mcbowen

Adding the below code triggered the change event and seems to be working for me document.querySelector("select[data-variant-option-name='Color']").dispatchEvent(new Event("change"));

Hi, I want to connect my DPD account to my Squarespace ecommerce site so that shipping labels are automatically printed out when an order is recieved. I havent managed to find any information on this so far, has anyone managed to do this without using a plugin?

Site URL: https://pigeon-eagle-lfzb.squarespace.com/store-1/p/style-01-hs2wj-rec4m-3dpak Password = 123 Hi, When I try to change the value set in a select element using jQuery the value does not display on the screen, the selected attribute is added in HTML and when clicking on the dropdown the correct value is highlighted. This is what displays: This is what I am expecting: The correct value is highlighted when clicking on the dropdown: I have the following code which is not working on the Squarespace site: <script src="https://code.jquery.com/jquery-3.4.1.js"></script> <script> $(document).ready(function() { $('select[data-variant-option-name=Color] option[value=Purple]').attr('selected', 'selected'); }); </script> I've copied the except HTML and jQuery into jsfiddle and it seems to work there: http://jsfiddle.net/qaft4ve0/1/ I have also tried using .val and .props but this does not fix it. Updates: I have since tried adding a dropdown box on the home page and this works correctly so there must be something on the product page which is causing the issue. I have a few more updates on this (Still not working): Ive manaaged to get the dropbown box to visually update by setting the data-text attribute: $("div.variant-select-wrapper.color-wrapper").attr("data-text", "white"); Looking at the HTML code I have noticed the following: data-unselected-options="["Color","Size"]" This does not change when using jQuery, it only changes when I manually click on a dropdown box and select it. There is also a new attribute data-selected-variant that gets added when both colour and size are selected: data-selected-variant="{"attributes":{"Size":"M","Color":"White"},"optionValues":[ {"optionName":"Size","value":"M"},{"optionName":"Color","value":"White"}], "id":"ae248023-a7b2-4ebb-89ef-55764797f7e1","sku":"SQ2275958","price":4000, "salePrice":0,"priceMoney":{"currency":"GBP","value":"40.00"}, "salePriceMoney":{"currency":"GBP","value":"0.00"},"onSale":false,"unlimited":true, "qtyInStock":0,"width":0,"height":0,"weight":0,"imageIds":[],"images":[],"len":0}" and also: data-variant-in-stock="true"

Seems to work thanks

Site URL: https://dog-giraffe-4pbj.squarespace.com/ Password = password Hi, Is there a way to activate the mobile view for a certain section at a desired screen width as below: As there is so much text in this section I would like it to display with each element stacked on top of eachother as in the mobile version below: