简体   繁体   English

将图标设置为kendo ui选项卡选项卡而不是文本?

[英]Setting icons to kendo ui tabstrip tabs instead of text?

I am wanting to just display an icon instead of using text on the tabstrip tabs (the titles of the tab, not the content that pops up when you press the tab). 我只想显示一个图标,而不是在Tabstrip标签上使用文本(标签的标题,而不是按下标签时弹出的内容)。

I have this tabstrip: 我有这个标签:

$('#filterTabStrip').kendoTabStrip({
                        //animation: false,
                        collapsible: true,
                        dataTextField: 'text',
                        dataImageUrlField: 'imageUrl',
                        dataContentField: 'content',
                        dataSource: [
                            {
                                text: 'Users',
                                //imageUrl: $('#user_tab_image').html(),
                                content: $('#user_filter_template').html()
                            },
                            {
                                text: 'Location',
                                //imageUrl: '{!URLFOR($Resource.slds, "slds-master/assets/icons/utility-sprite/svg/symbols.svg#location")}'
                                content: $('#location_filter_template').html()
                            },
                            {
                                text: 'Description',
                                //imageUrl: '{!URLFOR($Resource.slds, "slds-master/assets/icons/action-sprite/svg/symbols.svg#description")}'
                                content: $('#description_filter_template').html()
                            },
                            {
                                text: 'Type',
                                //imageUrl: '{!URLFOR($Resource.slds, "slds-master/assets/icons/utility-sprite/svg/symbols.svg#picklist")}'
                                content: $('#type_filter_template').html()
                            },
                            {
                                text: 'Custom',
                                //imageUrl: '{!URLFOR($Resource.slds, "slds-master/assets/icons/utility-sprite/svg/symbols.svg#apps")}'
                                content: $('#user_filter_template').html()
                            }
                        ]
                    });

I have attempted to use static resource URL as well as setting the svg image in an html template, then setting the imageURL to that template, but that didn't work either. 我尝试使用静态资源URL以及在html模板中设置svg图像,然后将imageURL设置为该模板,但这也不起作用。

I am hoping this is possible. 我希望这是可能的。 Thank you for any help. 感谢您的任何帮助。

You can probably try to have an empty text for the dataTextField and provide the imageUrl of the icon which needs to show up. 您可能会尝试为dataTextField留空文本,并提供需要显示的图标的imageUrl。 Something similar to this might help! 此类似的东西可能会有所帮助!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM