Page 1 of 2
Simplifying Activity List Ordering Mechanism
Posted: Sat Jan 25, 2025 10:03 pm
by yvesf
Hi,
I hope this email finds you well.
I’ve developed a mechanism to allow the sorting of a list of activities.
You can see an example of the current implementation below:
orderlistimplemented.gif
The goal of this mechanism is to enable the end user to reorder the list in their desired way. While this approach works, I believe it could be simplified.
Currently, I’ve implemented it this way because I haven’t found a method to select a row in a run::iframe. It would be much more user-friendly if we could implement the following workflow:
OrderListSimplification.gif
Do you have any suggestions on how to:
Select a row in an iframe.
Retrieve this row's data.
Use "Up" and "Down" buttons to reorder the list without needing to open each record individually?
Thank you in advance for your help!
Best regards,
Yves
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 2:09 am
by steven
Hi Yves,
Why does the end user need to reorder the list?
Steven
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 9:05 am
by yvesf
Hi Steven,
We need to reorder lists in several parts of the app. Practitioners should see the most relevant items at the top based on their specialization—like placing cornea treatments first for cornea specialists, or prioritizing fovea treatments for others. The same applies to payments, visit reasons, etc., with the most common options appearing first in long lists (sometimes 100+ items). I used 6 items in the demo for simplicity, but the real lists are much longer. Reordering is important for efficiency.
I hope this clears things up.
Best,
Yves
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 10:21 am
by kev1n
Code to highlight a row:
Code: Select all
$(function () {
const highlightableDivs = document.querySelectorAll('.nuCell');
highlightableDivs.forEach((divElement) => {
divElement.addEventListener('mousedown', () => {
// Remove highlight from all divs
highlightableDivs.forEach((div) => div.classList.remove('highlight'));
// Get the data-nu-row attribute value of the clicked cell
const rowValue = divElement.getAttribute('data-nu-row');
// Get the primary key of the clicked cell
const primaryKey = divElement.getAttribute('data-nu-primary-key');
// Add highlight to all cells with the same data-nu-row value
highlightableDivs.forEach((div) => {
if (div.getAttribute('data-nu-row') === rowValue) {
div.classList.add('highlight');
}
});
});
});
$('.nuCell')
.off('mouseenter', nuBrowseTableHoverIn)
.off('mouseleave', nuBrowseTableHoverOut);
});
Add css in your form:
Code: Select all
.highlight {
background-color: red;
}
or simply declare nuSelectBrowse() and handle the highlighting there.
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 2:55 pm
by yvesf
Hi Kev1n,
When I am trying to select a row, I see the red selection and immediately after, it opens the related record. If it is a browse form only, it open an empty edit form (no fields in it).
I need to select the row and retrieve the related activite_id and the act_order value. Those value will allow me to move the record accordingly.
Thx
Yves
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 3:17 pm
by kev1n
Set the form type either to Browse only or add an empty nuSelectBrowse function to the form's custom code to prevent the edit form from opening.
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 6:48 pm
by yvesf
Hi Kevin,
With your proposed approach, I cannot pass the primary key from the browse only form to the parent form from which I will send it to the proc.
How to pass this value ? Tried with a nuProperty to create hash cookie but it is only available in the current browse only form but unavailable on the parent form.
Here is the corresponding code :
Code: Select all
function nuSelectBrowse(event, element) {
const primaryKey = $(element).attr('data-nu-primary-key');
//nuSetProperty('primary_Key', primaryKey);
// nuGetProperty('primary_Key');
}
primaryKey contains the record_id which is exactly what we need. Tried without const in order to have a global variable in Javascript but certainly limited to the current form.
Any idea ? It is the most difficult part : how to pass value from one place to another.
Many thx for your continuous help,
Yves
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 8:01 pm
by kev1n
Code: Select all
parent.nuSetProperty('primary_Key', primaryKey);
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 9:24 pm
by yvesf
is there somewhere a ref to retrieve this syntax ? I will finish by learning but having a ref book will help. I have tried by putting the form id instead of parent and no effect.
thx again, Yves
Re: Simplifying Activity List Ordering Mechanism
Posted: Sun Jan 26, 2025 10:12 pm
by kev1n