[Solved] Grid in-line editing error

[Howard]

Dear Telerik Team,

I have a grid and want to do in-line editing. I've a dropdownlist in one of the columns. I have accomplished most of the functionality but missed the final part. When you click on Update, it saves the data but gives an error "The requested URL did not return JSON". When I debug, the process doesn't enter in GridAction process. May be I'm missing something.

//This is edit controller

[AcceptVerbs(HttpVerbs.Post)]      

        [GridAction]

        public ActionResult _FleetFuelCardSave(int Id, int Supplier)

        {           

            EditFleet _editFleet = new EditFleet();

 

            FleetFuelCardQueryModel _fleetFuelRecord = _editFleet.FleetFuelCardEdit(Id).First();

 

            _fleetFuelRecord.SUPPLIER_ID = Supplier;

 

            TryUpdateModel(_fleetFuelRecord);

 

            _editFleet.FleetFuelCardSave(Id, _fleetFuelRecord);

 

            return RedirectToAction("FleetFuelCard", "Fleet", new { Id = _fleetFuelRecord.ID });           

        }

// This is enquire Controller

public ActionResult FuelCard(Int32 Id)
        {
            ViewData["ID"] = Id;

            try
            {
                Select _select = new Select();

                var _FuelCard = _select.FuelCard(Id).First();

                ViewBag.Suppliers = new ReferencesFiles().Supplier();

                return PartialView("_FuelCard", _FuelCard);
            }
            catch (InvalidOperationException ex)
            {
                string str = ex.Message;
                return PartialView("_FuelCard");
            }
        }

        [GridAction]
        public ActionResult _FuelCard(Int32 Id)
        {
            Select _select = new Select();

            var _FuelCard = _select.FuelCard(Id);

            foreach (var item in _FuelCard)
            {
                item.LOST_DATE = item.LOST_DATE.FormatToCultureDate();
                item.EXPIRY_DATE = item.EXPIRY_DATE.FormatToCultureDate();
            }

            return PartialView(new GridModel { Data = _FuelCard });
        }

// This is the view

@model  FuelCardQueryModel

             <script type="text/javascript">
                 function onEdit(e) {
                     $(e.form).find('#Supplier').data('tDropDownList').select(function (dataItem) {
                         return dataItem.Value == e.dataItem['SUPPLIER_ID'];
                     });
                 }
    </script>

@(Html.Telerik().Grid<FuelCardQueryModel>()
            .Name("LogTransactions")
            .Sortable(sorting => sorting.Enabled(true))
            .Pageable(paging => paging.Enabled(true).PageSize(10))
            .Footer(true)
            .DataKeys(keys => keys.Add(f => f.FUEL_CARD_ID))
            .DataBinding(dataBinding => dataBinding.Ajax().Select("_FuelCard", "Fleet", new { Id = ViewData["ID"] })
                                                          .Update("_FuelCardSave", "FleetEdit"))
            .Reorderable(reorder => reorder.Columns(true))
            .Columns(columns =>
                {
                    columns.Bound(f => f.ID_SEQ).Title("Seq");
                    columns.Bound(f => f.SUPPLIER_ID).Title("Supplier name").ClientTemplate("<#=SUPPLIER_NAME #>");
                    columns.Bound(f => f.FUEL_CARD_NUMBER).Title("Card no");
                    columns.Bound(f => f.PIN_NO).Title("Pin no");
                    columns.Bound(f => f.EXPIRY_DATE).Title("Expiry");
                    columns.Bound(f => f.VALID).Title("Valid").ClientTemplate("<input type='checkbox' disabled='disabled' name='Discontinued' <#= VALID?checked='checked':'' #> />");
                    columns.Bound(f => f.LOST_DATE).Title("Lost date");
                    columns.Command(commands =>
                    {
                        commands.Edit().ButtonType(GridButtonType.Text);

                    }).Width(200).Title("Commands");
                })
            .Editable(editing=>editing.Mode(GridEditMode.InLine))
            .ClientEvents(events=>events.OnEdit("onEdit"))
)

//This is the editor template
@(Html.Telerik().DropDownList()
        .Name("Supplier")
        .BindTo(new SelectList((System.Collections.IEnumerable)ViewBag.Suppliers, "SUPPLIER_ID", "SUPPLIER_NAME"))
)

// This is the model

public class FuelCardQueryModel
    {
        public int FUEL_CARD_ID { get; set; }
        public string FUEL_CARD_DESCRIPTION { get; set; }
        public int ID_SEQ { get; set; }
        [UIHint("_Supplier"), Required]
        public int SUPPLIER_ID { get; set; }
        public string SUPPLIER_NAME { get; set; }
        public string FUEL_CARD_NUMBER { get; set; }
        public string PIN_NO { get; set; }
        public string EXPIRY_DATE { get; set; }
        public bool VALID { get; set; }
        public string LOST_DATE { get; set; }
    }

Any help will be greatly appreciated.

Thank you

[Petur Subev]

Hello Niroj,

While examining your code I noticed that the configuration for Ajax Bound Grid is not correct.

In your view you did not specify Update Action (only the select present). Also the update action method does a RedirectToAction which is not supported.
To properly configure your Grid for Editing using Ajax Binding please take a detailed look at this demo or follow the steps in our documentation. 

Best wishes,
Petur Subev
the Telerik team

[Howard]

Thank you Petur for your reply. Your are right, it was RedirectToAction that was causing the problem, I changed to this code "return PartialView(new GridModel { Data = _fuelCardQuery });" and it worked like a charm.

Cheers