Setting inputs as values from a string of GET request parameters with JS?

Question

We want to set various inputs to the values contained in a str inputValueStr obtained like so:

  const form = document.querySelector('#theForm');
  var object = Object.values(form).reduce((obj, field) => { obj[field.name] = field.value; return obj }, {});
  delete object[""];
  const inputValuesStr =  new URLSearchParams(object).toString()

The string looks like "foo=&bar=123&baz=examplestr&whatever=". What's a good way to set the #theForm's inputs to the values from the string (ie. make inputs of bar = 123, baz = "examplestr", and other inputs null)?

We're unsure if we're missing something as we don't know what to search for so apologies if this is a stupid question. If so please feel free to redirect us to another thread.

SyncroIT · Accepted Answer · 2023-03-20 09:04:02Z

1

First you have to get all the variables in the URL:

const urlParams = new URLSearchParams(window.location.search);

Then, you can iterate over every parameter and set the form's input to its value:

urlParams.forEach((val, key) => {
   const inputEl = document.querySelector('#theForm [name="'+key+'"]');
   if(inputEl) 
       inputEl.value = val;
});

edited Mar 20, 2023 at 9:04

answered Mar 20, 2023 at 8:58

SyncroIT

1,5781 gold badge15 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Setting inputs as values from a string of GET request parameters with JS?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related