[Solved] Telerik Grid Control with Edit link button

[Rama]

I have used Telerik grid control with filter and sort option. A Edit link column is also provided. When click on the edit link it works normally. It allows me to make changes and save. In case if I use filter option to filter the list and click on the edit link (on the filtered list). It results in an error.Could you tell me what could be the problem and also how to correct the problem

[Deyan]

Hello Rama,

Thanks for contacting us.

It seems that the question you are posting is not targeting the RadControls for Windows Phone 7 suite. Could you please specify which control are you exactly using so that we can redirect your inquiry to the proper suppport team?

Thanks for your understanding.

Greetings,
Deyan
the Telerik team

[Rama]

I am talking about ASP.NET MVC Telerik grid control. I could not log the message under this section.
I state the problem once again.
I have used Telerik grid control ( ASP.NET MVC ) with filter and sort option. A Edit link column is also provided. When click on the edit link it works normally. It allows me to make changes and save. In case if I use filter option to filter the list and click on the edit link (on the filtered list). It results in an error object not found.Could you tell me what could be the problem and also how to correct the problem.

I am using MVC 2.0.
On click of the edit link button we are actually calling jQuery dialog box. At this point the program fails. The error says the object is not avaialble. This happens when the filter is on. As soon as the filter is cleared, it works perfectly

Looking forward for the solution
Best Regards
-Rama G-

[Atanas Korchev]

Hi Rama,

 This is not a known issue and we are not sure how to reproduce it locally. Could you attach a sample project  so we can check it?

Kind regards,
Atanas Korchev
the Telerik team

[Rama]

I think the following attachment  with the screen shots makes it clear what is the problem
I have a table with few columns, I am displaying its contents using the Telerik Grid control (MVC). The grid also contains link for Edit and Remove

When I click on the edit it open up jQuery edit dialog and allows us to edit the content and save it.
All the columns are filterable. I filter the list on the first column. I see the results that matches the condition. Now I click oh edit link for one of the records. It throws an exception.
I clear the filter, I click on the edit link, it works fine

Please find attached the word document with screen shots.

Following is the code written in the view

 

<P><%@ Page Title="" Language="C#"
MasterPageFile="~/Views/Shared/Site.Master"
Inherits="System.Web.Mvc.ViewPage<IEnumerable<ResourceKit.DataModel.Content>>"
%><BR><%@ Register src="TerminologyMenu.ascx" tagname="TerminologyMenu"
tagprefix="uc1" %><BR><%@ Import Namespace="MvcContrib.UI.Grid"
%><BR><%@ Import Namespace="MvcContrib.UI.Pager" %><BR><%@ Import
Namespace="MvcContrib.Pagination" %><BR><%@ Import
Namespace="Telerik.Web.Mvc.UI" %><BR> <BR><asp:Content ID="Content1"
ContentPlaceHolderID="TitleContent"
runat="server"><BR> List<BR></asp:Content></P>
<P><asp:Content ID="Content3" ContentPlaceHolderID="SubNavigationContent"
runat="server">   <BR>    <uc1:TerminologyMenu
ID="TerminologyNavigation" runat="server"
/><BR></asp:Content></P>
<P><BR><asp:Content ID="Content2" ContentPlaceHolderID="MainContent"
runat="server"><BR> <BR>    <h2> List
Terminology</h2></P>
<P> <% var pagerStyleFlags = new[]<BR>    {
<BR>        new { Key = "pageInput", Value =
GridPagerStyles.PageInput },<BR>        new {
Key = "nextPrevious", Value = GridPagerStyles.NextPrevious
},<BR>        new { Key = "numeric", Value =
GridPagerStyles.Numeric }<BR>    };<BR>
GridPagerStyles pagerStyles =
GridPagerStyles.NextPreviousAndNumeric;<BR>    foreach (var
pagerStyleFlag in pagerStyleFlags)<BR>
{<BR>        bool pagerStyle =
(bool)ViewData[pagerStyleFlag.Key];<BR>
if (pagerStyle == true)<BR>
{<BR>
pagerStyles |=
pagerStyleFlag.Value;<BR>
}<BR>
else<BR>
{<BR>
pagerStyles &=
~pagerStyleFlag.Value;<BR>
}<BR>    }</P>
<P> Html.Telerik().Grid(Model.OrderByDescending(et=>et.Updated)).Name("Terminology").Columns(column
=><BR>   {<BR>
column.Bound(content => content.Terminology.Name).Template(content =>
Html.ActionLink(content.Terminology.Name.Trim(), "Details", new { id =
content.Terminology.ID
})).Title("Terminology").Width(100);<BR>
column.Bound(content => content.Data).Template(content =>
content.Data.Trim()).Title("Text").Width(300);<BR>
column.Template(content => Html.ActionLink("Edit", "#", new { termid =
content.ID }, new { onclick = "editContentDialog(" + content.ID + "); return
false;" })).Title("Action").Width(20);<BR>
column.Bound(content =>
content.Terminology.Created).Title("Created").Width(150);<BR>
<BR>       //column.Template(content =>
Html.ActionLink(content.Terminology.TerminologyCategories.FirstOrDefault(et
=> et.TerminologyID == content.Terminology.ID).Category.Name,
"CategoryTerminologies", new { id =
content.Terminology.TerminologyCategories.FirstOrDefault(et =>
et.TerminologyID == content.Terminology.ID).Category.ID
})).Title("Categories").Width(100);<BR>
column.Template(content => Html.ActionLink("Remove", "Softdelete", new { id =
content.Terminology.ID }, new { onclick = "javascript:return confirm('Are you
sure you want to delete this item?')"
})).Width(30);<BR>       column.Bound(content
=> content.Updated).Title("Updated");<BR>
}).DetailView(detailView => detailView.Template(e
=><BR>
{<BR>
%><BR>
<%
Html.Telerik().Grid(e.Terminology.TerminologyCategories)<BR>
.Name("Terminology.TerminologyCategories_" +
e.TerminologyID)<BR>
.Columns(columns
=><BR>
{
<BR>
columns.Template(c => Html.ActionLink(c.Category.Name,
"CategoryTerminologies", new { id = c.Category.ID })).Title("Category
Name");<BR>
})<BR>
.Pageable(paging =>
paging.PageSize(10))<BR>
.Sortable()<BR>
.Render();<BR>
<BR>
%><BR>
<% <BR>
})).Sortable()<BR>
.Pageable(paging=>paging.PageSize(25).Style(pagerStyles).Position(GridPagerPosition.Both))<BR>
.Filterable()<BR>     .Render();<BR>   %></P>
<P> <div id="dialog-modal" title="Edit Terminology"
class="display:hidden"><BR> <BR></div></P>
<P></asp:Content><BR></P>

[Atanas Korchev]

Hi Rama,

 I am afraid the screenshots are not helpful. We need a runnable project which we can troubleshoot. We can't help unless we reproduce the JavaScript error locally.

Regards,
Atanas Korchev
the Telerik team

[Rama]

Find the attachement, with the source code and the SQL server db backup file.
Run the sample application. Go to the menu test page to see the telerik grid with 2 records
Click on one of the edit links, it opens up jQuery edit dialogbox. close the edit dialog box.
Use the filter in one of the columns and filter the data based on some conditions.
Now click on the edit link. It results in error. I have used the IE 8. It works fine in Mozilla
Hope this would help to identify what the problem is and give us the solution


Regards
-Rama G-

[Atanas Korchev]

Hi Rama,

 The problem happens because of this line:

data: { id: id, redirectTo: '<%=HttpContext.Current.Request.Url.PathAndQuery%>' },

When you filter the grid by a string value the query string will contain single quotes which will cause invalid JavaScript declaration - nested single quotes. Changing the code to (replaced single quotes with double quotes):

data: { id: id, redirectTo: "<%=HttpContext.Current.Request.Url.PathAndQuery%>" },

will solve the problem.

I am sending the updated project.

Regards,
Atanas Korchev
the Telerik team

[Rama]

Thanks a lot for the timely solution. I was not able to trace the problem

Thanks again
Regards
-Rama G-