FIX_FAQ
This commit is contained in:
parent
a6d443af38
commit
81b8f765d4
@ -3,6 +3,33 @@
|
||||
position: absolute;
|
||||
}
|
||||
.dataTables_length label {height: 21px !important;}
|
||||
|
||||
.custom-dropdown-menu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #ffffff !important;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem 0;
|
||||
min-width: 10rem;
|
||||
z-index: 9999;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item {
|
||||
display: block !important;
|
||||
width: 100% !important;
|
||||
padding: 0.5rem 1rem !important;
|
||||
color: #212529 !important;
|
||||
text-decoration: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item:hover {
|
||||
background-color: #f8f9fa !important;
|
||||
color: #16181b !important;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- End ADD and EDIT Page HTML -->
|
||||
@ -16,13 +43,15 @@
|
||||
<th class="font-weight-medium">S.No.</th>
|
||||
<th class="font-weight-medium">Category</th>
|
||||
<th class="font-weight-medium">Question</th>
|
||||
<th class="font-weight-medium">Answer</th>
|
||||
<!-- <th class="font-weight-medium">Answer</th> -->
|
||||
<th class="font-weight-medium">Status</th>
|
||||
<th class="font-weight-medium">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php if(isset($faq_list)) { $slno = 1; ?>
|
||||
<?php if(!empty($faq_list)) {
|
||||
// <?php if(isset($faq_list)) {
|
||||
$slno = 1; ?>
|
||||
<?php foreach($faq_list as $index => $row) { ?>
|
||||
<tr>
|
||||
<td class="text-center"><?= $slno++; ?></td>
|
||||
@ -36,11 +65,11 @@
|
||||
? htmlspecialchars(substr($question, 0, 50)) . "..."
|
||||
: htmlspecialchars($question);
|
||||
?></td>
|
||||
<td><?php $answer = $row['answer'] ? $row['answer'] : 'N/A';
|
||||
<!-- <td><?php $answer = $row['answer'] ? $row['answer'] : 'N/A';
|
||||
echo (strlen($answer) > 50)
|
||||
? htmlspecialchars(substr($answer, 0, 50)) . "..."
|
||||
: htmlspecialchars($answer);
|
||||
?></td>
|
||||
?></td> -->
|
||||
<td>
|
||||
<span class="<?php if($row['is_active'] == 1){ echo 'badge badge-primary'; }else{ echo 'badge badge-danger'; } ?>">
|
||||
<?php if($row['is_active'] == 1){ echo 'Active'; }else{ echo 'In-Active'; } ?>
|
||||
@ -62,12 +91,7 @@
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
<?php } else { ?>
|
||||
<!-- <tr>
|
||||
<td colspan="6" class="text-center">No data available</td>
|
||||
</tr> -->
|
||||
<?php } ?>
|
||||
<?php } } ?>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
@ -353,4 +377,93 @@
|
||||
});
|
||||
|
||||
</script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const table = document.getElementById("user-table");
|
||||
|
||||
// Create custom dropdown
|
||||
function createCustomDropdown(row) {
|
||||
// Get the original dropdown items
|
||||
const originalDropdown = row.querySelector('.dropdown-menu');
|
||||
if (!originalDropdown) return null;
|
||||
|
||||
// Create new dropdown with proper background and spacing
|
||||
const customDropdown = document.createElement('div');
|
||||
customDropdown.className = 'custom-dropdown-menu';
|
||||
|
||||
// Copy inner content while maintaining icon alignment
|
||||
customDropdown.innerHTML = originalDropdown.innerHTML;
|
||||
|
||||
return customDropdown;
|
||||
}
|
||||
|
||||
let activeDropdown = null;
|
||||
|
||||
// Add click event listener to rows
|
||||
table.querySelectorAll("tbody tr").forEach(row => {
|
||||
const customDropdown = createCustomDropdown(row);
|
||||
if (!customDropdown) return;
|
||||
|
||||
// Append the custom dropdown to the body
|
||||
document.body.appendChild(customDropdown);
|
||||
|
||||
row.addEventListener("click", function(event) {
|
||||
// Ignore clicks on the action column
|
||||
if (event.target.closest('td:last-child')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Hide any active dropdown
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
}
|
||||
|
||||
// Get click position
|
||||
const rect = event.target.getBoundingClientRect();
|
||||
|
||||
// Position the dropdown with some offset
|
||||
customDropdown.style.display = 'block';
|
||||
customDropdown.style.position = 'fixed';
|
||||
customDropdown.style.left = `${rect.left}px`;
|
||||
customDropdown.style.top = `${rect.bottom + 5}px`; // Add 5px gap
|
||||
|
||||
// Set as active dropdown
|
||||
activeDropdown = customDropdown;
|
||||
|
||||
event.stopPropagation();
|
||||
});
|
||||
|
||||
// Preserve click handlers and add auto-close
|
||||
customDropdown.querySelectorAll('.dropdown-item').forEach(item => {
|
||||
item.addEventListener('click', function(e) {
|
||||
const onclickAttr = this.getAttribute('onclick');
|
||||
if (onclickAttr) {
|
||||
eval(onclickAttr);
|
||||
}
|
||||
|
||||
const href = this.getAttribute('href');
|
||||
if (href && href !== '#') {
|
||||
window.location.href = href;
|
||||
}
|
||||
|
||||
// Close the dropdown after handling the click
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
|
||||
e.stopPropagation();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Close dropdown when clicking outside
|
||||
document.addEventListener("click", function() {
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -3,6 +3,32 @@
|
||||
position: absolute;
|
||||
}
|
||||
.dataTables_length label {height: 21px !important;}
|
||||
.custom-dropdown-menu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #ffffff !important;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem 0;
|
||||
min-width: 10rem;
|
||||
z-index: 9999;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item {
|
||||
display: block !important;
|
||||
width: 100% !important;
|
||||
padding: 0.5rem 1rem !important;
|
||||
color: #212529 !important;
|
||||
text-decoration: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item:hover {
|
||||
background-color: #f8f9fa !important;
|
||||
color: #16181b !important;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- End ADD and EDIT Page HTML -->
|
||||
@ -23,7 +49,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php if(isset($data['fe_list'])) { $slno = 1; ?>
|
||||
<?php if(!empty($data['fe_list'])) { $slno = 1; ?>
|
||||
<?php foreach($data['fe_list'] as $index => $row) { ?>
|
||||
<tr>
|
||||
<td class="text-center"><?= $slno++; ?></td>
|
||||
@ -51,12 +77,7 @@
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
<?php } else { ?>
|
||||
<!-- <tr>
|
||||
<td colspan="6" class="text-center">No data available</td>
|
||||
</tr> -->
|
||||
<?php } ?>
|
||||
<?php } } ?>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
@ -503,4 +524,93 @@
|
||||
}
|
||||
|
||||
</script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const table = document.getElementById("user-table");
|
||||
|
||||
// Create custom dropdown
|
||||
function createCustomDropdown(row) {
|
||||
// Get the original dropdown items
|
||||
const originalDropdown = row.querySelector('.dropdown-menu');
|
||||
if (!originalDropdown) return null;
|
||||
|
||||
// Create new dropdown with proper background and spacing
|
||||
const customDropdown = document.createElement('div');
|
||||
customDropdown.className = 'custom-dropdown-menu';
|
||||
|
||||
// Copy inner content while maintaining icon alignment
|
||||
customDropdown.innerHTML = originalDropdown.innerHTML;
|
||||
|
||||
return customDropdown;
|
||||
}
|
||||
|
||||
let activeDropdown = null;
|
||||
|
||||
// Add click event listener to rows
|
||||
table.querySelectorAll("tbody tr").forEach(row => {
|
||||
const customDropdown = createCustomDropdown(row);
|
||||
if (!customDropdown) return;
|
||||
|
||||
// Append the custom dropdown to the body
|
||||
document.body.appendChild(customDropdown);
|
||||
|
||||
row.addEventListener("click", function(event) {
|
||||
// Ignore clicks on the action column
|
||||
if (event.target.closest('td:last-child')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Hide any active dropdown
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
}
|
||||
|
||||
// Get click position
|
||||
const rect = event.target.getBoundingClientRect();
|
||||
|
||||
// Position the dropdown with some offset
|
||||
customDropdown.style.display = 'block';
|
||||
customDropdown.style.position = 'fixed';
|
||||
customDropdown.style.left = `${rect.left}px`;
|
||||
customDropdown.style.top = `${rect.bottom + 5}px`; // Add 5px gap
|
||||
|
||||
// Set as active dropdown
|
||||
activeDropdown = customDropdown;
|
||||
|
||||
event.stopPropagation();
|
||||
});
|
||||
|
||||
// Preserve click handlers and add auto-close
|
||||
customDropdown.querySelectorAll('.dropdown-item').forEach(item => {
|
||||
item.addEventListener('click', function(e) {
|
||||
const onclickAttr = this.getAttribute('onclick');
|
||||
if (onclickAttr) {
|
||||
eval(onclickAttr);
|
||||
}
|
||||
|
||||
const href = this.getAttribute('href');
|
||||
if (href && href !== '#') {
|
||||
window.location.href = href;
|
||||
}
|
||||
|
||||
// Close the dropdown after handling the click
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
|
||||
e.stopPropagation();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Close dropdown when clicking outside
|
||||
document.addEventListener("click", function() {
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -3,6 +3,32 @@
|
||||
position: absolute;
|
||||
}
|
||||
.dataTables_length label {height: 21px !important;}
|
||||
.custom-dropdown-menu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #ffffff !important;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem 0;
|
||||
min-width: 10rem;
|
||||
z-index: 9999;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item {
|
||||
display: block !important;
|
||||
width: 100% !important;
|
||||
padding: 0.5rem 1rem !important;
|
||||
color: #212529 !important;
|
||||
text-decoration: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.custom-dropdown-menu .dropdown-item:hover {
|
||||
background-color: #f8f9fa !important;
|
||||
color: #16181b !important;
|
||||
cursor: pointer !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- End ADD and EDIT Page HTML -->
|
||||
@ -24,7 +50,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php if(isset($data['pos_list'])) { $slno = 1; ?>
|
||||
<?php if(!empty($data['pos_list'])) { $slno = 1; ?>
|
||||
<?php foreach($data['pos_list'] as $index => $row) { ?>
|
||||
<tr>
|
||||
<td class="text-center"><?= $slno++; ?></td>
|
||||
@ -54,12 +80,7 @@
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
<?php } else { ?>
|
||||
<tr>
|
||||
<td colspan="3" class="text-center">No data available</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
<?php } } ?>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
@ -480,5 +501,94 @@
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const table = document.getElementById("user-table");
|
||||
|
||||
// Create custom dropdown
|
||||
function createCustomDropdown(row) {
|
||||
// Get the original dropdown items
|
||||
const originalDropdown = row.querySelector('.dropdown-menu');
|
||||
if (!originalDropdown) return null;
|
||||
|
||||
// Create new dropdown with proper background and spacing
|
||||
const customDropdown = document.createElement('div');
|
||||
customDropdown.className = 'custom-dropdown-menu';
|
||||
|
||||
// Copy inner content while maintaining icon alignment
|
||||
customDropdown.innerHTML = originalDropdown.innerHTML;
|
||||
|
||||
return customDropdown;
|
||||
}
|
||||
|
||||
let activeDropdown = null;
|
||||
|
||||
// Add click event listener to rows
|
||||
table.querySelectorAll("tbody tr").forEach(row => {
|
||||
const customDropdown = createCustomDropdown(row);
|
||||
if (!customDropdown) return;
|
||||
|
||||
// Append the custom dropdown to the body
|
||||
document.body.appendChild(customDropdown);
|
||||
|
||||
row.addEventListener("click", function(event) {
|
||||
// Ignore clicks on the action column
|
||||
if (event.target.closest('td:last-child')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Hide any active dropdown
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
}
|
||||
|
||||
// Get click position
|
||||
const rect = event.target.getBoundingClientRect();
|
||||
|
||||
// Position the dropdown with some offset
|
||||
customDropdown.style.display = 'block';
|
||||
customDropdown.style.position = 'fixed';
|
||||
customDropdown.style.left = `${rect.left}px`;
|
||||
customDropdown.style.top = `${rect.bottom + 5}px`; // Add 5px gap
|
||||
|
||||
// Set as active dropdown
|
||||
activeDropdown = customDropdown;
|
||||
|
||||
event.stopPropagation();
|
||||
});
|
||||
|
||||
// Preserve click handlers and add auto-close
|
||||
customDropdown.querySelectorAll('.dropdown-item').forEach(item => {
|
||||
item.addEventListener('click', function(e) {
|
||||
const onclickAttr = this.getAttribute('onclick');
|
||||
if (onclickAttr) {
|
||||
eval(onclickAttr);
|
||||
}
|
||||
|
||||
const href = this.getAttribute('href');
|
||||
if (href && href !== '#') {
|
||||
window.location.href = href;
|
||||
}
|
||||
|
||||
// Close the dropdown after handling the click
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
|
||||
e.stopPropagation();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Close dropdown when clicking outside
|
||||
document.addEventListener("click", function() {
|
||||
if (activeDropdown) {
|
||||
activeDropdown.style.display = 'none';
|
||||
activeDropdown = null;
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user