Rendering problem

[tcorrigan5Participant]

My combo box has display members that are very long. They display properly in the drop down list, but not in the text box. See these images

Here’s the code

@using System.Collections.Generic
@using VVSWebAdmin.ViewModels.Home
@using Newtonsoft.Json
@model IEnumerable<OfficeItem>
@section scripts {
   <script type="text/javascript">
      $(document).ready(function () {
         var data = @Html.Raw(JsonConvert.SerializeObject(Model));

         var offices = {
            localData: data,
            dataType: "json",
            dataFields:
               [
               { name: 'officeid', type: 'string' },
               { name: 'name', type: 'string' },
               ]
         };
         var officeAdapter = new jQuery.jqx.dataAdapter(offices);

         $("#officeList").jqxComboBox(
                     {
                        width: '55%',
                        height: 25,
                        source: officeAdapter,
                        selectedIndex: -1,
                        displayMember: "name",
                        valueMember: "officeid"
                     });

      $('#btnLoad').click(function(e) {
         var value = $("#officeList").jqxComboBox('val');
         alert(value);
      });
   </script>
    }

[Peter StoevKeymaster]

Hi tcorrigan5,

I suggest you to check your CSS for conflicts. I see no other reason for this behavior.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[tcorrigan5Participant]

Peter,

You’re right. It was a css problem. For those of you playing at home, the default project generated by ASP .Net Core includes a site.css file that sets a maxwidth of 280px for input, select and textareas. That’s what caused the problem

[Author]

Posts