开发者

JQGrid - Select list value not set in edit mode using IE

开发者 https://www.devze.com 2023-03-16 07:33 出处:网络
I am creating a web page using MVC, with a JQGrid showing some data. The grid uses inline editing, and one of the columns becomes a select input during edit mode. When I begin editing, the select inpu

I am creating a web page using MVC, with a JQGrid showing some data. The grid uses inline editing, and one of the columns becomes a select input during edit mode. When I begin editing, the select input does not seem to take the value of the cell, instead the initial selected item is the first in the list. This happens in IE, but when using Firefox, the selected item correctly takes the value of the cell.

I define my column as follows:-

{ name: 'MyColumn', index: 'MyColumn', width: 80, align: 'left', editable: true,sortable: true,hidden: false,Key: false, edittype: 'select', editoptions: { value: "0:None;1:Option1;2:Option2;3:Option3", width: 'auto',size: 20, maxlength: 30}}

I populate my grid using a json helper class to convert a DataTable into a string. The databind function in my controller class looks like this:-

DataTable results = GetResults(sidx, sord, startIndex, endIndex, out resultsCount);
        return Content(JsonHelper.JsonForJqgrid(results, rows, resultsCount, page), "application/json");

I used firebug to test the the html that is produced, and both IE and FF give the following after edit mode is triggered.

<td aria-describedby="MyGrid_MyColumn" title="Option3" style="text-align: left; color: red;" role="gridcell">
   <select role="select" width="auto" formatter="select" size="1" maxlength="30" id="3_MyColumn" name="MyColumn" class="editable">
      <option role="option" value="0">N开发者_如何学JAVAone</option>
      <option role="option" value="1">Option1</option>
      <option role="option" value="2">Option2</option>
      <option role="option" value="3">Option3</option>
    </select>
</td>

My datatable currently gets the value of the column as the 'text' value, so FF is matching the value of the cell, to the 'text' value of the select input. I have the capacity to get the value as the actual value used in the select input, but this meant the cell showed the value instead of the text when not in edit mode (and still didn't match on edit mode in IE).

To clarify, the problem is if the cell has a value of'Option3', in IE when entering edit mode the select input will show 'None' as it's selected item instead of 'Option3'. Firefox will correctly show 'Option3' as the selected item.

Any tips?

UPDATE:

Found a solution, I wouldn't call it the answer. I updated my selectRow function, and collected the cell value before entering edit mode, then updated the dropdown afterwards with the selected option. Feels like a bit of a hack, but it works.

onSelectRow: function(id){
    if (id){
        if (id != lastSel){
            jQuery('#MyGrid').restoreRow(lastSel);
            var rowdata = jQuery('#ShippingListGrid').getRowData(id);
            jQuery('#MyGrid').editRow(id, true, true, true, '/EditURL/', null, true, true);
            $("#" + id + "_MyColumn").val($("#" + id + "_MyColumn option:contains('" + rowdata.MyColumn + "')").val());
            lastSel = id;
         } 
         else { 
            lastSel = '';
         }
    }
}


Which version are you using?

Try upgrading to v4.1.1. I was having the same issue, and it is fixed after upgrading.

I just successfully tested this on IE7, IE8, and IE9

0

精彩评论

暂无评论...
验证码 换一张
取 消