jQuery: Pass URL parameters to different page

Question

I currently have a working function to pass the information from check boxes to the URL as below:

jQuery

$('input[type="checkbox"]').on('change', function(e){
    var data = $('input[type="checkbox"]').serialize(),
        loc = $('<a>', {href:window.location})[0];
    $.post('/ajax-post-url/', data);
    if(history.pushState){
        history.pushState(null, null, loc.pathname+'?'+data);
    }
});

HTML

<div class="panel-body">
            <div class="rowElem">
              <input type="checkbox" name="chbox" id="" value="red">
              <label>Color #1</label>
            </div>
            <div class="rowElem">
              <input type="checkbox" name="chbox" id="" value="green">
              <label>Color #2</label>
            </div>
            <div class="rowElem">
              <input type="checkbox" name="chbox" id="" value="blue">
              <label>Color #3</label>
            </div>
            <a href="pagetwo" class="linkBtn">Go to page two</a>
</div>

Result:

http://www.someurl.com/pageone?chbox=red&chbox=green&chbox=blue

My question is when I click on ".linkBtn" how can I pass the information after "?" in the URL to "pagetwo" (or any page) so the result would be:

http://www.someurl.com/pagetwo?chbox=red&chbox=green&chbox=blue

I'm planning on using the information in the URL to add classes on elements on the next page.

Thanks

Why people always try and use JS for something a simple HTML form submitted the regular way could achieve without any extra efforts, is and probably always will be beyond me ... — CBroe, Aug 10 '16 at 22:30
See how you're pushing the URL into history? Just use `window.location.href = 'pagetwo?'+data`. See http://stackoverflow.com/q/503093/215552 — Heretic Monkey, Aug 10 '16 at 22:31
`loc = $('', {href:window.location})[0]` - overly complicated; you have access to the path of the current URL via `window.location.pathname` already, there is absolutely no need to create a link first. — CBroe, Aug 10 '16 at 22:35
There is no "simple HTML way" to do what I am trying to achieve inside the CMS system I am using, I also only know the basics of jQuery, the code above is what I have found and implemented which gave me the desired output, I'm open to suggestions or other ways to output the checkbox results into the URL, I just need to transfer the info between pages. — webmonkey237, Aug 10 '16 at 22:54

score 0 · Accepted Answer · answered Aug 11 '16 at 00:08

0

Found my answers here: http://www.aspsnippets.com/Articles/Send-Pass-Data-Values-from-one-page-to-another-using-jQuery.aspx Also has an example of using a cookie rather than passing information through the URL

answered Aug 11 '16 at 00:08

webmonkey237

355
1
3
19

jQuery: Pass URL parameters to different page

1 Answers1