mirror of
https://gitlab.com/hashborgir/d2tools.git
synced 2025-10-13 16:34:23 -05:00
Tbl Editor
This commit is contained in:
Hash Borgir
310
TblEditorGUI.php
310
TblEditorGUI.php
@@ -1,5 +1,4 @@
|
||||
<?php
|
||||
|
||||
session_start();
|
||||
ob_start();
|
||||
|
||||
@@ -27,139 +26,208 @@ foreach (glob($tbl . "*.tbl") as $filename) {
|
||||
$tableInfo = pathinfo($filename);
|
||||
$tableNames[] = $tableInfo['filename'];
|
||||
}
|
||||
|
||||
$tableNames = ['patchstring'];
|
||||
|
||||
// Create an associative array to store rows for each table
|
||||
$tableRows = [];
|
||||
|
||||
// Iterate over the table names
|
||||
foreach ($tableNames as $tableName) {
|
||||
$crud = new CRUD($tableName);
|
||||
$tableRows[$tableName] = $crud->readAll();
|
||||
}
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="https://bootswatch.com/4/lumen/bootstrap.min.css">
|
||||
<title>Editable Tables</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h2>Editable Tables</h2>
|
||||
<ul class="nav nav-tabs" id="myTab" role="tablist">
|
||||
<?php $firstTab = true; ?>
|
||||
<?php foreach ($tableNames as $tableName): ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link <?php echo $firstTab ? 'active' : ''; ?>" id="<?php echo $tableName; ?>-tab" data-toggle="tab" href="#<?php echo $tableName; ?>" role="tab" aria-controls="<?php echo $tableName; ?>" aria-selected="<?php echo $firstTab ? 'true' : 'false'; ?>"><?php echo $tableName; ?></a>
|
||||
</li>
|
||||
<?php $firstTab = false; ?>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="tab-content" id="myTabContent">
|
||||
<?php $firstTab = true; ?>
|
||||
<?php foreach ($tableNames as $tableName): ?>
|
||||
<div class="tab-pane fade <?php echo $firstTab ? 'show active' : ''; ?>" id="<?php echo $tableName; ?>" role="tabpanel" aria-labelledby="<?php echo $tableName; ?>-tab">
|
||||
<form method="post" action="TblEditor.php"> <!-- Replace 'process.php' with the PHP file to handle form submission -->
|
||||
<div class="form-row mb-3">
|
||||
<div class="col">
|
||||
<input type="text" name="key" class="form-control" placeholder="Key" required>
|
||||
<input type="hidden" name="tableName" value="<?php echo $tableName?>">
|
||||
</div>
|
||||
<div class="col">
|
||||
<textarea name="string" class="form-control" placeholder="String" required></textarea>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="submit" name="add" class="btn btn-success">Add</button>
|
||||
</div>
|
||||
</div>
|
||||
</form><!-- comment -->
|
||||
<form method="post" action=""> <!-- Replace 'process.php' with the PHP file to handle form submission -->
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Key</th>
|
||||
<th>String</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($tableRows[$tableName] as $index => $row){ ?>
|
||||
<tr class="table-row-<?php echo $index; ?>">
|
||||
<td><?php echo $row['rowid']; ?></td>
|
||||
<td><input type="text" name="key[<?php echo $tableName; ?>][]" class="form-control" value="<?php echo $row['Key']; ?>"></td>
|
||||
<td><textarea name="string[<?php echo $tableName; ?>][]" class="form-control"><?php echo $row['String']; ?></textarea></td>
|
||||
<td>
|
||||
<button type="submit" name="update" class="btn btn-primary" value="<?php echo $row['rowid']; ?>">Update</button>
|
||||
<button type="submit" name="delete" class="btn btn-danger" value="<?php echo $row['rowid']; ?>">Delete</button>
|
||||
<input type="hidden" value="<?php echo $row['Key']?>" name="keycode">
|
||||
<input type="hidden" name="keytable" value="<?php echo $tableName?>">
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
<?php $firstTab = false; ?>
|
||||
<?php endforeach; ?>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.4/css/jquery.dataTables.min.css">
|
||||
|
||||
<!-- JS -->
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="https://cdn.datatables.net/1.11.4/js/jquery.dataTables.min.js"></script>
|
||||
<!-- Bootstrap CSS (if not already included) -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
|
||||
|
||||
<!-- Bootstrap DataTables CSS -->
|
||||
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.4/css/dataTables.bootstrap4.min.css">
|
||||
|
||||
<!-- Bootstrap JS (if not already included) -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
|
||||
|
||||
<!-- Bootstrap DataTables JS -->
|
||||
<script src="https://cdn.datatables.net/1.11.4/js/dataTables.bootstrap4.min.js"></script>
|
||||
<title>Editable Tables</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h2>Select .tbl File</h2>
|
||||
<select name="tableName" id="tableName" class="form-control">
|
||||
<?php foreach ($tableNames as $tableName): ?>
|
||||
<option value="<?php echo $tableName; ?>" <?php echo ($tableName == "patchstring") ? "selected" : ""; ?>><?php echo $tableName; ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<h2>Table</h2>
|
||||
<div class="form-group">
|
||||
Add new String
|
||||
<label for="inputKey">Key</label>
|
||||
<input type="text" class="form-control" id="inputKey" placeholder="Enter Key">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="inputString">String</label>
|
||||
<textarea class="form-control" id="inputString" placeholder="Enter String"></textarea>
|
||||
</div>
|
||||
<button type="button" class="btn btn-primary" id="addLink">Add</button>
|
||||
<br>
|
||||
<hr>
|
||||
|
||||
<div class="tablediv">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Key</th>
|
||||
<th>String</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- Additional rows -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
// Handle Delete button click
|
||||
$('button[name="delete"]').click(function(event) {
|
||||
event.preventDefault(); // Prevent the default form submission
|
||||
|
||||
var key = $(this).next().val(); // Get the value of the input after the Delete button
|
||||
var tableName = $(this).next().next().val(); // Get the value of the input after the key
|
||||
|
||||
console.log(key);
|
||||
console.log(tableName);
|
||||
|
||||
$.get('/TblEditor.php', { cmd: 'delete', t: tableName, k: key })
|
||||
.done(function(response) {
|
||||
// Handle success response
|
||||
location.reload();
|
||||
})
|
||||
.fail(function(xhr, status, error) {
|
||||
// Handle error response
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
// Get the initial selected table
|
||||
var selectedTable = $('#tableName').val();
|
||||
|
||||
// Send GET request to TblEditor.php?getTable with selected table name
|
||||
var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable});
|
||||
|
||||
request.done(function (response) {
|
||||
// Handle the response here
|
||||
$('.tablediv tbody').html(response).promise().done(function () {
|
||||
// Callback function after HTML content is loaded
|
||||
|
||||
// Initialize DataTables on the table
|
||||
$('.table').DataTable();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Handle Update button event
|
||||
$('button[name="update"]').click(function(event) {
|
||||
event.preventDefault(); // Prevent the default form submission
|
||||
});
|
||||
|
||||
var key = $(this).next().val(); // Get the value of the input after the Delete button
|
||||
var tableName = $(this).next().next().val(); // Get the value of the input after the key
|
||||
// Select element change event handler
|
||||
$('#tableName').change(function () {
|
||||
var selectedTable = $(this).val();
|
||||
|
||||
console.log(key);
|
||||
console.log(tableName);
|
||||
// Send GET request to TblEditor.php?getTable with selected table name
|
||||
var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable});
|
||||
|
||||
$.post('/TblEditor.php', { cmd: 'update', t: tableName, k: key })
|
||||
.done(function(response) {
|
||||
// Handle success response
|
||||
location.reload();
|
||||
})
|
||||
.fail(function(xhr, status, error) {
|
||||
// Handle error response
|
||||
request.done(function (response) {
|
||||
// Handle the response here
|
||||
$('.tablediv tbody').html(response).promise().done(function () {
|
||||
// Callback function after HTML content is loaded
|
||||
|
||||
// Initialize DataTables on the table
|
||||
$('.table').DataTable();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
// Delete link click event handler
|
||||
$(document).on('click', '.delete-link', function (event) {
|
||||
event.preventDefault();
|
||||
|
||||
var selectedTable = $('select[name="tableName"]').val();
|
||||
|
||||
// Get the rowid from the custom attribute data-rowid
|
||||
var rowid = $(this).data('rowid');
|
||||
|
||||
// Remove the deleted row from the table
|
||||
$('.row-' + rowid).remove();
|
||||
|
||||
// Send GET request to TblEditor.php?cmd=delete&rowid={rowid}
|
||||
$.get('TblEditor.php', {cmd: 'delete', tableName: selectedTable, rowid: rowid}, function (response) {
|
||||
// Handle the response here
|
||||
|
||||
// Wait until the response is loaded, then remove the row
|
||||
$(response).ready(function () {
|
||||
|
||||
// Update DataTable
|
||||
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
// Update link click event handler
|
||||
$(document).on('click', '.update-link', function (event) {
|
||||
event.preventDefault();
|
||||
|
||||
var selectedTable = $('select[name="tableName"]').val();
|
||||
|
||||
// Get the rowid from the custom attribute data-rowid
|
||||
var rowid = $(this).data('rowid');
|
||||
|
||||
// Get the updated values from the corresponding input and textarea
|
||||
var key = $('.row-' + rowid + ' input').val();
|
||||
var string = $('.row-' + rowid + ' textarea').val();
|
||||
|
||||
// Send POST request to TblEditor.php with the updated values
|
||||
$.post('TblEditor.php', {cmd: 'update', tableName: selectedTable, rowid: rowid, key: key, string: string}, function (response) {
|
||||
// Handle the response here
|
||||
|
||||
// Optional: Update any UI elements if needed
|
||||
|
||||
// Update DataTable
|
||||
$('.table').DataTable().draw();
|
||||
});
|
||||
});
|
||||
|
||||
// Add link click event handler
|
||||
$('#addLink').click(function () {
|
||||
var selectedTable = $('#tableName').val();
|
||||
var key = $('#inputKey').val();
|
||||
var string = $('#inputString').val();
|
||||
|
||||
// Send POST request to TblEditor.php with parameters
|
||||
$.post('TblEditor.php', {cmd: 'add', tableName: selectedTable, Key: key, String: string}, function (response) {
|
||||
// Handle the response here
|
||||
rowid = response;
|
||||
// Create the HTML markup for the new row
|
||||
var newRow = '<tr class="row-' + rowid + '">' +
|
||||
'<td>' + rowid + '</td>' +
|
||||
'<td><input type="text" value="' + key + '" class="form-control"></td>' +
|
||||
'<td><textarea class="form-control">' + string + '</textarea></td>' +
|
||||
'<td><div>' +
|
||||
'<a href="#" class="update-link btn btn-primary" data-rowid="' + rowid + '">Update</a>' +
|
||||
'<a href="#" class="delete-link btn btn-danger" data-rowid="' + rowid + '">Delete</a>' +
|
||||
'</div></td>' +
|
||||
'</tr>';
|
||||
;
|
||||
|
||||
|
||||
// Append the new row to the table
|
||||
$('.table').DataTable().destroy();
|
||||
|
||||
$('.table tbody').append(newRow);
|
||||
|
||||
$('.table').DataTable();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<style>
|
||||
div.dataTables_wrapper div.dataTables_length select {
|
||||
width: 75px !important;
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user