Javascript to pass var onclick select and checkbox

Question

So my page has two columns. The right column displays the results.

Results include all elements. In the right column, I have a few flags. I can fill in the checkboxes depending on the option selected.

I need to click the "Submit" button to get the data in the right column. I do not want AJAX. I want the page to be refreshed using the option in the selected and the results that will be displayed based on this. I can encode part of php. To get the value of the parameter selected in

So my code is:

<select id="theselect" onclick = "afterChange()"> <option value="0"> Select the Department </option> <option value="11"> Department11 </option> <option value="22"> Department22 </option> <option value="33"> Department33 </option> </select> var url = location.href; document.getElementById("mydiv").innerHTML = url; function afterChange(){ var dept = document.getElementById("theselect").value; if (dept && dept!= 0) { var myline = url + "&dept=" + dept; document.getElementById("mynewdiv").innerHTML = myline; window.location= myline; } } <p id='mydiv'> </p> <br /> <p id='mynewdiv'> </p> <?php if(isset($_GET['dept'])) { $cat = $_GET['dept']; echo "You are now searching in $cat"; //code to show content from database for that department ?> 

I know that there is a better way to do this that I do not know about. So far, the code has been working fine for the first time. I can get the results from the database according to the SELECT parameter. But when I change the selection, it gets the whole URL again and adds a new SELECT value to the URL, which confuses PHP.

So, if my site URL is: http: //mysite.php? Dept = 22 After changing SELECT 2nd time, it changes to http: //mysite.php? Dept = 22 & dept = 33

I also have some checkboxes after SELECT.

I want the results to be sorted based on selections and checkboxes.

I know there should be an easy way to do this, but I'm struggling to find it.

Please help me in understanding this concept. Thank you very much.

Answer 1

FROM

  var url = location.href; 

You will always get the current URL. The tool for the second url update will be http://mysite.php?dept=22 now you will add your department again:

 var myline = url + "&dept=" + dept; 

Which produces the error you described. To deal with this problem, you first need to delete the old parameter or you only need one parameter:

 var url = location.origin + location.pathname 

instead of location.href for more info you can read this