This is a migrated thread and some comments may be shown as answers.

I can't make ajax editing working

4 Answers 64 Views

Grid

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Guillaume asked on 04 Mar 2010, 08:32 PM

When I click on an Edit button, the whole page is reloaded (with some unpleasant side effects on paths : it can't find anymore my images in /contents/icons because it looks for them in Administration/Index/contents/icons (administration is my "parent" controller (I'm using renderaction to display Terme/Index in a contenttemplate, and from this view I'm using Renderpartial to display the grid).
Edit textboxes and Update/cancel button appears , but the buttons do not work.
I must have made a stupid mistake, but I can't see where.
This is my view (so, it's a partial one, rendered by RenderPartial)

    
            <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Waldesk_MVC.Models.TermeModels+TermesModel>" %> 
        
            <div id="divGrid" style="width:600px"> 
        
            <%= Html.Telerik().Grid(Model.TermeList) 
        
                    .Name("Termes") 
        
                         .DataBinding(dataBinding => dataBinding 
        
                                .Ajax() 
        
                                    .Select("Select", "Terme") 
        
                                    .Insert("Ajouter", "Terme") 
        
                                    .Update("Sauver", "Terme") 
        
                                    .Delete("Effacer", "Terme") 
        
                        ) 
        
                    .DataKeys(keys => keys.Add(t=>t.ID)) 
        
                    .Toolbar(commands => commands.Insert()) 
        
                    .Columns(columns => 
        
                    { 
        
                        columns.Bound(t=>t.TexteCourt).Width(100); 
        
                        columns.Bound(t=>t.TexteLong).Width(320); 
        
                        columns.Command(commands => 
        
                        { 
        
                            commands.Edit(); 
        
                            commands.Delete(); 
        
                        }).Width(180); 
        
                    }) 
        
                    .Pageable() 
        
                    .Sortable() 
        
            %> 
        
            <% Html.Telerik().ScriptRegistrar().OnDocumentReady("$('.insert-button').click(function(e) { e.preventDefault(); $('#Termes').data('tGrid').createRow();  }); "); %> 
        
            </div>

I'm thinking I'm messing things with my RenderAction and RenderPartial, or some javascript is not found when needed.
The Html.Telerik().ScriptRegistrar() is done on the master page.
Is it a problem to have both jquery 1.3.2 and 1.4.1 on the same page ?

4 Answers, 1 is accepted

answered on 05 Mar 2010, 10:43 AM

So, I remove the jquery version I was including in the header, now, there's just the one from <%= Html.Telerik().ScriptRegistrar() %>
Scripts present :
header :

    <script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
    <script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

bottom :
<script type="text/javascript" src="/Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="/Scripts/telerik.common.min.js"></script>
<script type="text/javascript" src="/Scripts/telerik.grid.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="/Scripts/telerik.grid.editing.min.js"></script>

It's still not working, stil the same problem (whole page reloaded with wrong page and non functionning edit button (the cancel one works => but still reload the whole page)

This is my MasterPage :

    
            <%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
                <title> 
        
                    <asp:ContentPlaceHolder ID="TitleContent" runat="server" /> 
        
                </title> 
        
                <script src='<%=Links.Scripts.MicrosoftAjax_js %>' type='text/javascript'></script> 
        
                <script src='<%=Links.Scripts.MicrosoftMvcAjax_js %>' type='text/javascript'></script> 
        
                  <% Html.Telerik().StyleSheetRegistrar() 
        
                    .DefaultGroup(group => group.Add("telerik.common.css") 
        
                                                .Add("telerik.web20.css")).Render(); %> 
        
              <link href='../../Content/Site.css' rel="stylesheet" type='text/css' /> 
        
            </head> 
        
            <body> 
        
                <div class="page"> 
        
                    <div id="header"> 
        
                        <div id="title"> 
        
                            <h1><%= Html.ActionLink("Start", "Index", "Home")%></h1> 
        
                        </div> 
        
                        <div id="logindisplay"> 
        
                            <% Html.RenderPartial("LogOnUserControl"); %> 
        
                        </div> 
        
                    </div> 
        
                    <div id="main"> 
        
                        <asp:ContentPlaceHolder ID="MainContent" runat="server" /> 
        
                        <div id="footer"> 
        
                        </div> 
        
                    </div> 
        
                </div> 
        
                   <%= Html.Telerik().ScriptRegistrar() %> 
        
            </body> 
        
            </html>

MainContent is filled by the Index Action, which then call Render action to put this view from another controller in a specific div (of the index view)

    
            <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Waldesk_MVC.Models.TermeModels+IndexModel>" %> 
        
            <div> 
        
                <h1> 
        
                    Termes</h1> 
        
                <div id="ChoixTermes"> 
        
                    <%using (Ajax.BeginForm("Afficher", new AjaxOptions { UpdateTargetId = "GrilleTerme", OnComplete = "onComplete" })) 
        
                      {%> 
        
                    <%=Html.DropDownList("Choice", Model.Choices, new { Style="width:200px" })%> 
        
                    <input type="submit" value="Display" title="Display" /> 
        
                    <%}%> 
        
                </div> 
        
                <div id="GridTerme"> 
        
                <%Html.RenderAction("DisplayGrid",new {choixTermes=Model.ChoixTermes[0].Value}); %> 
        
                </div> 
        
            </div>

So, when creating my index page, I have the main view "rendering action" for an another controller which then "renders action" to display the grid.
I'm wondering if that not a bit too much complicated.

answered on 05 Mar 2010, 11:39 AM

Hi Guillaume JAY,

It seems you display the grid with ajax. Is this the case? If yes there is additional work required to get the grid working as its initialization JavaScript is not properly executed. You can check this forum thread for some tips and working project.

If this ain't the case - please provide a working example showing your problem. You can send it to atanas.korchev at telerik.com.

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.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

I can't make ajax editing working

4 Answers, 1 is accepted