php - automatic fill input javascript is called when click popup modal

one text

i'm currently doing , automatic fill input with javascript in popup modal. The problem i'm facing right now is, the javascript is called when I click on popup modal. Do you guys have any idea where comes the problem ? Thank you so much in advance. please help me to give an idea.

this is my automatic fill input javascript.

<script>
    function GetMachine(str) {
        if (str.length == 0) {
            document.getElementById("serialnumber").value = "";
            document.getElementById("machine_code").value = "";
            document.getElementById("machine_name").value = "";
            return;
        } else {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                    var myObj = JSON.parse(this.responseText);
                    
                    document.getElementById("serialnumber").value = myObj[0];
                    document.getElementById("machine_code").value = myObj[1];
                    document.getElementById("machine_name").value = myObj[2];
                }
            };
            xmlhttp.open("GET", "fetchmachine.php?machine_id=" + str, true);
            xmlhttp.send();
        }
    }
</script>

this is the fetchmachine.php

<?php

    // Get the user id
    $machine_id = $_REQUEST['machine_id'];
    // $machine_code = $_REQUEST['machine_code'];

    // Database connection
    $con = mysqli_connect("", "", "", "");

    if ($machine_id !== "") {

        // Get corresponding first name and
        // last name for that user id   
        $query = mysqli_query($con, "SELECT * FROM table WHERE machine_id='$machine_id'");

        $rows = mysqli_fetch_array($query);

        // Get the first name
        $serialnumber = $rows["serialnumber"];
        $machine_code = $rows["machine_code"];
        $machine_name = $rows["machine_name"];


    }

    // Store it in a array
    $result = array("$serialnumber", "$machine_code" , "$machine_name");

    // Send in JSON encoded form
    $myJSON = json_encode($result);
    echo $myJSON;
?>

and lastly this is the console error where when i click the modal popup, it also fetch the javascript.

Sorry. I think I need to edit my question. The fetch javascript is fine. But, when I click on the modal popup, it also captures the fetchmachine which will resulted wrong value on my input.

UPDATED: The GetMachine is called from my select dropdown which is here

<div class="CodeDropdown">
    <label for="sn" class="form-label"> Machine Serial Number </label><br>
    <select id="serialnumbers" onchange="GetMachine(this.value)">
        <option value="<?php echo $row['serialnumber']?>"><?php echo $row['serialnumber']?></option>
        
        <?php include 'dbconnect.php';

        if (isset($_POST['type_id'])) {

            $type_id =$_POST['type_id'];

            $query = ("SELECT * FROM table WHERE type_id ='$type_id'");

            $query_run = mysqli_query($conn, $query);
            while ($rows = mysqli_fetch_array($query_run)) {
        ?>

                <option value="<?php echo $rows['machine_id']; ?>"><?php echo $rows['serialnumber']; ?></option>
        <?php 
            } 
        }
        ?>
    </select>
    <input type="text" id="machine_id" name="machine_id" value="<?php echo $row['machine_id']?>">  
    <input type="text" id="serialnumber" name="serialnumber" value="<?php echo $row['serialnumber']?>">  
    <input type="text" id="CodeMachine" name="machine_code" value="<?php echo $row['machine_code']?>">
</div>

UPDATED:This part supposed to be a modal.

<fieldset class="show" id="tab011">
    <form action="" method="post">
        <div class="tech-details"></div>
    </form>

    <script type='text/javascript'>
        $(document).ready(function() {
            $('.card').click(function() {
                var jobregister_id = $(this).data('id');
                var type_id = $(this).data('type_id');
                // AJAX request
                $.ajax({
                    url: 'ajaxtechnician.php',
                    type: 'post',
                    data: {jobregister_id: jobregister_id,type_id: type_id},
                    success: function(response) {
                        // Add response in Modal body
                        $('.tech-details').html(response);
                        // Display Modal
                        $('#myModal').modal('show');
                    }
                });
            });
        });
    </script>
</fieldset>

And the modal is called from here.

<div class='card' id='notYetStatus' data-id='".$row['jobregister_id']."' data-type_id='".$row['type_id']."' data-toggle='modal' data-target='#myModal'>

Source