jQuery Grid Plugin – jqGrid

Hi, a “width” problem confused me, I use my data source in xml format, the table header can’t be the same as cells below, I think there is a ‘padding’ in each cell, make the table looks strange. I tried all your themes and using 3.1, all alike

I have 2 screen captured if you don’t know what I am saying…

http://picasaweb.google.com/ayeah.net/Me/photo#5217984355119927394
http://picasaweb.google.com/ayeah.net/Me/photo#5217984353363626002

Is the reason I am using double-byte chars?

Hi Tony,

I just wanted to say thanks for a great plugin!
Stumbled upon it last week and then integrated it on my this weekend – saved me hours/days of work!!

Keep up the good work!

Best regards,
Mickster

Hi Tony, great plugin!!.

First of all, sorry for my bad english. I’m trying to integrate your code on my website but i have a little question (yes, it has been asked before but the solution didn’t help me). I want to know if it’s possible to modify the row background depending of a row value. F.example:
Code —– Name —– Stock
001 Jeans 5 // background: BLUE
002 Shirts 9 // background: RED
050 Jeans 5 // background: BLUE
111 Jacket 8 // background: GREEN
901 Jeans 5 // background: BLUE

If the value of column name is ‘Jeans’ the row background must be blue, if it’s ‘Jacket’, must be Green, etc…

Thx for all ^^

Hi Tony

Problem solved. We were using a varchar in the column id!

Brilliant plugin.

Many thanks

It seems there should be a way to handle all the data sorting and getting in javascript, instead of making the server do all the work to sort.

Is there a way to get thet data myself with javascript and feed it to jqGrid manually, such as $(“#grid”).setDataProvider( myObject );

@ayeah,
I hope that the upcoming 3.2 will resolve your problem. It seems that you use grid with width greater than the screen width. In such case I recommend to enclose a grid in div with overflow: auto.

@VySe,
In 3.2 there is a event afterInsertRow(rowid) which fires after every inserted row.
It is a little difficult to add some css properties I will see how can I extend this event.

Regards
Tony

Tim there is a method jQuery(“mygrid).addRowData(rowid, Array_of_Data).

Refer to documentation

Tony

Well, after a hard day trying to change the row-color depending of the data, i got something ^^.

I got the idea from the “after Load callback” example but the code is still a bit “dirty”, i’ll try to improve it (i’m lucky that i got only 3 possible data options to change the row color, if i had more it will be ass-pain).

I used an loadComplete function that gets the row id and the cell data and depending of the cell data i change the row data for a div with the old data and a different background.

Something like….

if (cst.estado == ‘Sin Revisar’)
{
jQuery(“#list10″).setRowData(ids[i],{codigo:””+cst.codigo+””});
jQuery(“#list10″).setRowData(ids[i],{titulo:””+cst.titulo+””});
jQuery(“#list10″).setRowData(ids[i],{fecha:””+cst.fecha+””});
.
.
.
etc….

Now i’m trying to integrate a drag&drop resize to change the grid height and width, if someone got ideas… ^^

Thx for all and sorry again for my bad english.

Hi,
Just wait some time. The 3.2 will be out soon. There is a new method setCell which do that

Regards
Tony

Tony, thanks for your reply. I’m not sure either what I mean, I’ll get back to you when I have a clearer picture of the problem/wish.

But can you answer another question: Is it possible to have an autocomplete column with jqGrid? I’d for example like the user to fill in an account number. Users forget easily, so autocomplete could complete the field for them.

hi gabriel:
sorry to bother you, I”m getting the same errors : $(modwin).jqDrag is not a function.Can you tell me how to fix it.

Still having problems searching the grid

1)Is the url used to get the rowset before searchGrid gets it. When I push search, the grid says loading, but never updates

2) The search dialog isn’t elegant when I use it in Firefox, and grotesque in IE. any suggestions

Hi Tony:
Can you give me full example for jqgrid 3.2 (update example(How to pass valuse to php,or aspx)?
because I can’t understand use it by pdf file’ teach.
Thanks

Gersh,
You should configure you server to get these parameters and perform the search server side. Download the examples to have idea how you can configure the search.
As for the second – I can make this. If you can make it better you are welcome.
Best Regards
Tony

KEN,
Values are passed automatically. You should get it server side.
That is: if in your colModel you have defined names invno and invdate and edit it in the form to server are passed id=rowid, oper=edit, invno=invnoval, invdate=invdateval – where the rowid is the id of the row.
For more information refer to docs
Regards
Tony

Gersh , Sword and Tony,

I’m getting the same exception.

I’m trying to do live data manipulation (Edit Row). Using your example.

When I try to edit a column i get the following exception
(Microsoft JScript runtime error: Object doesn’t support this property or method) is thrown on the line –

jQuery(modwin).jqDrag(handler).jqResize(“.jqResize”)

It gets thrown from grid.Formedit-min.js. I’m using version 3.2.2.

here is how I’m calling rowGridRow()

function editJob(rowNum) {
debugger;
rowNum = Number(rowNum);
var options = {
top: 10,
left: 10,
editCaption: “Edit JobStatus”,
bSumbit: “Update Job Status”,
modal: true,
drag: true,
height: 280,
reloadAfterSubmit: false,
url: ‘UpdateJobStatus/UpdateStatus/’,
processData: “Saving Job Status…”,
closeAfterEdit: true,
beforeInitData: fun1,
beforeShowForm: fun2,
beforeShowForm: fun3
};

jQuery(“#list”).editGridRow(rowNum, options);
}

I’m not sure what I’m doing wrong. Thanks

We are using version 3.3 and we’re still seeing the drop-down issue in IE7 (title workaround DID fix this however) when the row is not editable. The reason they are not editable is that we need to have multi-select and editable doesn’t seem to support this. I appreciate the great work – keep it up!!

Heya,
I’m trying to use a form edit on a multiselect grid. Assuming a user chooses exactly one row, edits the form, submits it, then hits the next (or previous) button. Is there an easy way to deselect and the current row and select the next one? I tried dynamically disabling the multiselect, which worked on the code angle, but aesthetically the row still appears selected.
Thanks

Gersh, i have the same issue. Any ideas on how to use inline editing with the multiselect enabled?

Cheers

@tony
Hi Tony,

Regarding a question from VySe aboout if it’s possible to modify the row background depending of a row value, you said on July 5th, 2008 at 11:15:

In 3.2 there is a event afterInsertRow(rowid) which fires after every inserted row.
It is a little difficult to add some css properties I will see how can I extend this event.

Have you added this functionality? If so, can you give me an example on how it should be used?

Thanks,
Alex

Hey I’m back. I’ve had much success with this plugin, but I have a slight problem. I’m trying to get a multiselect grid to select certain entries on load. I’ve tried $(“#grid_id”).setSelection(row_id), jQuery(“#grid_id”).setSelection(row_id), etc. So is this possible, and if so how do you do it? Is there a version of the grid that i need to at least have, I’m running 3.2. Thanks for the help! Great stuff.