Try not to use the editrules. In this editrules you set a number:true which I think is not correct for edittype file.

 

Regards

I not sure what goes wrong, but after choose a file and click on save row button, and this line returned an error 

isEmpty: function(a) { return a.match(/^\s+$/) || "" === a ? !0 : !1 }

saying that match is undefined

below is my code

{ name : 'badge_image', index : 'badge_image', align : "center", editable : true, editrules: { required: true, number: true }, edittype: 'file', unformat: imageUnformat, formatter: imageFormat, editoptions : { enctype: "multipart/form-data" } },

 

gridComplete: function(){

var ids = jQuery("#jqgrid").jqGrid('getDataIDs');

for(var i=0;i < ids.length;i++){

var cl = ids[i];

be = "<button class='btn btn-xs btn-default' data-original-title='Edit Row' onclick=\"jQuery('#jqgrid').editRow('"+cl+"');\"><i class='fa fa-pencil'></i></button>";

se = "<button class='btn btn-xs btn-default' data-original-title='Save Row' onclick=\"jQuery('#jqgrid').saveRow('"+cl+"');\"><i class='fa fa-save'></i></button>";

ca = "<button class='btn btn-xs btn-default' data-original-title='Cancel' onclick=\"jQuery('#jqgrid').restoreRow('"+cl+"');\"><i class='fa fa-times'></i></button>"; 

//ce = "<button class='btn btn-xs btn-default' onclick=\"jQuery('#jqgrid').restoreRow('"+cl+"');\"><i class='fa fa-times'></i></button>";

//jQuery("#jqgrid").jqGrid('setRowData',ids[i],{act:be+se+ce});

jQuery("#jqgrid").jqGrid('setRowData',ids[i],{act:be+se+ca});

}