你能把刷新和更新js脚本放在同一个函数中吗？

Right now, I have a HTML form which the code is shown below. It has a button in which opens a new tab (URL) and updates the information on the PHP page every time the user changes the information. The PHP page right now is displayed on another device and does include the updated information since i"m using a .txt and pulling it on the same server. The problem right now is the updated information only shows when the page is refreshed on their end, which is not what I want.

My question is right now, my js function fulls and updates the variables. Could I also include a refresh function within it as well?

Goal: The button updates AND REFRESHES THE URL (PHP PAGE) AT THE SAME TIME so the end user doesn't have to refresh it on their end, it refreshes the url on the same server.

I tried using loc into there, but it doesnt seem to be working.

HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <script language="javascript" type="text/javascript">
            function dynamicdropdown(listindex) {
              document.getElementById('senator').className = listindex;
            }
            </script>
            
            <style>
            optgroup {
              display: none;
            }

            select.agriculture 
            optgroup.agriculture,
            select.appropriations 
            optgroup.appropriations
            {
              display: block;
            }
            
            div#header{
            padding: 1px;
            color: yellow;
            padding-left: 9px;
            background-color: #000080;
            }
            
            .category_div{
            padding: 3px;
            }
            
            .sub_category_div{
            padding: 3px;
            }
            
            .microphone{
            padding: 3px;
            }

            .body{
            padding-right: 5px;
            }   
            </style>
    </head>
    
<body>

    <div class="header" id="header">
    <h1>Indiana State Senate IT</h1>
    </div>

    <div class="room130">
    <h3>Room 130</h3>
    <form target="Room 130" action = "test.php" method="POST">
        <div class="category_div" id="category_div">Committee:
            <select id="committee" name="committee" onchange="javascript: dynamicdropdown(this.options[this.selectedIndex].value);">
                <option value="">Select Committee</option>
                <option value="agriculture">AGRICULTURE</option>
                <option value="appropriations">APPROPRIATIONS</option>
            </select>
        </div>
        
        <div class="sub_category_div" id="sub_category_div">
        Individual:
            <select name="senator" id="senator">
                <option value="">Select individual</option>
                    <optgroup class="agriculture">
                        <option value="THE CHAIR">THE CHAIR</option>
                        <option value="THE PRESENTER">THE PRESENTER</option>
                    </optgroup>
            </select>
        </div>
        
        <div class="microphone" id="microphone">Microphone:
            <select id="microphone" name = "microphone">
                <option value=" "> </option>
                <option value="ON">ON</option>
                <option value="OFF">OFF</option>
            </select>
        </div>
            <button onclick="refresh()">Refresh</button>
            <button onclick="updateData()">Update</button>
        
        </form>
    </div>

PHP CODE:

<!DOCTYPE html>

<html>
<head>
    <title>Room 130</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript"> 
    $(document).ready( function() {
    $('#java').delay("90000").fadeOut();
        });
        
        function updateData() {
            $.getJSON("sr.iga.local/data.txt", 
                function(data) {
                    var senator = data[0];
                    var microphone = data[1];
                    $("#java").text("Please remind " + senator + " to make sure their microphone is " + microphone + ". Thank you.");}
                function(data){
                window.location.reload(true); });
        }
</script>
<style>
    body {
            background-color: #000080;
            color: white;
            font-size: 72px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 100%;
            font-weight: bold;
    }
    
    .java {
        width: 90%;
        margin: 200px;
        padding-top: 100px;
        text-align: center;
    }
</style>
</head>
<body>

<div class="java" id="java">

    <?php 
    session_start();
    
    if(isset($_POST["senator"]) && isset($_POST["microphone"])) { // If the page receives POST data, it needs to be stored
    $senator = $_POST["senator"];
    $microphone = $_POST["microphone"];
    $data = json_encode(Array($senator, $microphone)); // Put values into an array and encode it for storage
    file_put_contents('data.txt', $data); // Put the JSON-encoded array into a text file. This function replaces the contents of the text file, which is exactly what is needed in this application. To append instead of replacing the contents, you need a FILE_APPEND flag.
    } else { // If there's no POST data, the values are retrieved from the storage
    $data = json_decode(file_get_contents('data.txt')); // Retrieve the contents of the text file and decode them back into an array
    $senator = $data[0];
    $microphone = $data[1];
    }
    echo "Please remind ". $senator. " to make sure their microphone is " .$microphone. ". Thank you.";
    
    
    ?>
</div>
</body>
</html>

</div>

If you do a regular POST the page will update automatically. I don't see what's the problem here.