buildProperties

buildProperties takes a FormData object and extracts any line item properties into a plain object.

Shopify line item property inputs are named like properties[Engraving]. This function:

• keeps only entries whose key includes properties[,
• drops any entries with an empty value,
• strips the properties[...] wrapper from each key,

leaving you with a clean { key: value } object ready to send to the cart AJAX API.

Usage examples

From a product form

2.0 Build

const formData = new FormData(this.els.form.element)

const properties = window.BAO.utils.buildProperties(formData)
// Given inputs named properties[Engraving] and properties[Gift wrap]:
// { Engraving: 'Happy Birthday', 'Gift wrap': 'Yes' }

1.0 Build

const formData = new FormData(this.els.form)

const properties = buildProperties(formData)
// Given inputs named properties[Engraving] and properties[Gift wrap]:
// { Engraving: 'Happy Birthday', 'Gift wrap': 'Yes' }

Adding to cart with properties

2.0 Build

const formData = new FormData(this.els.form.element)

window.BAO.utils.fetchJSON('/cart/add.js', {
  body: JSON.stringify({
    id: variantId,
    quantity: 1,
    properties: window.BAO.utils.buildProperties(formData),
  }),
})

1.0 Build

const formData = new FormData(this.els.form)

fetchJSON('/cart/add.js', {
  body: JSON.stringify({
    id: variantId,
    quantity: 1,
    properties: buildProperties(formData),
  }),
})