[HTML 5] Transforming FormData for the Server (URLSearchParams)

const app = document.getElementById(‘app‘);
app.innerHTML = `
  <h1>JavaScript DOM</h1>
  <form name="order">
    <label>
      Your name
      <input type="text" name="fullname">
    </label>
    <label>
      Which pizza would you like?
      <select name="pizza">
        <option value="pepperoni">Pepperoni</option>
        <option value="meaty">Meaty</option>
        <option value="cheesey">Cheesey</option>
      </select>
    </label>
    <div>
      What size?
      <label>
        Small
        <input type="radio" name="size" value="small" checked>
      </label>
      <label>
        Medium
        <input type="radio" name="size" value="medium">
      </label>
      <label>
        Large
        <input type="radio" name="size" value="large">
      </label>
    </div>
    <label>
      Quantity
      <input type="number" name="quantity" value="1">
    </label>
    <button type="submit">
      Submit
    </button>
  </form>
`;

const form = document.forms.order;

function handleSubmit(event) {
  event.preventDefault();
  const formData = new FormData(event.target);

  // query string
  // Content-Type = application/x-www-form-urlencoded
  // fullname=Todd%20Motto&pizza=pepperoni&size=large&quantity=2
  // const data = [...formData.entries()];
  // const asString = data
  //   .map(x => `${encodeURIComponent(x[0])}=${encodeURIComponent(x[1])}`)
  //   .join(‘&‘);
//. or using URLSearchParams
const asString = new URLSearchParams(formData).toString(); console.log(asString); // json const asJSON = JSON.stringify(Object.fromEntries(formData)); console.log(asJSON); } form.addEventListener(‘submit‘, handleSubmit);

 

[HTML 5] Transforming FormData for the Server (URLSearchParams)

上一篇:mysql partition(mysql range partition,对历史数据建分区)


下一篇:Ext.net 控件设置样式