1

The jqgrid rowlist dropdown is missing.

Missing jqgrid rolwist dropdown http://www.managementlevelreview.com/images/MissingRowlist.jpg

My code:

jQuery("#gridsavedAfterHours").jqGrid({
    url:'/AfterHours/GetsavedAfterHours?userid=${thisuserid}&&orgcode=${thisorgcode}',
    datatype: 'json',
    colNames:['ID','Name','Branch','Start','End'],
    colModel:[
        {name:'AfterHoursId', index:'AfterHoursId', width:25, sortable:true, search:false, key: true},
        {name:'UserFullName', index:'UserFullName', width:150, sortable:true, search:false},
        {name:'UserOrgLongName', index:'UserOrgLongName', width:150, sortable:true, search:false},
        {name:'enteredStartDate', index:'enteredStartDate', width:100, sortable:true, search:false},
        {name:'enteredEndDate', index:'enteredEndDate', width:100, sortable:true, search:false}
    ],
    rowNum:${DefaultRowNumber ?? 10},
    rowList:[10,25,50,100],
    pager: jQuery('#savedAfterHoursPager'),
    onSelectRow: function(id){},
    sortname: 'Start',
    viewrecords: true,
    sortorder: 'desc',
    multiselect: false,
    imgpath: '/Content/images',
    caption: 'After Hours',
    height: 'auto',
    width: '800px',
    emptyrecords: 'No After Hours data found.'
}).navGrid('#savedAfterHoursPager',
    {edit:false,add:false,del:false},
    {}, // use default settings for edit
    {}, // use default settings for add
    {}, // delete instead that del:false we need this
    {   //search options
    closeOnEscape:true /* allow the view dialog to be closed when user press ESC key*/
    }
);
Oleg
  • 220,925
  • 34
  • 403
  • 798
drjackevan
  • 35
  • 1
  • 10

1 Answers1

1

I suppose that you defined some CSS style for input field which has large width attribute and probably some other attributes. I recommend you to include the following additional CSS on your page

input.ui-pg-input { width: auto; }

See additionally another answer on the close subject.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • 1
    Thank you! The CSS you suggested fixed part of the problem. However, the rowlist dropdown is now very wide. – drjackevan Aug 04 '12 at 20:04
  • @drjackevan: The reason of the problem is another CSS which you use. If you don't post the CSS nobody can help you. If you would post the URL which reproduces the problem I could easy see the reason and fix it. – Oleg Aug 04 '12 at 20:19
  • Thanks again. I checked my stylesheet and found a CSS select that was dictating the width and fixed that. The jqgrid pager now displays normally. – drjackevan Aug 04 '12 at 21:28