Not just for testing or JS access to DOM elements, element id is also important to CSS styling. MS + Telerik cannot simply undo 30+ years of web development with a half-baked Blazor framework. HTML5/CSS3/JavaScript has become powerful software development languages, don't disregard them. 

My case is that I'm building a form with lots of components dynamically, which also may include several tabstrips.

All of the components may have conditions that are used to change other components (enable/disable, hide/show, set focus, change colours ++).  The tabstrip and tabstriptab  are the only components that I have seen, that I'm not able to to set the conditions for by using key/id in the node tree.

The conditions use id/guids to decide which component should trigger changes, and which components are affected by the changes.  To use classes and/or names would change the concept and maybe be more uncertain than using id/guids?

Shortened example of the loop for checking conditions for displaying a component:

            bool valBool = false;
            if(node["value"] == "true")
            { 
                node["value"] = "false";
                valBool = false;
            }
            else
        {
                 node["value"] = "true";
                valBool = true;
            }

 

            foreach (var condition in SchemaConditions)
            {           
                node = FindNodeByGuid(sourceParent, condition.ElementGuid.ToString()); 
                if(node != null)
                { 
                    foreach (var attr in node.Attributes.Where(a => !a.Key.StartsWith("_")))
                    {
                        if(attr.Key == "display")
                        {
                            if(condition.Action.ToLower() == "show" && valBool == bool.Parse(condition.CheckValue)) 
                            {
                                node[attr.Key] = "inline";
                            }
                            else if (condition.Action.ToLower() == "hide" && valBool == bool.Parse(condition.CheckValue))
                            {
                                node[attr.Key] = "none";
                            }                      
                        }
                    }
                    this.SelectedNode = node;
                    if(EntryChangedCallback != null)
                    { 
                        await EntryChangedCallback(node["key"], node["value"]);
                    }
                }

            }

I see improvements in TabStrip and TabStripTab by including the same possibility of setting Id's as for your other components.

Hi,

This feature would allow me to call JS functions on specific Grids or TreeLists on the page, e.g. for preventing the "cropped UI" when using the AutoFit feature (this happens when the Grid width is larger than the auto-fitted columns would be).

Otherwise I would have to wrap all Grid/TreeLists into an own div with id (I cannot use classes for differentiation because they are dynamically generated).

Best Regards,

Christian

Can I add a custom id or css class to this line in the grid

 

<tr role="row" class="k-master-row    " data-render-row-index="1"  

I have tried a dozen different ways and none of them work, is there another option for a tooltip?

So I added a class like below and this doesn't work either

 

<HCAToolTip selector=".test .k-master-row"></HCAToolTip>

<TelerikGridData="@uiData" Height="550px" FilterMode="@GridFilterMode.FilterMenu" Class="test"

Sortable="@Sortable" Pageable="@ShowPager" PageSize="@PageSize" Groupable="@ShowGroup" Resizable="@Resizable" Reorderable="@Reorderable" SelectionMode="@GridSelectionMode.Single" OnRowClick="OnRowDoubleClickHandler">

<GridColumns>

I have multiple grids on one page and I have a tool tip that I want to apply to one grid but not another,

So I created a Tool Tip Control I can use everywhere, so I don't have to keep adding code to each page I can just drag and drop the tool tip to the necessary grid, example below.

<HCAToolTip selector=".k-master-row"></HCAToolTip>

This works fine, however because the css class above is on other grids the tool tip shows on them as well, I only want it on 1 or maybe 2 of the grids, out of 5 of them on the same page 

Dear Admin

We are using a lot of components which are unique. For us it would be much easier to reference them by ID instead via cascading selectors.

Best regards,

Hien