12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- <html>
- <head>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
- <style>
- table {
- font-family: arial, sans-serif;
- border-collapse: collapse;
- width: 100%;
- }
- td, th {
- border: 1px solid #dddddd;
- text-align: left;
- padding: 8px;
- }
- tr:nth-child(even) {
- background-color: #dddddd;
- }
- button:hover { background-color: blue; }
- button:focus { background-color: blue; }
- </style>
- </head>
- <body>
- <h2>Report Problems</h2>
- <div id="cont"></div>
- <div id="actions"></div>
- <form method="GET" action="../services/return_cpee.php">
- <input type="text" name="id" id="cbid" required>
- <input type="text" name="workerID" id="workerID" required>
- <br><input type="text" name="action" id="action" required></br>
- <p>New Article ID: <input type="text" name="newAID" id="newAID"></p>
- <p>Quantity: <input type="text" name="quantity" id="quantity"></p>
- <select id="selectNumber" onchange="singleSelectChangeText()"><option>Choose tool part</option></select>
- <input type="text" id="dropdown" name="toolPart" hidden>
- <br><textarea rows="4" cols="50" name="comment" id="comment"></textarea></br>
- <input type="submit" value="Report" onclick="reloaded(rolle);">
- </form>
- <script type="text/javascript" src="form.js"></script>
- <script type="text/javascript">
- var doc = "";
- $.ajax({
- url: '../callbacks/'+ cbid + '.txt',
- async: false,
- success: function (data){
- doc = data;
- }
- });
- doc = JSON.parse(doc);
- var params = doc[1];
- var rolle = params['rolle'];
- var actions = params['actions'];
- console.log(params);
- actions = JSON.parse(actions);
- var toolPart = actions['toolPart'];
- toolPart = JSON.parse(toolPart);
- var actionList = actions['actionList'];
- actionList = JSON.parse(actionList);
- console.log(actionList);
- var mytable = "<table cellpadding=\"0\" cellspacing=\"0\">";
- mytable += "<thead><tr><th>Parameter</th><th>Value</th></tr></thead><tbody><tr>";
- Object.keys(params).forEach(val => {
- if (val != "form" && val != "rolle" && val !="actions"){
- mytable += "<td>" + val + "</td>";
- mytable += "<td>" + params[val] + "</td></tr><tr>";}
- });
- mytable += "</tr></tbody></table>";
- var elem = document.getElementById("cont");
- elem.insertAdjacentHTML( 'beforeend', mytable );
- function singleSelectChangeText() {
- var selObj = document.getElementById("selectNumber");
- var selValue = selObj.options[selObj.selectedIndex].text;
- document.getElementById("dropdown").value = selValue;
- }
- var select = document.getElementById("selectNumber");
- for(var i = 0; i < toolPart.length; i++) {
- var opt = toolPart[i];
- var el = document.createElement("option");
- el.textContent = opt;
- el.value = opt;
- select.appendChild(el);
- }
- var myActions = "";
- for(var b = 0; b < actionList.length; b++) {
- myActions += "<button id=\""+actionList[b]+"\" onClick=\"do_after(this.id)\">"+actionList[b]+"</button>";
- }
- var act = document.getElementById("actions");
- act.insertAdjacentHTML( 'beforeend', myActions );
- function do_after(id){
- document.getElementById("action").value = id;
- }
- </script>
- </body>
- </html>
|