Estoy usando este código para enviar datos a mi hoja.
Para El Nombre Completo, Teléfono, Dirección, ..., los datos se envían sin problema.
Pero estoy bloqueado para dividir y enviar datos de radio de entrada de valor y enviarlos a mi hoja.
Ejemplo si se selecciona la segunda entrada de radio ( sku_order_2|quantity2|price22)
sku = sku_order_2 cantidad = cantidad2 precio = precio22
const scriptURL = 'https://script.google.com/........' const form = document.forms['formName'] form.addEventListener('submit', e => { e.preventDefault() fetch(scriptURL, { method: 'POST', body: new FormData(form)}) .then(response => console.log('Success!', response)) .catch(error => console.error('Error!', error.message)) }) <form action="" name="formName" method="post" id="formName" data-redirect="" class="form"> <input id="order1" class="variant" type="radio" name="order" value="sku_order_1|quantity1|price15" hidden="" checked=""> <input id="order2" class="variant" type="radio" name="order" value="sku_order_2|quantity2|price22" hidden=""> <input id="order2" class="variant" type="radio" name="order" value="sku_order_3|quantity3|price26" hidden=""> <input id="fullname" class="input" type="text" placeholder="Fullname" name="fullname" required=""> <input id="phone" class="input" type="number" placeholder="Phone" name="phone" required=""> <input id="address" class="input" type="text" placeholder="Address" name="address" required=""> </form>Utilice los métodos FormData ( https://developer.mozilla.org/en-US/docs/Web/API/FormData )
Puede obtener el valor del pedido con formData.get('order')
de lo que puede dividir ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split ) la cadena y usar el resultado para agregar los campos: sku, cantidad, precio.
const scriptURL = 'https://script.google.com/........' const form = document.forms['formName'] form.addEventListener('submit', e => { e.preventDefault() const formData = new FormData(form) const order = formData.get('order').split('|') // Split the string using '|' into an array [sku, quantity, price] formData.append('sku', order[0]) formData.append('quantity', order[1]) formData.append('price', order[2]) formData.delete('order') fetch(scriptURL, { method: 'POST', body: formData}) .then(response => console.log('Success!', response)) .catch(error => console.error('Error!', error.message)) }) <form action="" name="formName" method="post" id="formName" data-redirect="" class="form"> <div> <input id="order1" class="variant" type="radio" name="order" value="sku_order_1|quantity1|price15" checked=""> 1 <input id="order2" type="radio" class="variant" name="order" value="sku_order_2|quantity2|price22"> 2 <input id="order3" class="variant" type="radio" name="order" value="sku_order_3|quantity3|price26"> 3 </div> <input id="fullname" class="input" type="text" placeholder="Fullname" name="fullname" required=""> <input id="phone" class="input" type="number" placeholder="Phone" name="phone" required=""> <input id="address" class="input" type="text" placeholder="Address" name="address" required=""> <input type="submit" value="Send"> </form>Si desea dividir la propiedad de la order , puede hacer lo siguiente:
order de formData|sku , quantity y pricesku , quantity y price a formDataVer este violín: https://jsfiddle.net/Lxujkotp/1/
Código extendido:
form.addEventListener('submit', e => { var data = new FormData(form); var order = data.get('order'); var orderParts = order.split('|'); // WARNING: if the "order values" does not have a fix ordering, map the values here more sophisticated! var sku = orderParts[0]; var quantity = orderParts[1]; var price = orderParts[2]; e.preventDefault(); data.delete('order'); // approach 1: plain data.set('sku', sku); data.set('quantity', quantity); data.set('price', price); // alternative approach 2: nested // data.set('order', JSON.stringify({ // sku: sku, // quantity: quantity, // price: price // })); fetch(scriptURL, { method: 'POST', body: data }) .then(response => console.log('Success!', response)) .catch(error => console.error('Error!', error.message)) });