Fixed indents and added met viewport to header
This commit is contained in:
parent
020b5b0ccf
commit
a71d702c21
|
|
@ -2,49 +2,50 @@
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="d-flex flex-column">
|
<body class="d-flex flex-column">
|
||||||
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-2">
|
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-2">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<a class="navbar-brand" href="/">Request Mirror</a>
|
<a class="navbar-brand" href="/">Request Mirror</a>
|
||||||
<button
|
<button
|
||||||
class="navbar-toggler"
|
class="navbar-toggler"
|
||||||
type="button"
|
type="button"
|
||||||
data-bs-toggle="collapse"
|
data-bs-toggle="collapse"
|
||||||
data-bs-target="#navbarSupportedContent"
|
data-bs-target="#navbarSupportedContent"
|
||||||
aria-controls="navbarSupportedContent"
|
aria-controls="navbarSupportedContent"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-label="Toggle navigation"
|
aria-label="Toggle navigation"
|
||||||
>
|
>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/test">Test Page</a>
|
<a class="nav-link" href="/test">Test Page</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/history">History</a>
|
<a class="nav-link" href="/history">History</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div id="body" class="p-5">
|
|
||||||
<h1>Error Page</h1>
|
|
||||||
<p>{{error_msg}}</p>
|
|
||||||
</div>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
<div id="body" class="p-5">
|
||||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
<h1>Error Page</h1>
|
||||||
crossorigin="anonymous"></script>
|
<p>{{error_msg}}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -2,82 +2,84 @@
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="d-flex flex-column">
|
<body class="d-flex flex-column">
|
||||||
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<a class="navbar-brand" href="/">Request Mirror</a>
|
<a class="navbar-brand" href="/">Request Mirror</a>
|
||||||
<button
|
<button
|
||||||
class="navbar-toggler"
|
class="navbar-toggler"
|
||||||
type="button"
|
type="button"
|
||||||
data-bs-toggle="collapse"
|
data-bs-toggle="collapse"
|
||||||
data-bs-target="#navbarSupportedContent"
|
data-bs-target="#navbarSupportedContent"
|
||||||
aria-controls="navbarSupportedContent"
|
aria-controls="navbarSupportedContent"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-label="Toggle navigation"
|
aria-label="Toggle navigation"
|
||||||
>
|
>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/test">Test Page</a>
|
<a class="nav-link" href="/test">Test Page</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/history">History</a>
|
<a class="nav-link" href="/history">History</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div id="body" class="p-5">
|
|
||||||
<div class="tab-pane fade show active" id="header" role="tabpanel" aria-labelledby="header-tab">
|
|
||||||
<h1>Request History</h1>
|
|
||||||
<table class="table table-striped">
|
|
||||||
<tr>
|
|
||||||
<th>History ID</th>
|
|
||||||
<th>Client ID</th>
|
|
||||||
<th>Request Type</th>
|
|
||||||
<th>TimeStamp</th>
|
|
||||||
</tr>
|
|
||||||
{{#each history_records}}
|
|
||||||
<tr>
|
|
||||||
<td><a href="/history/{{id}}">{{id}}</a></td>
|
|
||||||
<td>{{client_id}}</td>
|
|
||||||
<td>{{request_type}}</td>
|
|
||||||
<td>{{timestamp}}</td>
|
|
||||||
</tr>
|
|
||||||
{{/each}}
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<div id="body" class="p-5">
|
||||||
let records = [
|
<div class="tab-pane fade show active" id="header" role="tabpanel" aria-labelledby="header-tab">
|
||||||
{{#each history_records}}
|
<h1>Request History</h1>
|
||||||
{
|
<table class="table table-striped">
|
||||||
id: {{id}},
|
<tr>
|
||||||
client_id:"{{client_id}}",
|
<th>History ID</th>
|
||||||
request_type: "{{request_type}}",
|
<th>Client ID</th>
|
||||||
timestamp:"{{timestamp}}"
|
<th>Request Type</th>
|
||||||
},
|
<th>TimeStamp</th>
|
||||||
{{/each}}
|
</tr>
|
||||||
];
|
{{#each history_records}}
|
||||||
|
<tr>
|
||||||
|
<td><a href="/history/{{id}}">{{id}}</a></td>
|
||||||
|
<td>{{client_id}}</td>
|
||||||
|
<td>{{request_type}}</td>
|
||||||
|
<td>{{timestamp}}</td>
|
||||||
|
</tr>
|
||||||
|
{{/each}}
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
function popupRecord(event, id) {
|
<script type="text/javascript">
|
||||||
console.log(records.filter(v=>v.id == id));
|
let records = [
|
||||||
}
|
{{#each history_records}}
|
||||||
</script>
|
{
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
id: {{id}},
|
||||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
client_id: "{{client_id}}",
|
||||||
crossorigin="anonymous"></script>
|
request_type: "{{request_type}}",
|
||||||
|
timestamp: "{{timestamp}}"
|
||||||
|
},
|
||||||
|
{{/each}}
|
||||||
|
];
|
||||||
|
|
||||||
|
function popupRecord(event, id) {
|
||||||
|
console.log(records.filter(v => v.id == id));
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -2,125 +2,125 @@
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<a class="navbar-brand" href="/">Request Mirror</a>
|
<a class="navbar-brand" href="/">Request Mirror</a>
|
||||||
<button
|
<button
|
||||||
class="navbar-toggler"
|
class="navbar-toggler"
|
||||||
type="button"
|
type="button"
|
||||||
data-bs-toggle="collapse"
|
data-bs-toggle="collapse"
|
||||||
data-bs-target="#navbarSupportedContent"
|
data-bs-target="#navbarSupportedContent"
|
||||||
aria-controls="navbarSupportedContent"
|
aria-controls="navbarSupportedContent"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-label="Toggle navigation"
|
aria-label="Toggle navigation"
|
||||||
>
|
>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/test">Test Page</a>
|
<a class="nav-link" href="/test">Test Page</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/history">History</a>
|
<a class="nav-link" href="/history">History</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div id="body" class="p-5">
|
<div id="body" class="p-5">
|
||||||
<h1>Test Form</h1>
|
<h1>Test Form</h1>
|
||||||
<div class="form-check form-switch">
|
<div class="form-check form-switch">
|
||||||
<input onchange="onRequestMethod(event)" class="form-check-input" type="checkbox" role="switch"
|
<input onchange="onRequestMethod(event)" class="form-check-input" type="checkbox" role="switch"
|
||||||
id="requestMethodSwitch">
|
id="requestMethodSwitch">
|
||||||
<label class="form-check-label" for="requestMethodSwitch" id="requestMethodLabel">Post Request</label>
|
<label class="form-check-label" for="requestMethodSwitch" id="requestMethodLabel">Post Request</label>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="function-header">
|
|
||||||
<button class="btn btn-secondary" type="button" onclick="addField()">Add Field</button>
|
|
||||||
<button class="btn btn-secondary" type="button" onclick="saveFields()">Save Form</button>
|
|
||||||
<button class="btn btn-secondary" type="button" onclick="loadFields()">Load Form</button>
|
|
||||||
<button class="btn btn-secondary" type="button" onclick="resetForm()">Reset Form</button>
|
|
||||||
</div>
|
|
||||||
<form id="submission-form" method="post" action="/test" onsubmit="saveForm()">
|
|
||||||
<table class="m-2" style="width: 100rem;">
|
|
||||||
<tbody id="field-groups">
|
|
||||||
<tr id="table-header">
|
|
||||||
<th>Value</th>
|
|
||||||
<th>Name</th>
|
|
||||||
<th>Type</th>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<input class="btn btn-primary" type="submit" value="Submit"/>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<div id="function-header">
|
||||||
let fieldCount = 0;
|
<button class="btn btn-secondary" type="button" onclick="addField()">Add Field</button>
|
||||||
|
<button class="btn btn-secondary" type="button" onclick="saveFields()">Save Form</button>
|
||||||
|
<button class="btn btn-secondary" type="button" onclick="loadFields()">Load Form</button>
|
||||||
|
<button class="btn btn-secondary" type="button" onclick="resetForm()">Reset Form</button>
|
||||||
|
</div>
|
||||||
|
<form id="submission-form" method="post" action="/test" onsubmit="saveForm()">
|
||||||
|
<table class="m-2" style="width: 100rem;">
|
||||||
|
<tbody id="field-groups">
|
||||||
|
<tr id="table-header">
|
||||||
|
<th>Value</th>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>Type</th>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<input class="btn btn-primary" type="submit" value="Submit" />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
let fieldInfo = {
|
<script type="text/javascript">
|
||||||
|
let fieldCount = 0;
|
||||||
|
|
||||||
|
let fieldInfo = {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function saveFields() {
|
||||||
|
localStorage.setItem('mirror-save', JSON.stringify(fieldInfo));
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadFields() {
|
||||||
|
let fieldstr = localStorage.getItem('mirror-save');
|
||||||
|
if (fieldstr) {
|
||||||
|
|
||||||
|
resetForm(false);
|
||||||
|
|
||||||
|
fieldInfo = JSON.parse(fieldstr);
|
||||||
|
|
||||||
|
|
||||||
|
for (let field in fieldInfo) {
|
||||||
|
console.log(field);
|
||||||
|
addField(fieldInfo[field]);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function saveFields() {
|
}
|
||||||
localStorage.setItem('mirror-save', JSON.stringify(fieldInfo));
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadFields() {
|
function resetForm(resetStorage = true) {
|
||||||
let fieldstr = localStorage.getItem('mirror-save');
|
|
||||||
if (fieldstr) {
|
|
||||||
|
|
||||||
resetForm(false);
|
if (resetStorage) {
|
||||||
|
localStorage.removeItem('mirror-save');
|
||||||
|
}
|
||||||
|
|
||||||
fieldInfo = JSON.parse(fieldstr);
|
fieldInfo = {};
|
||||||
|
|
||||||
|
for (let i = 0; i < fieldCount; i++) {
|
||||||
|
document.getElementById(`row-${i}`).remove();;
|
||||||
|
}
|
||||||
|
|
||||||
for (let field in fieldInfo) {
|
fieldCount = 0;
|
||||||
console.log(field);
|
}
|
||||||
addField(fieldInfo[field]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
function addField(field) {
|
||||||
|
console.log(field);
|
||||||
|
let newInput = document.createElement('tr');
|
||||||
|
|
||||||
function resetForm(resetStorage=true) {
|
newInput.id = `row-${fieldCount}`;
|
||||||
|
|
||||||
if (resetStorage) {
|
|
||||||
localStorage.removeItem('mirror-save');
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldInfo = {};
|
|
||||||
|
|
||||||
for (let i = 0; i < fieldCount; i++) {
|
newInput.innerHTML = `
|
||||||
document.getElementById(`row-${i}`).remove();;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldCount = 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
function addField(field) {
|
|
||||||
console.log(field);
|
|
||||||
let newInput = document.createElement('tr');
|
|
||||||
|
|
||||||
newInput.id = `row-${fieldCount}`;
|
|
||||||
|
|
||||||
newInput.innerHTML = `
|
|
||||||
<td>
|
<td>
|
||||||
<input class="form-control" id='${fieldCount}-input' type='text' name='${fieldCount}' onchange="onValueChange('${fieldCount}', event)" value='${field?field.value:""}'/>
|
<input class="form-control" id='${fieldCount}-input' type='text' name='${fieldCount}' onchange="onValueChange('${fieldCount}', event)" value='${field ? field.value : ""}'/>
|
||||||
</td>
|
</td>
|
||||||
<td >
|
<td >
|
||||||
<input class="form-control" id="${fieldCount}-name" type='text' onchange="onNameChange('${fieldCount}', event);" value='${field?field.name:fieldCount}'>
|
<input class="form-control" id="${fieldCount}-name" type='text' onchange="onNameChange('${fieldCount}', event);" value='${field ? field.name : fieldCount}'>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<select class="form-select col-auto" id="${fieldCount}-type" onchange='onInputTypeSelect("${fieldCount}", event)' aria-label="Field Type">
|
<select class="form-select col-auto" id="${fieldCount}-type" onchange='onInputTypeSelect("${fieldCount}", event)' aria-label="Field Type">
|
||||||
|
|
@ -142,56 +142,56 @@
|
||||||
<button type="button" class='btn btn-danger' onclick="delField(${fieldCount})">-</button>
|
<button type="button" class='btn btn-danger' onclick="delField(${fieldCount})">-</button>
|
||||||
</td>`;
|
</td>`;
|
||||||
|
|
||||||
for (let element in document.getElementById(`${fieldCount}-type`)) {
|
for (let element in document.getElementById(`${fieldCount}-type`)) {
|
||||||
if(element.value === field.type) {
|
if (element.value === field.type) {
|
||||||
element.selected = true;
|
element.selected = true;
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldInfo[fieldCount.toString()] = {
|
|
||||||
name: fieldCount.toString(),
|
|
||||||
value: "",
|
|
||||||
type: "text"
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById("field-groups").appendChild(newInput);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
fieldCount++;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function delField(id) {
|
fieldInfo[fieldCount.toString()] = {
|
||||||
delete fieldInfo[id];
|
name: fieldCount.toString(),
|
||||||
|
value: "",
|
||||||
|
type: "text"
|
||||||
|
}
|
||||||
|
|
||||||
document.getElementById("field-groups").removeChild(document.getElementById(id))
|
document.getElementById("field-groups").appendChild(newInput);
|
||||||
}
|
|
||||||
|
|
||||||
function onValueChange(id, event) {
|
|
||||||
fieldInfo[id].value = event.target.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
function onNameChange(id, event) {
|
|
||||||
fieldInfo[id].name = event.target.value;
|
|
||||||
document.getElementById(`${id}-input`).name = event.target.value;
|
|
||||||
}
|
|
||||||
function onInputTypeSelect(id, event) {
|
|
||||||
fieldInfo[id].type = event.target.value;
|
|
||||||
document.getElementById(`${id}-input`).type = event.target.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
function onRequestMethod(event) {
|
fieldCount++;
|
||||||
document.getElementById('requestMethodLabel').innerText = event.target.checked ? 'Get Request' : 'Post Request';
|
}
|
||||||
document.getElementById('submission-form').method = event.target.checked ? 'get' : 'post';
|
|
||||||
|
|
||||||
}
|
function delField(id) {
|
||||||
</script>
|
delete fieldInfo[id];
|
||||||
<script type="text/javascript" defer>
|
|
||||||
loadFields();
|
document.getElementById("field-groups").removeChild(document.getElementById(id))
|
||||||
</script>
|
}
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
|
||||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
function onValueChange(id, event) {
|
||||||
crossorigin="anonymous"></script>
|
fieldInfo[id].value = event.target.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function onNameChange(id, event) {
|
||||||
|
fieldInfo[id].name = event.target.value;
|
||||||
|
document.getElementById(`${id}-input`).name = event.target.value;
|
||||||
|
}
|
||||||
|
function onInputTypeSelect(id, event) {
|
||||||
|
fieldInfo[id].type = event.target.value;
|
||||||
|
document.getElementById(`${id}-input`).type = event.target.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function onRequestMethod(event) {
|
||||||
|
document.getElementById('requestMethodLabel').innerText = event.target.checked ? 'Get Request' : 'Post Request';
|
||||||
|
document.getElementById('submission-form').method = event.target.checked ? 'get' : 'post';
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript" defer>
|
||||||
|
loadFields();
|
||||||
|
</script>
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -2,40 +2,41 @@
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="d-flex flex-column">
|
<body class="d-flex flex-column">
|
||||||
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
<nav id="navbar" class="navbar navbar-expand-lg bg-body-tertiary mb-5">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<a class="navbar-brand" href="/">Request Mirror</a>
|
<a class="navbar-brand" href="/">Request Mirror</a>
|
||||||
<button
|
<button
|
||||||
class="navbar-toggler"
|
class="navbar-toggler"
|
||||||
type="button"
|
type="button"
|
||||||
data-bs-toggle="collapse"
|
data-bs-toggle="collapse"
|
||||||
data-bs-target="#navbarSupportedContent"
|
data-bs-target="#navbarSupportedContent"
|
||||||
aria-controls="navbarSupportedContent"
|
aria-controls="navbarSupportedContent"
|
||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-label="Toggle navigation"
|
aria-label="Toggle navigation"
|
||||||
>
|
>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
<a class="nav-link active" aria-current="page" href="/">Home</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/test">Test Page</a>
|
<a class="nav-link" href="/test">Test Page</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/history">History</a>
|
<a class="nav-link" href="/history">History</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div id="body" class="d-flex flex-column p-4 container-xxl">
|
<div id="body" class="d-flex flex-column p-4 container-xxl">
|
||||||
<h1>{{request_type}} Request</h1>
|
<h1>{{request_type}} Request</h1>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue