javascript create url from form elements handling checkboxes

Question

So I had been using this generic code to create a URL from the form elements

function submiturl() {
    url="Search.do?call=JS"; 
    var elem = document.getElementById('searchInput').elements;
    for(var i = 0; i < elem.length; i++) {
        url = url + "&" + escape(elem[i].name) + "=" + escape(elem[i].value);
    }
    url = url.substring(0,(url.length-1));
   alert(url);
}

however it does not handle checkboxes properly - I only want to add to the URL if the checkboxes are checked. So if you had this html

<html>
<body>
<form name="searchInput" id ="searchInput">
    <input name="first" type="checkbox" value="123"/>One two three
    <input name="second" type="checkbox" value="456"/>Four five six
    <button type="button" onClick="submiturl();">Submit</button>
</form>
</body>
</html>

it will create the URL using the value for both checkboxes regardless if they were checked or not.

So how can I modify my javascript to check if it is a checkbox and is checked?

thanks!

Have you tried using if (elem[i].checked)

Praveen
– Praveen

2012-05-21 14:54:50 +00:00
Commented May 21, 2012 at 14:54 — Praveen
– Praveen, Commented May 21, 2012 at 14:54

Travesty3 · Accepted Answer · 2012-05-21 14:54:59Z

1

Inside your for-loop do this:

if (elem[i].type != "checkbox" || elem[i].checked)
    url = url + ...

answered May 21, 2012 at 14:54

Travesty3

14.5k7 gold badges64 silver badges103 bronze badges

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

Comments

Roland Bouman · Accepted Answer · 2012-05-21 14:57:31Z

0

function submiturl() {
    var url="Search.do?call=JS", 
        els = document.getElementById("searchInput").elements
    ;
    for(var el, i = 0, n = els.length; i < n; i++) {
        el = els[i];
        if (el.checked || el.type !== "checkbox") {
            url += "&" + encodeURIComponent(el.name) + 
                   "=" + encodeURIComponent(el.value)
            ;
        }
    }
    alert(url);
}

answered May 21, 2012 at 14:57

Roland Bouman

32.1k8 gold badges69 silver badges69 bronze badges

Comments

Imp · Accepted Answer · 2012-05-21 14:55:41Z

0

Is it a checkbox?

typeof elem[i].attributes['type'] != 'undefined' &&
elem[i].attributes['type'].value == 'checkbox'

Is it checked?

typeof elem[i].attributes['checked'] != 'undefined' &&
elem[i].attributes['checked'].value == 'checked'

answered May 21, 2012 at 14:55

Imp

8,6091 gold badge28 silver badges36 bronze badges

Collectives™ on Stack Overflow

javascript create url from form elements handling checkboxes

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related