私は、希望どおりに表示されないnavgridを持つJQGridを持っています。次の図に示すように、奇妙に見えるボタンがいくつかあります。
ご覧のとおり、数字が完全に表示されておらず、数字の横にあるボタンも切り取られています。また、大きすぎるページ番号を表示するテキストボックスのサイズと、その視覚的な問題があるテキストボックスのサイズを縮小したいと考えています。
ここに私の見解のコードがあります:
<script type="text/javascript">
$(document).ready(function (){
jQuery("#list").jqGrid({
url: 'http://localhost/ProyectoNetbeans/CodeIgniter_2.1.3/index.php/MedioInformativo_controller/loadData',
mtype : "post", //Ajax request type. It also could be GET
datatype: "json", //supported formats XML, JSON or Arrray
colNames:['Indice','Descripción'], //Grid column headings
colModel:[
{name:'indice', index:'indice', editable:true, hidden:true, edittype:'text'},
{name:'descripcion', index:'descripcion', editable:true, edittype:'text'}
],
pager: '#pager',
width: 900,
rowNum:10,
rowList:[15,30],
sortname: 'indice',
reloadAfterSubmit: true,
sortorder: 'asc',
viewrecords: true,
postData: {descripcion:"descripcion"},
caption: 'Medio informativo',
onSelectRow: function(id)
{
var dataFromCellByColumnName="";
var index=$("#list").getGridParam("selrow");
var rowId = jQuery('#list tr:eq('+index+')').attr('ID');
var dataFromTheRow = jQuery('#list').jqGrid ('getRowData', rowId);
dataFromCellByColumnName = jQuery('#list').jqGrid ('getCell', rowId, 'indice');
setIndice(dataFromCellByColumnName);
}
}).navGrid('#pager',{edit:true,add:true,del:true},
{//EDITAR
},
{//AGREGAR
jqModal:false,
reloadAfterSubmit:true,
savekey: [true,13],
drag: true,
closeOnEscape:true,
closeAfterAdd:true,
url:"http://localhost/ProyectoNetbeans/CodeIgniter_2.1.3/index.php/MedioInformativo_controller/addData",
beforeSubmit: function(postdata, formid){//valida que no halla errores en la insercion de datos
//alert(postdata.Pais);//imprime lo que se mando en el texto
if (postdata.descripcion=="")
{
return [false,'DESCRIPCION EN BLANCO, INSERTE UNA DESCRIPCION'];
}
else if (postdata.descripcion.length>50)
{
return [false,'NUMERO DE CARACTERES PARA DESCRIPCION EXCEDIDO, MAXIMO=50'];
}
else
{
return [true,'EXITO']; // no error
}
}
},
{// DELETE
},
{multipleSearch : false}, // enable the advanced searching
{closeOnEscape:true} /* allow the view dialog to be closed when user press ESC key*/
);
});
</script>
ここで何ができるか知っている人はいますか？