Hide Elements By Value

[CSWinnall]

Hi

Thought I'd share this custom Keyword I have created. This will hide elements if a value is matched or if you don't want it to match:

function hideElementsByValue (view, keywords) { // _hebv = Hide Elements By Value param[0] = fieldId, param[1] = valueToMatch, param.slice(2) = elementsToHide
    const kw = '_hebv';
    const viewId = view.key;
    if (!viewId || !keywords[kw]) return;
    const kwList = ktl.core.extractKeywordsListByType(viewId, kw);
    for (var kwIdx = 0; kwIdx < kwList.length; kwIdx++) {
        const kwInstance = kwList[kwIdx];
        execKw(kwInstance);
    }

    function execKw(kwInstance) {
        var res = ktl.core.processKeywordOptions(kwInstance.options);
        if (res && !res.rolesOk) return;

        paramGroups = kwInstance.params;
        if ( paramGroups.length == 0 ) return; // no params
        paramGroups.forEach(params => { // loop through each param group
            if ( params.length < 3 ) return;
            var fieldId = params[0], valToMatch = params[1];
            var elesToHide = params.slice(2).join();
            var fieldValue = $.trim($('.' + fieldId + ' .kn-detail-body').text());
            if ( valToMatch.startsWith('!') ) { // hide elements if field value does not match
                valToMatch = valToMatch.slice(1);
                if ( fieldValue != valToMatch ) {
                    $(elesToHide).hide();
                    
                }  else return;
            } else { // hide elements if field value matches}
                if ( fieldValue == valToMatch ) {
                    $(elesToHide).hide();
                    
                } else return;
            }
        });
    }
}

An example of calling this keyword:

_hebv=[field_2318, Post Treatment, .kn-details-link:contains("Treatment Extension"), .kn-details-link:contains("Mixed Sex House"), .kn-details-link:contains("Planned Length of Stay"), .kn-details-link:contains("Edit Detox")], [field_2318, !Post Treatment, .kn-details-link:contains("End Date")],

This keyword will also accept KTLRoles and multiple Instances.

Hope someone finds this useful
Craig

[cortexrd]

Hi Craig,

Thanks for sharing that code. I am very impressed at your initiative and talent with the KTL !

Now, I have a few questions:

1. I guess borderRadiusLastVisible(); should be removed?
2. This code would only work with details and list views - right?
3. What happens if your string has commas in these parameters? .kn-details-link:contains("Treatment A, Treatment B, Treatment C")
4. What happens if there are more than one field_2318 in the page, in another list or grid view for example?

BTW, about my question #3 (commas), I'd like to point out that the KTL Options have this very special advantage: when they are parsed, the whole string that follows the option is left intact, including commas, spaces, quotes and everything. This design strategy allows the keyword's own "secondary" parser to decide if that string must be split again, or used as a whole - as in a jQuery selector for example.

By curiosity... did you come up with this function because the _cfv keyword wouldn't allow achieving your goal? It seems to me that everything was already in _cfv, unless I'm missing something.

Can you try these two lines in your view and tell me if does what you want please?

_cfv=[field_2318, is, Post Treatment, , , , h], [ktlTarget, .kn-details-link:contains("Treatment Extension"), .kn-details-link:contains("Mixed Sex House"), .kn-details-link:contains("Planned Length of Stay"), .kn-details-link:contains("Edit Detox")]
_cfv=[field_2318, not, Post Treatment, , , , h], [ktlTarget, .kn-details-link:contains("End Date")]

I'd love to add your function in the KTL, but I need to be sure we're not duplicating things.

Let me know,
Norm

[CSWinnall]

Hi Norm Thank you for the feedback. You are right the border last radius should be removed we have it for when we hide menu links and the menu link we hide is the last one in the list. It just gives the menu a slightly curved end. This will hide anything based on a list or details view. I didn't realise the cfv could hide elements I will give it a go and get back to you. Craig

[CSWinnall]

Hi Norm

Thanks for letting me know about the _cfv. The _cfv works for this.

Craig

[cortexrd]

Well I feel a bit sad for all the efforts you've invested in this, but at the same time, I am very happy to see that someone has mastered the keyword creation principles, the multiple instances, and the keyword options.

You should be very proud. You've learned some important parts of the KTL structure and you're now ready to become a contributor.

Can't wait to see what else you will come up with !!

Cheers,
Norm

[CSWinnall]

Well we initially did the function before you had cfv then today we added roles and multiple instances. We learned quite a bit from doing that so nothing was lost.

…

On Fri, 18 Aug 2023, 17:00 Cortex R&D Inc., ***@***.***> wrote: Well I feel a bit sad for all the efforts you've invested in this, but at the same time, I am very happy to see that someone has mastered the keyword creation principles, the multiple instances, and the keyword options. You should be very proud. You've learned some important parts of the KTL structure and you're now ready to become a contributor. Can't wait to see what else you will come up with !! Cheers, Norm — Reply to this email directly, view it on GitHub <#90 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACQQXA7UQUCDZIYCLWDGOTTXV6GQ5ANCNFSM6AAAAAA3VLI5QE> . You are receiving this because you authored the thread.Message ID: <cortexrd/Knack-Toolkit-Library/repo-discussions/90/comments/6763090@ github.com>

[cortexrd]

Before the _cfv keyword?! ...oh, well that's completely different then. I'm even more impressed!

[CSWinnall]

Hi Norm

I've tried to replace another _hebv with the this:

_cfv=[field_5062, is, False, , , , h], [ktlTarget, li.menu-links__list-item:contains("Prev. Stay Info")]

This one doesn't seem to work though.

Any ideas?

Craig

[cortexrd]

Hi Craig,

You're right, thanks for reporting. I've fixed the jQuery validator by simply testing if the selector finds something. This should work all the time. You can pull the dev branch and test. If all ok, I'll do an official release.

Norm

[CSWinnall]

It does work My Apologies

[cortexrd]

I suspect two things. Try these:

1. Check is this gives 0 or 1: $('li.menu-links__list-item:contains("Prev. Stay Info")').length If you get 0, it means that the query finds nothing.
2. Try to change False to lowercase false. Is this a boolean field?

Norm

[CSWinnall]

I've got myself all in a muddle.
I thought it worked but now it doesn't seem to:

_cfv=[field_5062, is, False, , , , h], [ktlTarget, li.menu-links__list-item:contains("Prev. Stay Info")]

[CSWinnall]

I have also tried lower case false

[CSWinnall]

Hi Norm
I tried to put the _cfv in the details view where field_5062 is (in case it was a rendoring order issue) and I got this error:

I normally put it in the menu viewType.

Craig

[CSWinnall]

Hi Norm

Just to avoid confusion as I think I have flip flopped a couple of times. The
_cfv=[field_5062, is, False, , , , h], [ktlTarget, li.menu-links__list-item:contains("Prev. Stay Info")]

doesn't work I have tried it with false and I get a length of 1 for the jQuery selector.

I tried to put the _cfv in the details view where field_5062 is (in case it was a rendering order issue) and I got this error:

I normally put it in the menu view Type.

I hope that makes it clearer and where I am now.

[cortexrd]

I know exactly what the problem is, but this will require a bit of design changes.
It's because...

1. you say "use this jQuery selector as a target".
2. KTL tries to get that element with jQuery in isValidjQuery, but doesn't see it
3. KTL then calls getFieldIdFromLabel and uses the jQuery string as the text label, trying to find it. This causes the jQuery's parser to crash due to an invalid selector string.

This is due to the asynchronous rendering of views. You ask for a selector that point to an element that does not yet exist.
We'd have to wait for a few seconds until the jQuery succeeds, if ever.
Also convert a bunch of code to use Promises.

Quite complex changes... for a Saturday!!!

Will try to come up with a nice solution.

Norm

[CSWinnall]

Thanks Norm
We will continue to use our hebv for now and await your magic fix.

Thank you

[CSWinnall]

Hi Norm

Just out of interest why do we only get the error when the cfv is on the details view?

Also it appears that the menu views are always the last to render. So if the keywords is on the menu why does it not work?

Why does the _hebv keyword always work if it is a rendering order issue.

Not too urgent on this

Craig

[cortexrd]

Hi Craig,

If you have the chance to test the latest push on the dev branch, I'd appreciate your feedback.
There are lots of major changes again, and some will break the existing jQuery selectors in the ktlTarget.

Here are the details on this.

Before:
[ktlTarget, li.menu-links__list-item:contains("Prev. Stay Info")]

Now:
[ktlTarget, $('li.menu-links__list-item:contains("Prev. Stay Info")')]

As you can see, the jQuery string must be enclosed in a typical full syntax starting with this:
$('

and ending with this:
')

The quotes can also be double quotes. Both are supported, but not escaped characters like \' or \".

When the code detects this syntax, it will strip the first 3 and last 2 characters, and this resulting string will become the actual jQuery: $('resultingString')

See function extractJQuerySelector for details.

This solves any possible ambiguity while trying to detect jQuery, and works perfectly in all scenarios.

I should push the official release tomorrow, if you can confirm that all works well on your side.

About your other questions, I will get back to you later.

Cheers,
Norm

[CSWinnall]

Hi Norm

Unfortunately for this instance it still doesn't work on the menu view no errors:

_cfv=[field_5062, is, False, , , , r], [ktlTarget, $('li.menu-links__list-item:contains("Prev. Stay Info")')]

The selector works here:

_cfv=[field_2318, is, Post Treatment, , , , r], [ktlTarget, $('.kn-details-link:contains("Treatment Extension"), .kn-details-link:contains("Mixed Sex House"), .kn-details-link:contains("Planned Length of Stay"), .kn-details-link:contains("Edit Detox")')] _cfv=[field_2318, not, Post Treatment, , , , r], [ktlTarget, $('.kn-details-link:contains("End Date")')]

This is a details view where the target and the field are in the same view

Craig

[CSWinnall]

I will test when I get in thank you

…

On Sun, 20 Aug 2023, 20:17 Cortex R&D Inc., ***@***.***> wrote: Hi Craig, If you have the chance to test the latest push on the *dev* branch, I'd appreciate your feedback. There are lots of major changes again, and some will *break* the existing jQuery selectors in the *ktlTarget*. Here are the details on this. Before: [ktlTarget, li.menu-links__list-item:contains("Prev. Stay Info")] Now: [ktlTarget, $('li.menu-links__list-item:contains("Prev. Stay Info")')] As you can see, the jQuery string must be enclosed in a typical *full* syntax starting with this: $(' and ending with this: ') The quotes can also be a double quotes. Both are supported, but not escaped characters like ' or ". When the code detects this syntax, it will strip the first 3 and last 2 characters, and this resulting string will become the actual jQuery: $('resultingString') This solves any possible ambiguity while trying to detect jQuery, and works perfectly well in all scenarios. I should push the official release tomorrow, if you can confirm that all works well on your side. About your other questions, I will get back to you later. Cheers, Norm — Reply to this email directly, view it on GitHub <#90 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACQQXA7KMFMQOMHM5K3AB2DXWJPEZANCNFSM6AAAAAA3VLI5QE> . You are receiving this because you authored the thread.Message ID: <cortexrd/Knack-Toolkit-Library/repo-discussions/90/comments/6774610@ github.com>

[cortexrd]

Sorry Craig, I admit I wasn't clear enough.

Since I know that you often use the Dev mode, when I said "If you have the chance to test the latest push on the dev branch" I meant for you to do a pull on that branch in GitHub Desktop and test it with your local server.

Let me know if this works.
Norm

[CSWinnall]

Hi Norm That's what I did. Craig

…

On Mon, 21 Aug 2023, 12:34 Cortex R&D Inc., ***@***.***> wrote: Sorry Craig, I admit I wasn't clear enough. Since I know that you often use the *Dev mode*, when I said "*If you have the chance to test the latest push on the dev branch*" I meant for you to do a *pull* on that branch in *GitHub Desktop* and test it with your local server. Let me know if this works. Norm — Reply to this email directly, view it on GitHub <#90 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACQQXA7UNCUYGW7PWW3YFTLXWNBUDANCNFSM6AAAAAA3VLI5QE> . You are receiving this because you authored the thread.Message ID: <cortexrd/Knack-Toolkit-Library/repo-discussions/90/comments/6779922@ github.com>

[cortexrd]

I think I've fixed it now. Do another pull and let me know it helps.
Norm

[CSWinnall]

Hi Norm, still not working and still no errors.

[cortexrd]

See your Teams messages.

[CSWinnall]

Hi Norm

So this is now fixed. If you need to hide a menu button you should put the cfv keywords on the details view where the condition is.

Many thanks Norm for you time