This is a migrated thread and some comments may be shown as answers.

Cannot properly set k-row-template in HTML (angular directive)

4 Answers 92 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Enrico
Top achievements
Rank 1
Enrico asked on 06 Jul 2015, 11:27 AM

Hi,

as I can see from this link: https://github.com/telerik/kendo-ui-core/blob/master/docs/AngularJS/introduction.md you could set k-row-template in three different ways:

1. Inline

2. Script

3. Directive

I found some strange behavior in the directive scenario. If I I do something like that:

 <div kendo-grid ... other grid settings >

    <div k-row-template>

        <tr data-uid="#: uid #"><td colspan="3"> ... my custom html template ... </td></tr>

    </div>

</div>

It does not compile the table row with the uid and I got errors with IE8 / 9 / 10, in IE11 works, in Chrome works but it puts everything in the first column.

Can you suggest the proper way to accomplish that scenario? To make it work now I'm forced to use a kendo template and get the HTML back using jquery, but it will be much more cleaner to do everything in a declarative way within the HTML. I could not find any example on the web.

Thanks,

Enrico

4 Answers, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 07 Jul 2015, 03:04 PM
Hi Enrico,

Thank you for contacting Telerik Support.

Placing a TR element within the k-row-template will not work as you are expecting with the directive approach, because the template itself will be generated in a DIV element and the browser will not be able to render the nested TR and TD elements. For rendering TR/TD elements as per your requirement you could use the following approach for example:
As for the directive approach, there are some cases that will force the browser to render the desired TR elements, but we can not recommend it, because it may fail in some browsers:
If any further assistance is needed, please feel free to contact us again.
 


Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Enrico
Top achievements
Rank 1
answered on 09 Jul 2015, 10:24 PM

So, then the declarative directive option is not available for kendo-grid as today, I can use it only with widgets that works with divs like kendo-list-view.

At this point will be nice to have it clarified in documentation, so other people can avoid wasting time trying to make it work :)

Thanks for the answer,

Enrico

0
Peter
Top achievements
Rank 1
answered on 10 Jul 2015, 12:54 AM

I agree.
I think at the end of day, kendo ui is still a heavily jquery base product.
It not pure anguarjs product.
It may take time for them to actually change the core infrastructure of kendo ui component to be Angularjs way.
They are working on it.
Hope they can get it done soon!!

0
Accepted
Konstantin Dikov
Telerik team
answered on 13 Jul 2015, 08:45 AM
Hi Enrico,

You are absolutely correct that such information should be included in the documentation and that a list with the limitations of those approaches will save some time for the developers. That is why I will forward this to the corresponding team, so they could consider including that information in our online documentation.


Best Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Enrico
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Enrico
Top achievements
Rank 1
Peter
Top achievements
Rank 1
Share this question
or