DropDownList in ClientTemplate not initializing in Grid

2 posts, 0 answers
  1. Stan
    Stan avatar
    1 posts
    Member since:
    Aug 2015

    Posted 17 Oct Link to this post

    I have attached a screen shot of the view that is rendering. I want to display a dropDownList in the Service Provider column that is dependent on the value selected in the Profiled Status column. So, if Royal Expedite is selected in the Profile Status column I would display a drop down with one set of values, and if Royal Expedite was selected in Profile Status I would display a different drop down with it's own set of values, etc. The problem is when the view is rendered the DropDownList is not initializing in the Service Provider column. In its place is a blank text box. 

     

    Here is the action method to render the view:

    public ActionResult ScheduleRoyalLogistics(Guid trackingCode)
            {
                var transientFile = _uploadFileService.GetUploadFileByTrackingCode(trackingCode);
                var awaitingScheduleRelation = _dropShipFileRelationService.GetByDropShipTrackingCode(trackingCode);

                var dropShipRelation = awaitingScheduleRelation == null
                    ? _dropShipFileRelationService.GetBySenderFileId(transientFile.FileId).ToList()
                    : _dropShipFileRelationService.GetByOffsetFileId(awaitingScheduleRelation.OffsetFileId).ToList();

                var uploadFile = _uploadFileService.GetUploadFileByFileId(dropShipRelation.First().OffsetFileId) ??
                                 _uploadFileService.GetUploadFileByFileId(dropShipRelation.First().SenderFileId);

                var dropShipTypes = new List<DropShipTypeDropDown>();
                foreach (var dropShipType in Enum.GetValues(typeof(DropShipTypeEnum)))
                {
                    dropShipTypes.Add(new DropShipTypeDropDown()
                    {
                        DropShipTypeId = (int) dropShipType,
                        DropShipTypeName = Enum.GetName(typeof(DropShipTypeEnum), (int) dropShipType)
                    });
                } 
                ViewData["dropShipTypes"] = dropShipTypes;

                var consolidateProviders =
                    _dropShipServiceProviderRepository.GetDropShipServiceProviderByDropShipType(
                        (int) (DropShipTypeEnum.RoyalConsolidate));

                var expediteProviders = _dropShipServiceProviderRepository.GetDropShipServiceProviderByDropShipType(
                        (int) (DropShipTypeEnum.RoyalExpedite));


                var consolidateProviderModel = new List<ScheduleProviderDropShipModel>();
                foreach (var provider in consolidateProviders)
                {
                    consolidateProviderModel.Add(new ScheduleProviderDropShipModel()
                    {
                        ScheduleProviderId = provider.DropShipServiceProviderId,
                        ScheduleProviderName = provider.DropShipServiceProviderName
                    });
                } 
                ViewData["consolidateProviderModel"] = consolidateProviderModel;

                var expediteProviderModel = new List<ScheduleProviderDropShipModel>();
                foreach (var provider in expediteProviders)
                {
                    consolidateProviderModel.Add(new ScheduleProviderDropShipModel()
                    {
                        ScheduleProviderId = provider.DropShipServiceProviderId,
                        ScheduleProviderName = provider.DropShipServiceProviderName
                    });
                } 
                ViewData["expediteProviderModel"] = expediteProviderModel;  

                var model = new ScheduleRoyalLogisticsModel
                {
                    TrackingCode = trackingCode,
                    JobId = _headerRepository.GetFileHeader(uploadFile.FileId).JobId,
                    MailClass = uploadFile.MailClassName,
                    MailType = uploadFile.ParcelTypeName
                };  


                return View("ScheduleRoyalLogistics", model);
            }

     

    Here is the grid in the view:

    <div id="view" class="k-content">

                    @(Html.Kendo().Grid<DropShipDestinationSummaryModel>()
                          .Name("ScheduleRoyalLogisticsGrid")
                          .Columns(columns =>
                          {
                              columns.Bound(c => c.DropShipDestinationSummaryId).Hidden(true);
                              //columns.Bound(c => c.DropShipType)
                              //    .ClientTemplate("#= getScheduleStatusIcon(data) #")
                              //    .Title("Status")
                              //    .Filterable(false);
                              columns.Bound(c => c.DropShipType)
                                  .EditorTemplateName("_DropShipType")
                                  .ClientTemplate("#=DropShipType.DropShipTypeName#")
                                  .Title("Profiled Status").Sortable(false).HtmlAttributes(new {@class = "purple-background"});
                              columns.Bound(c => c.EntryLevel)
                                  .Title("Destination");
                              columns.Bound(c => c.ServiceProvider).ClientTemplate(
                                  "#if(#=DropShipType.DropShipTypeId# == 1){#" +
                                  (Html.Kendo().DropDownList()
                                    .Name("ServiceProvider_#=DropShipDestinationSummaryId#")
                                    .DataValueField("ScheduleProviderId")
                                    .DataTextField("ScheduleProviderName")
                                    .BindTo((IEnumerable) ViewData["consolidateProviderModel"]).ToClientTemplate()).ToHtmlString() +
                                  "#} else if(#=DropShipType.DropShipTypeId# == 2)  {#" +
                                  (Html.Kendo().DropDownList()
                                    .Name("ServiceProvider_#=DropShipDestinationSummaryId#")
                                    .DataValueField("ScheduleProviderId")
                                    .DataTextField("ScheduleProviderName")
                                    .BindTo((IEnumerable) ViewData["expediteProviderModel"]).ToClientTemplate()).ToHtmlString() +
                                  "#} else {#" +
                                  "<p>TEST</p>" +
                                  "#}#");
                              columns.Bound(c => c.PostalFacility)
                                  .Title("Destination Entry");
                              columns.Bound(c => c.PieceCount)
                                  .Title("Piece Count");
                              columns.Bound(c => c.Weight)
                                  .Title("Weight");
                              columns.Bound(c => c.Cost).Format("{0:c2}")
                                  .Title("Cost");
                              columns.Bound(c => c.PalletCount)
                                  .Title("Pallet Count").HtmlAttributes(new {@class = "purple-background"});
                              columns.Bound(c => c.ScheduledPickup)
                                  .Format("{0:M/d/yyyy h:mm tt}")
                                  .EditorTemplateName("_ScheduleDateAndTime")
                                  .Title("P/U Pickup").HtmlAttributes(new {@class = "purple-background"});
                              columns.Bound(c => c.DropDate)
                                  .Format("{0:M/d/yyyy h:mm tt}")
                                  .EditorTemplateName("_ScheduleDateAndTime")
                                  .Title("Drop Date").HtmlAttributes(new {@class = "purple-background"});
                          })
                          .ToolBar(toolbar =>
                          {
                          toolbar.Save();

                          toolbar.Template(
                                  @<text>

                                      @(Html.Kendo().DropDownList()
                                            .Name("dropShipTypeDropDownList")
                                            .DataTextField("DropShipType")
                                            .DataValueField("DropShipTypeId")
                                            .DataSource(source =>
                                            {
                                                source.Read(read =>
                                                {
                                                    read.Action("GetDropShipTypes", "DropShip");
                                                })
                                                    .ServerFiltering(true);
                                            })
                                            .SelectedIndex(0)
                                            )

                                      <button id="schedule" name="schedule" class="pull-right">Schedule</button>

                                   </text>);


                          }).Events(x => x.DataBound("onGridDataBound"))
                          .HtmlAttributes(new {style = "margin:auto;"})
                          .Sortable()
                          .Pageable(pageable => pageable
                              .Refresh(true)
                              .PageSizes(new[] {25, 50, 75, 100})
                              .ButtonCount(5))
                          .Editable(editable => editable.Mode(GridEditMode.InCell))
                          .DataSource(datasource => datasource
                              .Ajax()
                              .Batch(true)
                              .Model(model =>
                              {
                                  model.Id(d => d.PostalFacility);
                                  model.Field(d => d.DropShipType).Editable(true);
                                  model.Field(d => d.EntryLevel).Editable(false);
                                  model.Field(d => d.MailType).Editable(false);
                                  model.Field(d => d.PieceCount).Editable(false);
                                  model.Field(d => d.PostalFacility).Editable(false);
                                  model.Field(d => d.ScheduledPickup).Editable(true);
                                  model.Field(d => d.ServiceProvider).Editable(true);
                                  model.Field(d => d.DropDate).Editable(true);
                                  model.Field(d => d.ScheduledBy).Editable(false);
                                  model.Field(d => d.Cost).Editable(false);
                              }) 
                              .Read(read => read
                                  .Action("GetScheduleRoyalLogistics", "DropShip", new {trackingCode = @Model.TrackingCode}))
                              .Update(update => update.Action("UpdateScheduleRoyalLogistics", "DropShip"))
                              .PageSize(25))
                          )
                </div>

     

    Here is the action method for the Read action on the grid:

    public ActionResult GetScheduleRoyalLogistics([DataSourceRequest] DataSourceRequest request, Guid trackingCode)
            {
                var uploadFile = _uploadFileService.GetUploadFileByTrackingCode(trackingCode);
                var awaitingScheduleRelation = _dropShipFileRelationService.GetByDropShipTrackingCode(trackingCode);  

                var dropShipRelation = awaitingScheduleRelation == null
                    ? _dropShipFileRelationService.GetBySenderFileId(uploadFile.FileId).ToList()
                    : _dropShipFileRelationService.GetByOffsetFileId(awaitingScheduleRelation.OffsetFileId).ToList();

                var allProviders = _dropShipServiceProviderRepository.GetAll();

                var parcelTypes = _parcelTypeRepository.GetParcelTypes();
                List<DropShipDestinationSummaryModel> result = new List<DropShipDestinationSummaryModel>();

                foreach (var relation in dropShipRelation)
                {
                    result.AddRange(_dropShipDestinationSummaryService.GetByDropShipFileRelationId(relation.DropShipFileRelationId).Select(x =>
                        new DropShipDestinationSummaryModel()
                        {
                            DropShipDestinationSummaryId = x.DropShipDestinationSummaryId,
                            Cost = x.Cost,
                            Weight = x.Weight,
                            EntryLevel = Utility.GetDescriptionFromEnumValue((UspsFacilityTypeEnum)x.UspsFacilityType),
                            MailType = parcelTypes.Where(a => a.ParcelTypeId == x.ParcelTypeId).Select(y => y.ParcelTypeName).First(),
                            PieceCount = x.PieceCount,
                            PostalFacility = x.DestinationEntry ?? "",
                            ScheduledBy = x.ScheduledBy ?? "",
                            ScheduledPickup = x.PickupDate,
                            DropDate = x.DropDate,
                            PalletCount = x.PalletCount,
                            DropShipType = new DropShipTypeDropDown()
                            {
                                DropShipTypeId = (int)x.DropShipType,
                                DropShipTypeName = Enum.GetName(typeof(DropShipTypeEnum), x.DropShipType)
                            },
                            ServiceProvider = new ScheduleProviderDropShipModel()
                            { 
                                ScheduleProviderId = (int) x.DropShipServiceProviderId,
                                ScheduleProviderName = allProviders.Where(a => a.DropShipServiceProviderId == x.DropShipServiceProviderId).Select(z => z.DropShipServiceProviderName).First()
                            }
                        }));
                }

                return Json(result.ToDataSourceResult(request));
            }

     

    any help would be greatly appreciated!

  2. Kostadin
    Admin
    Kostadin avatar
    1708 posts

    Posted 19 Oct Link to this post

    Hello Stan,

    I already answered the support ticket you have opened with the same requirement and I would appreciate if we continue our conversation there. Nevertheless, the proper way of adding a widget in a Client Template is described in the following help article.

    Regards,
    Kostadin
    Telerik by Progress
    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 Feedback Portal and vote to affect the priority of the items
  3. Kendo UI is VS 2017 Ready
Back to Top