Clear text input after hitting submit button

Community Help
1

Hi I am just looking to clear the text I enter after I hit the submit button so that my list of suggestions comes back after every time I hit the submit button.

viewof state = Inputs.text({
  label: "U.S. state",
  placeholder: "Enter state name",
  datalist: capitals.map(d => d.State),
  submit: true
})
2

Add an event handler to clear the input inside the form. Clearing the value this way won’t dispatch an “input” event, so it won’t cause dependent cells to update.

viewof state = {
  const form = Inputs.text({
    label: "U.S. state",
    placeholder: "Enter state name",
    datalist: capitals.map(d => d.State),
    submit: true
  });
  form.addEventListener("input", () => {form.text.value = ""});
  return form;
}

Alternatively you can add

  type: "search",

which should add an “x” to the input in most browsers to clear the field more easily.

I would also recommend to add

  autocomplete: "off",

so that prior submissions (often from other fields) don’t get suggested as well.

1 Like
3

I have also this issue but i tried this. It’s working.

4

Thank you! This is perfect!