AutoComplete Column not Storing Text if not from selection

[Bret]

Hi everyone,

 

I'm trying to add an EditorTemplate for an autocomplete column.  However, when I add the template, the only way for the grid to get populated is to select from the dropdown.  If I don't select from the dropdown, then the autocomplete does not populate the grid column with the text.  My code is below.   Any help is much appreciated.  Thank you for your time.

 

Bret Mullinix

 

Column From Grid -->

columns.Bound(l => l.AssetObject).Width(200)

                                        .ClientTemplate(" #: data.AssetObject ? data.AssetObject.SerialNumber : getSerialNumber(this, data) #" +

                                                        "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.AssetTypeId' " +

                                                            " value=' #: data.AssetObject ? data.AssetObject.AssetTypeId : '[None]' #' /> " +

                                                        "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.SerialNumber' " +

                                                            " value=' #: data.AssetObject ? data.AssetObject.SerialNumber : '[None]' #' /> " +

                                                        "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.Id' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.Id : 0 #' />" +

                                                        "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.Responsible' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.Responsible : '' #' />" +

                                                            "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.Disposition' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.Disposition : '' #' />" +

                                                        "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.ResponsibleId' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.ResponsibleId : 0 #' />" +

                                                            "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.DispositionId' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.DispositionId : 0 #' />" +

                                                            "<input type='hidden' name='ShipmentItems[#= index(data)#].AssetObject.OwnerId' " +

                                                        "value='#: data.AssetObject ? data.AssetObject.OwnerId : 0 #' />"

                                        )

                                        .EditorTemplateName("AssetSerialNumberAutoComplete");

EditorTemplate:  AutoSerialNumberAutoComplete

@using Kendo.Mvc.UI
@using DataTransferObjects
@model AssetDTO
@(Html.Kendo().AutoComplete()
        .Name("AssetSerialNumberAutoComplete")

          .DataTextField("SerialNumber")
          .Events(e => e.Change("onSerialNumberChange"))
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("GetAssetBySerialNumber", "Asset").Data("onAdditionalDataForAssetSerialNumber");
              });
               source.ServerFiltering(true);

          })
              .HtmlAttributes(new { style = "width:100%", data_skip = "false", data_bind = "defferedValue: AssetObject" })
          .Filter("startswith")
          .MinLength(2)
          .Height(400)

               .HeaderTemplate("<div class=\"col-sm-12\">" +
                        "<div class=\"col-sm-6\">SerialNumber</div>" +
                        "<div class=\"col-sm-6\">Asset Type</div>" +
                    "</div><br/>")
              .Template("<div class=\"col-sm-12\">" +
                      "<div class=\"col-sm-6\">#: data.SerialNumber #</div>" +
                        "<div class=\"col-sm-6\">#: data.AssetType #</div>" +
                        "</div>")

)

<script>

    var autoComplete = $("#AssetSerialNumberAutoComplete").data("kendoAutoComplete");
    autoComplete.list.width(600); //adjust width of the drop-down list

</script>

[Hristo Valyavicharski]

Hi Bret,

Does the GetAssetBySerialNumber action filters the data correctly? The  autocomplete should return data after you enter at least 2 characters in the input.

Regards,
Hristo Valyavicharski
Telerik

[Bret]

Hi Hristo,

 

I'm getting the autocomplete coming back from the server.  However, if I don't have the text in the autocomplete, I still want the text to be saved to the model for submission as a new object.  For instance:

 

Say I type "1234", and no serial numbers come up in the autocomplete,  I want to save the "1234" text.  However, when I go out of the grid cell, the text "1234" is erased or not stored in the underlying cell.

 

Hope this helps in understanding my issue.

 

Thanks for your time

 

Bret Mullinix