Passing Datas into Columns from JS to HTML

Passing Datas into Columns from JS to HTML

noSkill06snoSkill06s Posts: 2Questions: 2Answers: 0

I connect via PHP (cURL) to my api to get the datas which i convert to a json and send it to my JS script where i get it via Ajax and transfer to a function where i sort my variables and declare it now i need to put my variables into my data tables columns but seriously after reading myself through the documentation i dont get it how to do this, i tried many things which are also working but it refreshes everytime the whole page i need a data refreshing without refreshing the whole page i post my code hope someone could help me

MY JS FILE
function updateLiveGateWayAll_SQL_UPDATE(){
$.ajax({
url: 'gateWay_LIVE_UPDATE.php',
success: (data) => {
updateLiveGateWayAll_SQL_UPDATE_UNDER(data);
}
})
}

        function updateLiveGateWayAll_SQL_UPDATE_UNDER(data){
           var obj = JSON.parse(data);

           var GATEWAY1_QUE = obj[0].QUE;
           var GATEWAY1_FAILED = obj[0].FAILED;
           var GATEWAY1_TOTAL = obj[0].TOTAL;
           var GATEWAY1_STATE = obj[0].STATE;

            var GATEWAY2_QUE = obj[1].QUE;
            var GATEWAY2_FAILED = obj[1].FAILED;
            var GATEWAY2_TOTAL = obj[1].TOTAL;
            var GATEWAY2_STATE = obj[1].STATE;

            var GATEWAY3_QUE = obj[2].QUE;
            var GATEWAY3_FAILED = obj[2].FAILED;
            var GATEWAY3_TOTAL = obj[2].TOTAL;
            var GATEWAY3_STATE = obj[2].STATE;

            var GATEWAY4_QUE = obj[3].QUE;
            var GATEWAY4_FAILED = obj[3].FAILED;
            var GATEWAY4_TOTAL = obj[3].TOTAL;
            var GATEWAY4_STATE = obj[3].STATE;
        }

        function updateHistoryGateWayALL_SQL_INSERT(){
            $.ajax({
                url: 'gateWay_HISTORY_INSERT.php',
                success: function (data) {
                    console.log(data);
                }
            });
        }

MY HTML FILE

                <script>
                    $(document).ready( function () {
                        $('#table_id').DataTable();
                        liveTimelineGateWayAll()
                        historyTimelineGateWayAll()
                        updateLiveGateWayAll_SQL_UPDATE()
                        updateHistoryGateWayALL_SQL_INSERT()
                    } );
                </script>
            <body>
            <h1 style="text-align: center">GATEWAY INFO TABLE</h1>
            <table id="table_id" class="display">
                <thead>
                <tr>
                    <th class="getWayUpperPoint">GATEWAY</th>
                    <th>QUE <br>(in Warteschlange)</th>
                    <th>FAILED <br>(versenden Fehlgeschlagen Gesamt)</th>
                    <th>TOTAL <br>(versendet Gesamt)</th>
                    <th>STATE <br>(Status)</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td class="gateWayUnderPoint">GATEWAY1</td>
                    <td id="GTW_195_QUE"></td>
                    <td id="GTW_195_FAILED"></td>
                    <td id="GTW_195_TOTAL"></td>
                    <td id="GTW_195_STATE"></td>
                </tr>
                <tr>
                    <td class="gateWayUnderPoint">GATEWAY2</td>
                    <td id="GTW_196_QUE"></td>
                    <td id="GTW_196_FAILED"></td>
                    <td id="GTW_196_TOTAL"></td>
                    <td id="GTW_196_STATE"></td>
                </tr>
                <tr>
                    <td class="gateWayUnderPoint">GATEWAY3</td>
                    <td id="GTW_197_QUE"></td>
                    <td id="GTW_197_FAILED"></td>
                    <td id="GTW_197_TOTAL"></td>
                    <td id="GTW_197_STATE"></td>
                </tr>
                <tr>
                    <td class="gateWayUnderPoint">GATEWAY4</td>
                    <td id="GTW_198_QUE"></td>
                    <td id="GTW_198_FAILED"></td>
                    <td id="GTW_198_TOTAL"></td>
                    <td id="GTW_198_STATE"></td>
                </tr>
            </table>

Answers

  • colincolin Posts: 15,142Questions: 1Answers: 2,586

    Hi @noSkill06s ,

    I don't quite follow, as you've got data in the HTML table, and you're sending it through Ajax as well - I'd expect one or the other.

    This example here might help, since it's showing how to send Ajax.

    Cheers,

    Colin

This discussion has been closed.