Internet Cafe Time Manager

Question

I'm new to web developing and start to take path, recently I'm building a time manager for my brother's internet cafe and choose jquery and javascript to work with. I'm having troubled to provide a unique ID value for the append , the reason that i need to have a unique ID for each tag is i need to edit the values. Could anyone or someone help?

<head>

    <script src="scripts/jquery-3.2.1.min.js"></script>
    <script src="scripts/sys.js"></script>
    <script src="scripts/moment.js"></script>
    <script src="scripts/jquery.playSound.js"></script>

    <style>
        td{
            align:center;
        }
    </style>
</head>

<body>

    <div>

        <table border="1" width="80%" height="10%" align="center">

            <tr>
                <td width="20%" align="center">Client/PC</td>
                <td width="20%" align="center">Start Time</td>
                <td width="20%" align="center">End Time</td>
                <td width="20%" align="center">₱ Amount</td>
                <td width="20%" align="center">Status</td>
            </tr>

        </table>

    </div>
    <div id="here_table"></div>


    <button id="addnew" style="position:relative; margin-top:10px; left:43%;">Add Cafeteria</button>


</body>

here is my java-script

$(document).ready(function (){



        $('#addnew').click(function(){


        var client = prompt('PC/Client number?');



            if (client > 6){

                alert('PC/Client not found');
                return false;

            }

            else if (isNaN(client)){
                alert('Invalid Entry,must be a number');
                return false;
            }



            else if(client === null){
                return false;
            }

            else if (client == 0){
                alert('No entry!')
                return false;
            }




            var tothour = prompt('Hours?');
            var amount = tothour * 10;
            if (tothour ==  3 ){
            tothour = 3 + 1;
            }


            var status = "<select style='padding:2px; margin:4px;'><option></option><option>Paid</option><option>Unpaid</option></select>";
            var starttime = new Date();
            starttime = starttime.toLocaleString('en-US', { hour: 'numeric', minute:'numeric', hour12: true });
            endtime = moment().add('hours', tothour).format('h:mm A')





            var tab = '<table border="1" width="80%" height="10%" align="center">'
            for(i=0; i<1; i++){
                tab += '<tr><td width="20%" align="center">' + client + '</td><td width="20%" align="center">'+ starttime +'</td><td width="20%" align="center">'+ endtime +'</td><td width="20%" align="center">'+ amount + '</td><td align="center">' + status + '</td></tr>';
            }   
            tab +="</table>"

            $('#here_table').append(tab);

            setTimeout(function(){$.playSound('notif.mp3');},3600000*tothour);
            });



});

I assume with the button click you are adding a new row to the table and you want a unique ID for each row? Is that what you mean? — , Aug 31 '17 at 14:58
https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript — VSO, Aug 31 '17 at 14:59
Are you storing these clients in a database somewhere? How are you retrieving them? — , Aug 31 '17 at 15:00
I will not Retrieve them, It must only shows on the page and do its job as a monitoring guide. Furthermore, the situational problem is when a client/customer extended their time, all i want is to have a unique ID on each created table/tr to edit the value of time ended and the amount — Rob Navarro, Aug 31 '17 at 15:37

Internet Cafe Time Manager

0 Answers0