Command Button Tooltip

3 posts, 1 answers
  1. Mike
    Mike avatar
    16 posts
    Member since:
    Feb 2014

    Posted 06 Aug 2014 Link to this post

    I need to add a tolltip to the Edit Button. I've tried this approach but it fails display the values for the column.
    This approach displays the Following tooltip: Edit #= UserFirstName # #=UserLastName#, #=RoleDescription#
    Should display: Edit MIKE JOHNSON, Adminstrator

    com.Edit().HtmlAttributes(new { title = string.Format("Edit {0} {1}, {2}", "#= UserFirstName # ", "#=UserLastName#", "#=RoleDescription#") });

    I was not able to find any post that shows a solution to this.
    What I'm doing wrong.

    Current Version: 2014.2.716

    The complete code is below.

    @(Html.Kendo().Grid<FDolUser>()
    .Name("grid")
    .Columns(col =>
    {
    col.Command(com =>
    {
    com.Edit().HtmlAttributes(new { title = string.Format("Edit {0} {1}, {2}", "#= UserFirstName # ", "#=UserLastName#", "#=RoleDescription#") });
    com.Destroy();
    });
    col.Bound(c => c.RacfId).ClientTemplate("#=UserTypeDescription#").Title("User Type");
    col.Bound(c => c.RacfId).ClientTemplate("#=VendId#").Title("Vendor Id");
    col.Bound(c => c.RacfId);
    col.Bound(c => c.RacfId).ClientTemplate("#=StaffMemberSequence#").Title("Staff Id");
    col.Bound(c => c.RoleCode).ClientTemplate("#=RoleDescription#");
    col.Bound(c => c.RacfId).ClientTemplate("#=SubScrabAcctId#").Title("ISA Id");
    col.Bound(c => c.UserFirstName);
    col.Bound(c => c.UserLastName);
    })
    .Filterable()
    .Sortable()
    .Pageable()
    .ToolBar(t => t.Create())
    .Editable(e => e.Mode(GridEditMode.PopUp))
    .Events(e => e.Edit("onEdit").DataBound("onDataBound"))
    .DataSource(ds => ds
    .Ajax()
    .Model(model => model.Id(p => p.UsrSq))
    .Events(events => events.Error("onError"))
    .Read(r => r.Action("GetUser", "Admin"))
    .Update(u => u.Action("UserUpdate", "Admin").Data("additionalInfo"))
    .Destroy(d => d.Action("userDestroy", "Admin"))
    .Create(c => c.Action("UserUpdate", "Admin").Data("additionalInfo"))
    .ServerOperation(true)
    ))
  2. Answer
    Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 08 Aug 2014 Link to this post

    Hi Mike,

    I would recommend using a Kendo UI Tooltip widget instead. For example: 
    @(Html.Kendo().Tooltip()
        .For("#grid")
        .Filter(".k-grid-edit")
        .ContentHandler("getTooltipContent")
    )
    <script type="text/javascript">
        function getTooltipContent(e) {
            var row = e.target.closest("tr");
            var grid = $("#grid").getKendoGrid();
            var item = grid.dataItem(row);
            return "Edit " + item.UserFirstName ;
        }
    </script>


    Regards,
    Alexander Popov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Mike
    Mike avatar
    16 posts
    Member since:
    Feb 2014

    Posted 08 Aug 2014 in reply to Alexander Popov Link to this post

    Thanks, that worked great.
Back to Top