jQuery Grid Plugin - jqGridForum

Forum

November 2nd, 2014

A A A

Topic RSS

can not display imagesin the navGrid

17/09/2013
16:48

shilo.k

Member

Members

Forum Posts: 8

Member Since:
26/05/2013

Offline

hellow all

can some one help me to understand why the images in the navGrid is not display ?

i validate that :

1. the files exist in the same path in each tag

2. the images library exist (themes\base\images)

<%@ page language="java" contentType="text/html; charset=windows-1255"

pageEncoding="windows-1255"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

.ui-jqgrid-toppager .navtable {

padding-top: 1px;

padding-bottom: 0px;

}

.ui-jqgrid .ui-jqgrid-pager .ui-pg-div>span { margin: 0 5px; font-size: 12px; }

.ui-jqgrid .ui-icon-asc { height: auto; margin-top: 0; }

.ui-jqgrid .ui-icon-asc, .ui-jqgrid .ui-icon-desc {

height: auto; margin-top: 0; margin-left: 5px;

}

.ui-jqgrid .s-ico>.ui-state-disabled, .s-ico>.ui-state-disabled { padding: 0; }

.ui-jqgrid-pager {direction:rtl;height: 35px !important; }

.ui-jqgrid .ui-jqgrid-pager { /* change height */ border:1px;height:45px;background:skyblue; }

.ui-jqgrid .ui-pg-button { height:25px !important; width:36px !important;font-size:16px}

.ui-jqgrid .ui-jqgrid-pager .ui-icon { position:relative;border:1px; margin: 1px 10px;}

</style>

<title>jqGrid Demo</title>

jQuery(document).ready(function(){

var lastSel=-1;

var firstTime=-1;

var changeStateSelect = function (cellId, cellElem) {

//alert("countryId="+countryId+" countryElem="+countryElem);

var rowid = $("#list").jqGrid('getGridParam','selrow');

var rowData = $("#list").getRowData(rowid);

};

jQuery("#list").jqGrid({

url:'<%=request.getContextPath()%>/ViewWorkers?action=fetchData',

editurl:'<%=request.getContextPath()%>/JQGridSampleUpdate?action=save',

datatype: 'json',

mtype: 'POST',

gridview: true,

colNames:["USERID","NAME", "FAMILY", "ADDR"],

colModel:[

{name:"userId",index:"userId", width:120, editable:false},

{name:"firstName",index:"firstName", width:180, editable:true},

{name:"lastName",index:"lastName", width:180, editable:true},

{name:"addr",index:"addr", width:180, editable:true}

"loadError":function(xhr,status, err){

try { jQuery.jgrid.info_dialog(jQuery.jgrid.errors.errcap,

'<DIV class=ui-state-error>'+ xhr.responseText +'</DIV>',

jQuery.jgrid.edit.bClose,

{buttonalign:'right'});

} catch(e)

{alert(xhr.responseText);

}

pager: '#pager',

rowNum:50,

autowidth: false,

serializeGridData: function(postData) {

var newPostData = $.extend(postData, {

extraParam: function(){

if (firstTime == -1){

firstTime = 1;

return 'FIRST_TIME';

}

else

return 'OTHER_TIME';

}

);

return $.param(newPostData);

rownumbers: true,

direction : "rtl",

sortname: 'id',

multiselect:true,

viewrecords: true,

sortorder: "desc",

pagerpos:'center',

recordpos:'right',

position:'left',

height: 500,

width:900,

onSelectRow: function(id){

if (id !== lastSel) {

jQuery('#list').restoreRow(lastSel);

jQuery('#list').editRow(id, true);

lastSel = id;

} else {

jQuery('#list').restoreRow(lastSel);

lastSel = "";

}

caption: 'My first grid'});

//define handler for 'editSubmit' event

var fn_editSubmit=function(response,postdata){

var json=response.responseText; //in my case response text form server is "{sc:true,msg:''}"

var result=eval("("+json+")"); //create js object from server reponse

return [result.sc,result.msg,null];

}

//define edit options for navgrid

var editOptions={

top: 50, left: "100", width: 500

,closeOnEscape: true, afterSubmit: fn_editSubmit

}

var grid = $("#list");

jQuery("#list")

.navGrid('#pager',{view:true,edit:true,add:true,del:true,search:true,checkOnUpdate:true,refresh:true,beforeRefresh: function () {

firstTime=-1;

}},

{width:400,dataheight:300,viewPagerButtons:true,reloadAfterSubmit:false,checkOnUpdate:true},

{width:400,dataheight:300,viewPagerButtons:true,reloadAfterSubmit:false,checkOnUpdate:true} ,

{width:400,dataheight:300,viewPagerButtons:true,reloadAfterSubmit:false,checkOnUpdate:true}

);

}

);

</script>

</head>

<body>

</body>

</html>

18/09/2013
11:40

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello,

I think your setup is not correct.

You load a lot of modules and scripts which are duplicated.

Please setup correct your head section and try with a very simple grid and not so much code.

You can see the jqGrid setup here

Kind Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
37 Guest(s)

Currently Browsing this Page:
1 Guest(s)