If you want to pass the selected rank value in the URL when it changes, you can modify the `updateLevelOptions` function to update the URL with the selected rank. Here's an updated version of the JavaScript code in your HTML file:
```html
<script>
function updateLevelOptions() {
var rankDropdown = document.getElementById("rank");
var levelDropdown = document.getElementById("level");
var selectedRank = rankDropdown.value;
// Clear existing options
levelDropdown.innerHTML = "";
// Update the URL with the selected rank
window.history.pushState(null, null, "?rank=" + selectedRank);
if (selectedRank !== "unranked") {
// Fetch levels from the server based on the selected rank
fetch('get_levels.php?rank=' + selectedRank)
.then(response => response.json())
.then(levels => {
populateDropdown(levelDropdown, levels);
})
.catch(error => console.error('Error fetching levels:', error));
} else {
// If Unranked is selected, show only "Unranked"
var unrankedOptions = ["Unranked"];
populateDropdown(levelDropdown, unrankedOptions);
}
}
function populateDropdown(dropdown, options) {
for (var i = 0; i < options.length; i++) {
var option = document.createElement("option");
option.text = options[i];
option.value = options[i];
dropdown.add(option);
}
}
// Function to retrieve the rank from the URL and pre-select it
function preselectRankFromURL() {
var urlParams = new URLSearchParams(window.location.search);
var rank = urlParams.get('rank');
if (rank) {
var rankDropdown = document.getElementById("rank");
rankDropdown.value = rank;
updateLevelOptions(); // Trigger update based on the pre-selected rank
}
}
// Call the function on page load to handle pre-selection from the URL
document.addEventListener("DOMContentLoaded", preselectRankFromURL);
</script>
```
This modification uses `window.history.pushState` to update the URL with the selected rank without triggering a page reload. Additionally, a new function `preselectRankFromURL` is added to handle pre-selecting the rank from the URL parameters when the page loads. This way, if the URL contains a `rank` parameter, the corresponding rank will be selected, and the levels will be updated accordingly.
Here many types of latest technology news, many useful (tools, software, apps, website, technical problem solution )If you have any query regrading Site, Advertisement and any other issue, please feel free to contact me