フォーム一体型のLPをshopifyで制作しています。
LPフォームで入力された情報を、カートパーマリンクを利用してチェックアウトページに反映させたいのですが、
チェックアウトページ内の配送先住所「都道府県」のselect要素に情報が反映されず困っております。
どのようなslect要素のoption/valueにすれば良いのか教えてください。
(その他の住所部分や顧客名、商品選択情報は反映出来ております。)
参考：カートパーマリンク記事
https://help.shopify.com/ja/manual/products/details/cart-permalink
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shopify カートパーマリンク生成</title>
</head>
<body>
<!-- 入力フォーム -->
<form id="shopifyForm">
<div>
<label for="productID">商品ID:</label>
<input type="text" id="productID" required>
</div>
<div>
<label for="quantity">数量:</label>
<input type="number" id="quantity" required>
</div>
<div>
<label for="email">電子メール:</label>
<input type="email" id="email" required>
</div>
<div>
<label for="firstName">住所[first_name]:</label>
<input type="text" id="firstName" required>
</div>
<div>
<label for="lastName">住所[last_name]:</label>
<input type="text" id="lastName" required>
</div>
<div>
<label for="address1">住所[address1]:</label>
<input type="text" id="address1" required>
</div>
<div>
<label for="address2">住所[address2]:</label>
<input type="text" id="address2">
</div>
<div>
<label for="city">住所[city]:</label>
<input type="text" id="city" required>
</div>
<div>
<label for="province">住所[province]:</label>
<select name="province" id="province">
<option value="JP-13">東京都</option>
<option value="Tokyo">東京都</option>
</select>
</div>
<div>
<label for="zip">郵便番号[zip]:</label>
<input type="text" id="zip" required>
</div>
<button type="button" onclick="generateLink()">リンク生成</button>
</form>
<!-- 生成されたリンクを表示 -->
<p id="generatedLink"></p>
<script>
function generateLink() {
const productID = document.getElementById('productID').value;
const quantity = document.getElementById('quantity').value;
const email = document.getElementById('email').value;
const firstName = document.getElementById('firstName').value;
const lastName = document.getElementById('lastName').value;
const address1 = document.getElementById('address1').value;
const address2 = document.getElementById('address2').value;
const city = document.getElementById('city').value;
const province = document.getElementById('province').value;
const zip = document.getElementById('zip').value;
const baseUrl = `https://fake-sample.com/cart/${productID}:${quantity}/?`;
const params = [
`checkout[email]=${email}`,
`checkout[shipping_address][first_name]=${firstName}`,
`checkout[shipping_address][last_name]=${lastName}`,
`checkout[shipping_address][address1]=${address1}`,
`checkout[shipping_address][address2]=${address2}`,
`checkout[shipping_address][city]=${city}`,
`checkout[shipping_address][province]=${province}`,
`checkout[shipping_address][zip]=${zip}`
].join('&');
const fullUrl = baseUrl + params;
document.getElementById('generatedLink').innerText = fullUrl;
window.location.href = fullUrl;
}
</script>
</body>
</html>
