Forum
Log In
Home
Topic RSS
00:17
28/01/2009
Offline
I am new to jqgrid and am needing some help.
I would like to add an Image to each row and set the row height. I have a url for thumnails that are 150×150 px I would like to make the row height 175px.
I am grateful for any help I can get. TIA
-Richard
P.S.
I would also like to add mouse-over the image and show the real size image, but one thing at a time.
09:59
Moderators
30/10/2007
Offline
Hello,
Maybe you can use the afterInsertRow event for this purpose.
Also check the parameters for this event. One of them is the id. The id is actuall the tr element. With jQuery it is easy:
$("#the_id_from_afterInsertrow").css("height","175px");
Use the same event to attach your own mouseover event.
Regards
Tony
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.
14:42
28/01/2009
Offline
I have posted my code. I am not sure what I did wrong with this code. I found it in the docs and attempted it. Please Advise…
Thank you for your time, I really appreciate it.
<script type=”text/javascript”>
jQuery(document).ready(function(){
jQuery(”#list”).jqGrid({
url:'/listing/data/all/',
datatype: 'json',
colNames:['VIN', 'owner', 'address', 'Zip', 'Price'],
colModel :[
{name:"vin", index:"vin", width:120},
{name:"address", index:"address", width:230, sortable:false},
{name:"owner", index:"owner", width:120, align:"left"},
{name:"zip", index:"zip", width:70, align:'center'},
{name:"price", index:"price", width:80, align:'right'},
],
pager: jQuery('#pager'),
sortname:”id”,
sortorder:”asc”,
jsonReader: {
root: “rows”,
id: “id”,
index: “id”,
page: “page”,
total: “total”,
records: “records”,
repeatitems: false,
},
shrinkToFit:true,
multiselect:true,
viewrecords:true,
imgpath:”/static_media/grid/themes/basic/images”,
caption:”Autos”,
height:'100%',
toolbar: [true,'top'],
afterInsertRow: function(rowid, aData){jQuery(”#list”).setCell(rowid,'price','',{color:'green'});},
});
jQuery(”#m1″).click( function() {
var s; s = jQuery(”#list”).getGridParam('selarrrow');
jQuery.post(”/listing/selected/”, { selected: s }, function(data){$(”#showselected”).html(data)}
);;
});
});
</script>
16:53
28/01/2009
Offline
I was able to figure it out.
afterInsertRow: function(rowid, aData){
$('#list').css({height:175});
},
Now the question comes how to add another column with an image at /media/images/<vin#>/image0.jpg. TIA for all the help!
00:50
28/01/2009
Offline
This didn't work as expected. It didn't make the row height 175px it made the whole #list 175... I tried this and it doesn't work.
afterInsertRow: function(rowid, aData){
$('#list > tr').css({height:175});
},
Can someone give me a hand?
10:48
Moderators
30/10/2007
Offline
Hello,
afterInsertRow: function(rowid, aData){
$(’#'+rowid).css({height:175});
},
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.
Most Users Ever Online: 715
Currently Online:
50 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66
