olton / Metro-UI-CSS

Impressive component library for expressive web development! Build responsive projects on the web with the first front-end component library in Metro Style. And now there are even more opportunities every day!
http://metroui.org.ua/
MIT License
7k stars 1.97k forks source link

@click vuejs click event into data-table "disappear" #1939

Open matteoannibali opened 1 month ago

matteoannibali commented 1 month ago

if i put inside a column "ordered" using data-role="table": <a :href="'#" @click="openDialogGroup(group)" >test it disappears when i render the table...

How can i do?

matteoannibali commented 1 month ago
  _createItemsFromHTML: function(){
        var that = this, element = this.element;
        var body = element.find("tbody");

        if (body.length > 0) $.each(body.find("tr"), function(){
            var row = $(this);
            var tr = [];
            $.each(row.children("td"), function(){
                var td = $(this);
                **tr.push(td.html());** <--perhaps this remove @click event handler?
            });
            that.items.push(tr);
        });

        this._createHeadsFromHTML();
        this._createFootsFromHTML();
    },
olton commented 1 month ago

set click handler for table and specify it for td. I don't know how to do it in Angular, but if you use m4q, it will be like this:

$('#table-id').on("click", "td", function(){
   const td = this
  ...
})
matteoannibali commented 1 month ago

I need to preserve the keywords of "viewjs", it must not remove them, I can't call a viewjs method from vanilla js

olton commented 1 month ago

You can use the event data-on-draw-cell to generate link https://codepen.io/olton/pen/mdRwqBB?editors=1011