如何将输入复选框中的值传递给 jquery 中的 URL 参数

Question

I am trying to update the url Parameters based on the input selected of the form.

<form method="get" action="current.php" id="header-form">

<input type="hidden" name="location" value="location">
<input type="checkbox" name="type[]" class="type" value="opt1"> option1
<input type="checkbox" name="type[]" class="type" value="opt2"> option2

<input type="checkbox" name="type2[]" class="type1" value="new1"> new1
<input type="checkbox" name="type2[]" class="type1" value="new2"> new2

</form>

Jquery

By selecting the checkbox i want to append the values to the URL

My Jquery

<script type="text/javascript">
        $(document).ready(function() {
            $(".type").change(function() {
                $("#header-form").trigger("submit");
            });
             $(".type1").change(function() {
                $("#header-form").trigger("submit");
            });
        });
        
    </script>

If i select option1 it works fine and if i try to select the option 2, it removes the option 1 from the URL.

If i select the option 1 & option 2

URL Should be -> http://localhost.current.php?type=option1&option2

And if i select all the values option1 & option 2 and new 1 & new 2

URL Should be -> http://localhost.current.php?type=option1&option2?type1=new1&new2

And if i select the values option1 & new 1 & new 2

URL Should be -> http://localhost.current.php?type=option1?type1=new1&new2

Answer 1

You must keep the previous submit data.
do this with PHP:

<form method="get" action="current.php" id="header-form">

    <input type="hidden" name="location" value="location">
    <input type="checkbox" name="type[]" <?php if(isset($_GET['type'][0])): ?>checked<?php endif; ?> class="type" value="opt1"> option1
    <input type="checkbox" name="type[]" <?php if(isset($_GET['type'][1])): ?>checked<?php endif; ?> class="type" value="opt2"> option2

    <input type="checkbox" name="type2[]" <?php if(isset($_GET['type2'][0])): ?>checked<?php endif; ?> class="type1" value="new1"> new1
    <input type="checkbox" name="type2[]" <?php if(isset($_GET['type2'][1])): ?>checked<?php endif; ?> class="type1" value="new2"> new2

</form>