Clientside Events Not Registering

[AMS]

  <div class="gridViewOuter">
        <h1>
            Search Results</h1>
            <%Html.Telerik().Grid(Model)
                .Name("Grid")
                .DataKeys(keys => { keys.Add(up => up.ProfileID); })
                .Columns(columns =>
                    {
                          columns.Template(up =>
                    {
                        %>
                          <%=Html.ActionLink(up.LastName + ' ' + up.FirstName, "UserProfile", new { selectedUser = up.Username })%>
                          <%}).Title("Full Name");
                        columns.Bound(up => up.Username);
                        columns.Bound(up => up.Email);
                        columns.Bound(up => up.IsActive);

                    })


                .ClientEvents(events => events
                .OnDataBinding("onDataBinding")
                .OnRowSelected("onRowSelected")
            )
            .Pageable(paging => paging.PageSize(4))
            .Sortable()
            .Selectable()
            .Filterable()
            .Render();
            %>
</div>

 <script type="text/javascript">

            function onRowDataBound(e) {
                alert("row");
            }

            function onDataBinding(e) {
                alert("hello");
            }

            function onRowSelected(e) {
                debugger;
                var row = e.row;

                //$console.log("OnRowSelected :: " + row.cells[0].innerHTML);
            }


        </script>

Hi
I am using a grid which has client side events. I want to call some functionality on onRowSelected, however when i tested, it seems to be that these events are not being called. Any idea what am i doing wrong?

[IQworks]

Hi Abbid, 
     Here are some snippets from my code for onRowSelected  ....

               .Selectable()
               .ClientEvents(events => events.OnRowSelected("OnRowSelected"))
               .ClientEvents(events => events.OnRowDataBound("OnRowDataBound"))

and the javascript is

function OnRowDataBound(e) {
     var customerN = e.row.cells[0].innerHTML;
     alert("Row is DataBound e " + customerN);
 }

     
    Maybe it will work for you.

    iqworks

[AMS]

Hi
Thanks for your reply. Actually the problem was not in my code, but it was in ScriptRegistrar(). I have changed it and it is working now. Thanks for your precious time again.

[Jack Ma]

Hi Abbid,

    I have same client events not invoked problem, how did you fix it? Could you share it with me? Thanks in advance.

Jack

[AMS]

Hi Jack
Actually i was using
<%Html.Telerik().ScriptRegistrar()%> in the start of site.Master due to which it was not registering those events. Please check and add it at the end of the Site.Master like this (at the last line)






<div id="main">
            <asp:ContentPlaceHolder ID="MainContent" runat="server" />
            <div id="footer">
            </div>
        </div>
    </div>
    <%Html.Telerik().ScriptRegistrar() %>
</body>

[Atanas Korchev]

Hi Jack Ma,

You can check the troubleshooting help topic which explains why client events may not fire.
Also you can check the client-side selection example which shows the scenario you are after.

I would like to also ask you to post in a single thread only. Posting to a lot of threads will not resolve your problem.

Greetings,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jack Ma]

Hi Abbid,

    Thanks a lot for your reply!

   Actually, I've registered the js file in the site.master already. Now I've found the my problem is caused by the javascript which define the function 'onRowSelected' has an error and caused this function could not be invoked. 

   Though I've found the problem, but one thing I'm sufferring is I want to retrieve the myentity.id which the entity is bound to the grid but not shown in the grid. Do you have similiar scenario? if yes, how do you archive this?

Regards

Jack

[Atanas Korchev]

Hi Jack Ma,

This has been answered in this forum thread.

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jack Ma]

Hi Atanas,

    Thank you for your suggestion. 

    I think I've found my root cause. Now I'm trying to retrieve a 'ID' value which is not shown on the grid neither is a hidden field. Can I have any way to retrieve it? I know when 'insert' and 'update' method invoked and the entity object will be bring into the controller and at there I can access the whole entity item, but if in the javascript, is there anyway I can access the entity's property(the entity is bound to the grid)? I've tried to use a hidden field, but it's behavior is kind of odd, when page load, the field is hidden, but once i click any edit button, the hidden field will be shown. That's not good. Your suggestion is very appreciated!

Regards

Jack 

[Atanas Korchev]

Hi Jack Ma,

The solution to this problem is to use the rowDataBound event. Check the forum thread linked in my previous reply. The other option if you are using editing is this:

var grid = $('#Grid').data('tGrid');
//row is the HTML DOM element representing the TR of interest.
var dataItem = grid.dataItem(row);

var id = dataItem.ID;

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jack Ma]

Hi Atanas,

    I tried with your optional code, and it does work, the only change I did is to replace the row with 'e.row' in the onRowSelected function, now the left thing is how can I know whether the grid is in edit mode or not? Sorry for my stupid question, I'm a fresh guy on web.  Appreciate once again!

Regards

Jack

[Atanas Korchev]

Hi Jack Ma,

Currently there is no public API for this so we should rely on jQuery:

if ($('#Grid .t-edit-container').length) {
       // in edit mode
} else {
      // not in edit mode
}

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Jack Ma]

Hi Atanas,

    Ooh! That's good enough. Thank you very much! You're super super! Have a nice day!

    By the way, I'm trying to use the OnRowDataBound event to set the checkbox state in the grid and I wrote something like 

    function onRowDataBound(e) {
        var dataItem = e.dataItem;
        var $checkbox = $(e.row).find(':checkbox');
        $checkbox.val(dataItem.Isactive);
        if (dataItem.Isactive) {
            $checkbox.attr('checked', true);
    }

this does not work at all, but I don't know what's the problem is, can you give you advance? 

Regards

Jack