serenity-is / Serenity

Business Apps Made Simple with Asp.Net Core MVC / TypeScript
https://serenity.is
MIT License
2.6k stars 802 forks source link

In SlickGrid I can not find element s-EditLink because it is not there until my form shows. #5099

Closed stixoffire closed 4 years ago

stixoffire commented 4 years ago

@volkanceylan - I know you are very busy and sorry to bother you . How can I find the .s-EditLink in a slick grid row via code .. without using a button on my form. My issue lies in the sequencing of events - slick row does not have the rows in the DOM yet with the EditLink - slickGrid has no rendered event.

I am doing this because when my order is submitted I don't want anything to be allowed to be added to the order or changed (OrderDetails). I found a way to disable the links via css and I have code that will on a button press disable the edit links. I have the following items. VendorOrder, VendorOrderDetail , VendorOrderDetailEditor

I just need to be able to do this after the slickGrid has rendered - are there any events I can listen for that occur after the slickGrid is supposed to have rendered rendered ?

In VendorOrderDetailEditor I tried to document.ready, markupReady, onviewportchanged , onrowcountchanged and still I find nothing that occurs after the grid is rendered.

There is no filter / filtervalue on the EditLink - and the class is marked as sealed so I cannot inherit from it .

My code works from a button so I know the functionality is there .. just not the actual point in the event sequence .

var eLinks = this.element.find('.s-MyDB-VendOrderDetailEditorLink');

                for (var i = 0; i < eLinks.length; i++) {

                    eLinks[i].setAttribute('data-href', eLinks[i].attributes.getNamedItem('href').value);

                    eLinks[i].className = eLinks[i].className.replace(/\bs-EditLink\b/g, 'isDisabled');

                    eLinks[i].className = eLinks[i].className.replace(/\bs-MyDB-VendOrderDetailEditorLink\b/g, 'Disabled');

                    eLinks[i].setAttribute('aria-disabled', 'true');

                }

I am trying to implement this onRenderCompleted in the slick grid but it is not showing up in my intellisense .

Here is the instructions I have from SO about how to add onRenderCompleted.. Add the following line to the render() method just below renderRows(rendered);

function render() {
    ...
    renderRows(rendered);
    trigger(self.onRenderCompleted, {}); // fire when rendering is done
    ...
}
Add a new event handler to the public API:

"onRenderCompleted":            new Slick.Event(),
Bind to the new event in your code:

grid.onRenderCompleted.subscribe(function() {
    console.log('onRenderCompleted');
});
arunkumar12712 commented 4 years ago

try this https://github.com/volkanceylan/Serenity/issues/4599

stixoffire commented 4 years ago

@arunkumar12712

Yes I read that thread .. and John Rangers implementation does not seem to address the HyperLink .. of course I might be missing something .. but I do not see a hyperlink in his example. I see buttons .. My detail editor is disabled the problem is the links in the grid detail editor are not - they are still active. The final comment from @VolkanCeylan "Grids have a readonly property now, might be useful for some cases but needs manual implementation. " I am guessing the manual implementation - is the editlinks , I am wondering if I can change the xyzcolumn or dialogeditor based on the field.. then I can simply have in my Column [EditLink] MyField for the field when the order is not submitted, and no declaration when it is.

stixoffire commented 4 years ago

I have found a work around to how to achieve this .

I wanted to do this an easier way , there are probably better ways.

However I did accomplish this not as well as I would like - but it works.

Conditionally-disable-the-EditLinks-in-a-Detail-Editor-that-is-part-of--MasterDialog-with-a--Parent-Child-Relationship.