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

[Solved] While using ajax binding, how do you code a column to do an ajax delete ?

7 Answers 165 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.

IQworks asked on 02 Mar 2010, 07:12 PM

Hi,
I have ajax binding going on in this grid ....

    
            <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<BCAnalytics.Models.CompanyVM>>" %> 
        
               <p><%= Html.ActionLink((String)Resources.BCAResources.stdClose, "Index", "Work", new { workindex = 0 }, null)%>   
        
                <%=Session["iqResult"]%></p>  <br />    
        
                    <%= Html.Telerik().Grid(Model)  
        
                          .Name("CompanyGrid")  
        
                          .Columns(columns => 
        
                            {  
        
                                 columns.Add(o => o.cMemberNo).Width(30) ;  
        
                                columns.Add(o => o.cCompanyNo).Width(30);  
        
                                columns.Add(o => o.cCompanyName).Width(175).Title((string)Resources.BCAResources.coxCompany);  
        
                                columns.Add(o => o.cPhone).Title((string)Resources.BCAResources.stdPhone).Width(75);  
        
                                columns.Add(o => o.cGroupCode).Title((string)Resources.BCAResources.coxGroupCode).Width(100);  
        
                                columns.Add(o => o.cEmail).Width(120).Title((string)Resources.BCAResources.stdEmail).Width(150);  
        
                                columns.Add(o => o.cDateUpdated).Format("{0:MM/dd/yyyy}").Width(85).Title((string)Resources.BCAResources.stdUpdated);  
        
                                columns.Add(o => o.cCompanyNo).Format(Html.ActionLink((String)Resources.BCAResources.stdEdit, "Index", "Work", new { workindex = 3, OtherParms = "{0}" }, null).ToString()).Encoded(false).Title("").Width(32);  
        
                               // columns.Add(o => o.cCompanyNo).Format(Ajax.ActionLink("Del", "CompanyDelete", new { Id = "{0}" }, new AjaxOptions { UpdateTargetId = "CompanyGridr" })).Encoded(false).Title("").Width(50);  
        
             // columns.Add(o => o.cCompanyNo).Format(Ajax.ActionLink("Del", "CompanyDelete", new { Id = "{0}" },   
        
             //  new AjaxOptions() {}).ToString().Replace("{", "{{").Replace("}", "}}")).Encoded(false).Title("").Width(50);   
        
             //  columns.Add(o => o.cCompanyNo).Format(Html.ActionLink((String)Resources.BCAResources.stdDelete,"CompanyDelete", new { Id = "{0}" }, null).ToString()).Encoded(false).Title("").Width(50);  
        
                                columns.Add(o => o.cCompanyNo).Format(Html.ActionLink((String)Resources.BCAResources.stdDelete, "CompanyDelete", new { Id = "{0}" }, new { @class = "t-link action-delete" }).ToString()).Encoded(false).Title("").Width(50);  
        
                            })  
        
                           .Ajax(settings => settings.Action("_AjaxBindingCompany", "Company"))  
        
                           .Pageable()  
        
                           .Sortable(sort => sort.SortMode(GridSortMode.MultipleColumn))  
        
                           .Scrollable(scrolling => scrolling.Height(265))  
        
                           .Filterable() %>    
        
                   <p><%= Html.ActionLink((String)Resources.BCAResources.coxFormEntry, "Index", "Work", new { workindex = 2, OtherParms = "" }, null)%></p>

This is my delete action ...

    
               public ActionResult CompanyDelete(int? Id)  
        
                    {  
        
                        BCAEntities _dataModel = new BCAEntities();  
        
                        int MemberNo = Convert.ToInt32(Session["MemberNo"].ToString());  
        
                        var CompanyToDelete = (from m in _dataModel.Company  
        
                                               where m.coMemberNo == MemberNo &&  
        
                                                m.coCompanyNo == Id  
        
                                              select m).First();  
        
                        if (CompanyToDelete != null)  
        
                        {  
        
                          try  
        
                            {   
        
                            _dataModel.DeleteObject(CompanyToDelete);  
        
                            _dataModel.SaveChanges();  
        
                            }  
        
                          catch (Exception exc)  
        
                            {  
        
                           Session["iqResult"] = "Problem deleting this entry, support has been notified";  
        
                            }  
        
                        }  
        
                        return View("Index");  
        
                       // return RedirectToAction("Index", "work", new { workindex = 1, OtherParms = "" });  
        
                    }

This is my AjaxBindingCompany action ...

    
                // do the ajax binding  
        
                    [GridAction]  
        
                    public ActionResult _AjaxBindingCompany()  
        
                        {  
        
                        IEnumerable<CompanyVM> model = GetCompanies();  
        
                        return View(new GridModel  
        
                        {  
        
                            Data = model 
        
                        });  
        
                        }  
        
                    // load the viewmodel data  
        
                    private IEnumerable<CompanyVM> GetCompanies()  
        
                    {  
        
                        BCAEntities bcaData = new BCAEntities();  
        
                        int wkMemberNo = Convert.ToInt32(Session["MemberNo"].ToString());  
        
                        return from o in bcaData.Company  
        
                               where (o.coMemberNo==wkMemberNo)  
        
                               select new CompanyVM()   
        
                               {  
        
                                   cMemberNo = o.coMemberNo,  
        
                                   cCompanyNo = o.coCompanyNo,  
        
                                   cCompanyName = o.coCompanyName,  
        
                                   cEmail = o.coEmail,  
        
                                   cGroupCode = o.coGroupCode,  
        
                                   cPhone = o.coPhone,  
        
                                   cDateUpdated = o.coDateUpdated  
        
                               };  
        
                    }

   I am confused as to how I should process the delete column.
   I want to set up my delete column so that when it is clicked, it shows a confirmation box, and, when it runs the action to do the delete, the screen needs to simply display without the deleted record (ajax).
   My confusion lies in whether
1) I should code an ajax.actionlink in the column which just calls my std delete action and redisplays the grid (not sure how to redisplay either) ?
2) I should code the ajax.actionlink to include the "Ajax(settings => settings.Action("_AjaxBindingCompany", "Company")) " as a parameter somewhere inside the ajax.actionlink ?
3) Or, should I be using an HTML.Actionlink for this with new { @class = "t-link action-delete" }) ?

    I tried variations of all 3 but I think I may just be using the wrong syntax. i would like to use the Ajax.ActionLink for the delete, but I dont know if its more appropriate to use the HTML.Action in an ajax binding scenerio ?

   thanks as always

7 Answers, 1 is accepted

answered on 03 Mar 2010, 08:56 AM

Hello IQworks,

Rebinding the grid using Ajax.ActionLink may not be an easy task. You can check this forum thread for a working example of using the grid with ASP.NET MVC Ajax. It would be easier to do Html.ActionLink delete - the grid will rebind itself automatically. However I suggest you check the newly introduced editing here. Editing support was added in the Q1 2010 futures release and will go official soon.

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.

answered on 03 Mar 2010, 03:11 PM

Hi,
Thanks for the suggestion about Q1 2010, I am anxious to download and try.
In the mean time, when you say that "HTML.ActionLink delete" would be more appropriate in my case, does this require a different option or signiture than the following ?

columns.Add(o => o.cCompanyNo).Format(Html.ActionLink( "Delete",

"CompanyDelete", new { Id = "{0}" }, null).ToString()).Encoded(false).Title("").Width(50);
I can see that Q1 2010 is most likely the solution, but is there a sample or a way I might see how this "HTML.ActionLink delete" works ? Right now, my delete action recreates the page (so no ajax) after the database delete. So, I am trying to understand how ""new { @class = "t-link action-delete" })"" and the existing ""Ajax(settings => settings.Action("_AjaxBindingCompany", "Company"))"" should be working together ?
My last question is , In Q1 2010, will this scenerio .....

    
            Specify the action methods which will delete, insert or save data records.   
        
            <%= Html.Telerik().Grid(Model)  
        
                    .Name("Grid")  
        
                    .Toolbar(commands => commands.Insert())  
        
                    .DataKeys(keys => keys.Add(c => c.CustomerID))  
        
                    .DataBinding(dataBinding => dataBinding  
        
                        .Ajax()  
        
                            .Select("EditingServerSide", "Grid")  
        
                            .Insert("Insert", "Grid")  
        
                            .Update("Save", "Grid")  
        
                            .Delete("Delete", "Grid"))  
        
                    .Columns(columns => 
        
                    {  
        
                        //omitted for brevity  
        
                    })

work WITH this "".Ajax(settings => settings.Action("_AjaxBindingCompany", "Company"))"" processing ? (of course this is what I am using mainly for my paging)

thanks again.

answered on 03 Mar 2010, 03:20 PM

Hello IQworks,

When the user clicks the delete link - the record will get deleted. Then you must call RedirectToAction and pass the action which renders the grid initially as shown in this example:

public ActionResult Delete(string id)
{
   IList<CustomerDto> customers = GetEditableCustomers();
   CustomerDto customer = (from c in GetEditableCustomers()
                                    where c.CustomerID == id
                                    select c).FirstOrDefault();
    if (customer != null)
    {
        customers.Remove(customer);
    }

    return RedirectToAction("Editing");
}

The grid will continue to work as expected and use ajax for paging, sorting etc.

DataBinding(dataBinding => dataBinding .Ajax() .Select("Action", "Controller") )
is the same as:

Ajax( settings => settings.Action("Action", "Controller"))

The latter will still work in Q1 2010 but is obsolete. We made the latter obsolete however and will remove it in the next major release.

Regards,
Atanas Korchev
the Telerik team