<?php
include "classes/html.class.php";
$html = new html("PRE INSPECTION LISTS");
$db = new db();
$ainspection_res = $db->exec_query('pre_inspection_content', ["*"]);
$list = '<option></option>';
while ($ainspection = $ainspection_res->fetch_assoc()) {
    $list = $list . "<option value='{$ainspection['record_id']}'>{$ainspection['name']}</option>";
}


?>
<div class='form' style='width:70%'>
    <!-- <input type='submit' value='ADD' class='form_btn' onclick='add_row()' /> -->

    <form action='save_pre_inspection_list.php' method="POST">
        <h2 style="font-size:2vw">SELECT LIST NAME</h2><br><br>
        <select class='form_input' id='list_id' name='list_id' onchange="call_ajax_func()">
            <<? echo $list; ?> </select>
                <input type='text' name='edit' hidden />
                <hr><br>
                <input type='text' placeholder="INSPECTION NAME" name='name' id='name' class='form_input' /><br><br>
                
                    <table width='100%' style='text-align:center;'>
                        <tr>
                            <td style="font-size:1.5vw">
                                QUESTION:
                            </td >
                            <td style="font-size:1.5vw"> 
                                ANSWER TYPE:
                            </td>
                            <td style="font-size:1.5vw">
                                WARNING TYPE:
                            </td>
                        </tr>

                    </table>
                
                <br>
                
                    <table width='100%' style='text-align:center;' id='myTable'>
                    </table>
                
                <br>
                <div class="center_screen">
                    <button type="button" onclick='add_row()' class='form_btn'>ADD ROW</button>
                    <input type='text' name='index' id='index' value='0' hidden />
                    <input type='submit' value='SAVE' class='form_btn' onclick='ajax_func()' />
                </div>
    </form>
</div>
<br>
<br>

<script>
    // add_row();

    function add_row() {
        get_index = document.getElementById("index").value;
        var table = document.getElementById("myTable");
        var row = table.insertRow();
        var cell1 = row.insertCell();
        var cell2 = row.insertCell();
        var cell3 = row.insertCell();
        cell1.innerHTML = "<input type='text' placeholder='Question?' id='q_" + get_index + "' name='q_" + get_index + "' class='form_input'>";
        cell2.innerHTML = "<select class='form_input' id='a_" + get_index + "' name='a_" + get_index + "'> <option> </option> <option value = 'B' > YES / NO </option> <option value='T'> TEXT </option> </select>";
        cell3.innerHTML = "<select class='form_input'id='w_" + get_index + "' name='w_" + get_index + "'><option value='0'>No Warning</option><option value='Y'>Warning on YES</option><option value='N'>Warning on NO</option><option value='T'>Warning on TEXT</option></select>";

        document.getElementById('index').value = parseInt(get_index) + 1;


    }


    function call_ajax_func() {
        // alert("Test");
        list_id = document.getElementById('list_id').value;

        // Create an XMLHttpRequest object
        const xhttp = new XMLHttpRequest();
        // Define a callback function
        xhttp.onload = function() {
            // Here you can use the Data
            if (this.responseText != 1) {
                // alert(this.responseText);
                values = this.responseText.split('|');
                document.getElementById('name').value = values[0];

                questions = values[1].split(',');
                // alert(questions.length);
                answers = values[2].split(',');
                warnings = values[3].split(',');
                index = 0;
                var tableHeaderRowCount = 0;
                var table = document.getElementById('myTable');
                var rowCount = table.rows.length;
                for (var i = tableHeaderRowCount; i < rowCount; i++) {
                    table.deleteRow(tableHeaderRowCount);
                    document.getElementById("index").value = 0;

                }

                while (index < questions.length) {
                    add_row();
                    document.getElementById('q_' + index).value = questions[index];
                    document.getElementById('a_' + index).value = answers[index];
                    document.getElementById('w_' + index).value = warnings[index];
                    index = parseInt(index) + 1;
                }






            } else {
                // window.location.href = "users.php";
                alert("Something Went Wrong");

            }
        }

        xhttp.open("GET", "ajax/get_list_content.ajax.php?list_id=" + list_id);
        xhttp.send();

    }
</script>


</body>

</html>