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

[Solved] Grid inside jquery dialog

0 Answers 10 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.
Ljupco
Top achievements
Rank 1
Ljupco asked on 07 Dec 2012, 12:03 AM
Hi I have place a telerick grid inside a jquery dialog. It works if I don't include Toolbar commands Insert.

VIEW

      <% Html.Telerik().Grid<Insurance.Web.Models.Employee.RowModels.QuoteItemRow>()
      .Name("grdSplitWI")
      .DataKeys(dataKeys =>
          {
              dataKeys.Add(x => x.ServiceRequestID);                            
              dataKeys.Add(x => x.WorkInstructionID);
          })
        .ToolBar(commands =>
        {
            commands.Insert();
        })
      .Columns(c =>
      {
          c.Bound(x => x.WorkInstructionID).Width(100).HeaderHtmlAttributes(new { style = "font-weight: bold" });
          c.Bound(x => x.ItemCode).Encoded(false).Width(100).HeaderHtmlAttributes(new { style = "font-weight: bold" });
      })
      .DataBinding(d =>
      {
          d.Ajax().Select("_SelectItemSplitList", "ServiceRequest")
                .Insert("_InsertItemSplitList", "ServiceRequest")
                .Update("_UpdateItemSplitList", "ServiceRequest");
      })
      .SetDefaults()    
      .Groupable(x => x.Enabled(false))
      .Pageable(x => x.PageSize(10, new[] { 25, 50, 75, 100, 250, 500 }).Style(GridPagerStyles.NextPreviousAndInput | GridPagerStyles.Numeric | GridPagerStyles.PageSizeDropDown | GridPagerStyles.Status).Position(GridPagerPosition.Bottom))
      .Scrollable(x => x.Height(300))
      .Render();
  %>

JAVASCRIPT OPENS DIALOG

    function bindShowWorkInstructions(grid) {

        $('a.show-item, a.item-note', grid).click(function () {

            var a = $(this);
            a.parents('td').click(); // select row in telerik grid

            selectedItemId = a.attr('rel');

            createDialog(
            {
                url: '/Employee/ServiceRequest/SplitWorkInstructionModelView',
                params: { serviceRequestID: $('#ServiceRequestID').val(), workInstructionID: a.attr('rel') },
                height: 700,
                width: 900,
                onShow: function (dialog, result) {
                    console.log('hi');
                    //$('#simplemodal-container').addClass('item-detail-tabs');
                },
                onClose: function (dialog) {
                    reloadGrid(1);
                }
            });
        });
    }

CONTROLLER

        [HttpPost]
        public ActionResult SplitWorkInstructionModelView(long serviceRequestID, long workInstructionID)
        {
            SplitWorkInstructionModel model = new SplitWorkInstructionModel(serviceRequestID, workInstructionID);
            return PartialView("Quote/Overlays/SplitWorkInstruction", model);
        }


AJAX BINDING CONTROLLER

        [HttpPost]
        [GridAction]
        public ActionResult _SelectItemSplitList(long? serviceRequestID, long? workInstructionID)
        {
            SplitWorkInstructionModel model = new SplitWorkInstructionModel(serviceRequestID.GetValueOrDefault(-1), workInstructionID.GetValueOrDefault(-1));
            model.Load(string.Empty, new MvcContrib.UI.Grid.GridSortOptions(), 1);
            return View(new GridModel(model.GridData));
        }

ERROR

Load spins, with this error in firebug

TypeError: b[this.plugins[q]] is undefined
...asClass("t-arrow-first")){r=1}else{var q=n.text();if(q=="..."){var p=n.parent()....


If I removed
        .ToolBar(commands =>
        {
            commands.Insert();
        })
the grid loads.

Any ideas ?

Tags
Grid
Asked by
Ljupco
Top achievements
Rank 1
Share this question
or