jQuery redirect form I'm using jQuery to create a (hidden) form that redirects people to another page using JavaScript.

// redirect the user to another url
function redirect(options) {
  // create the form
  $("&lt;form&gt;").attr({
    "hidden": true, "action": options.url, "target": (options.new_tab === true) ? "_blank" : "_self"
  // create the query inputs and append them to the form
  }).append($.map(options.queries || {}, function(name, value) {
    return $("&lt;input&gt;").attr({"name": name, "value": value, "hidden": true})[0];
  // append the form to the body and submit it
  })).appendTo("body").submit();
}


To simplify this question the form looks like this when broken down:

// redirect the user to another url
function redirect(options) {
  // create the form
  var form = $("&lt;form&gt;").attr({
    "hidden": true,
    "action": options.url,
    "target": (options.new_tab === true) ? "_blank" : "_self"
  });

  // create the query inputs and append them to the form
  form.append($.map(options.queries || {}, function(name, value) {
    return $("&lt;input&gt;").attr({
      "name": name,
      "value": value,
      "hidden": true
    })[0];
  }));

  // append the form to the body and submit it
  form.appendTo("body").submit();
}


How can I simplify the second part of this code?

// create the query inputs and append them to the form
form.append($.map(options.queries || {}, function(name, value) {
  return $("&lt;input&gt;").attr({
    "name": name,
    "value": value,
    "hidden": true
  })[0];
}));
You shouldn't need to post (or even have) two versions of the same source code. You should only have one readable version, and use a compressor to create a production version.

And IMO it would be fine to use method chaining in the second (readable) version.



Concerning your question: I think the whole code is fine as it is. I'll list some points that one may differently in the second block, but I don't believe they are really needed:

You could avoid the || {} by validating the options first, or before calling this method, or simply not allow the queries property to be undefined.

You could use an arrow function (if your target systems support it, or by using a ES6 compiler):

form.append($.map(options.queries, (name, value) =&gt; 
  $("&lt;input&gt;").attr({
    "name": name,
    "value": value,
    "hidden": true
  })[0]
));


And you could use the native JavaScript and more light weight Array.map() method:

form.append(Object.keys(options.queries).map((key, index) =&gt; 
  $("&lt;input&gt;").attr({
    "name": key,
    "value": options.queries[key],
    "hidden": true
  })[0]
));




Expanding on the last point: Now-a-days it's worth considering, if you still need jQuery at all. It was once a big help to bridge incompatibilities between browsers, but current browsers almost compatible to each other.

EDIT: Here's a version without jQuery:

function redirect(options) {
    let form = document.createElement("form");
    form.setAttribute("hidden", "");
    form.setAttribute("action", options.url);
    form.setAttribute("target", (options.new_tab === true) ? "_blank" : "_self");

    Object.entries(options.queries || {}).forEach(([name, value]) =&gt; {
        let input = document.createElement("input");
        input.setAttribute("hidden", "");
        input.setAttribute("name", name);
        input.setAttribute("value", value);
        form.appendChild(input);
    });

    document.body.appendChild(form);
    form.submit();
}