jQuery Grid Plugin – jqGrid

Hi, thanks for your great work.
I used the grid in one sample page, but I couldn’t use getSelectedRow() function; how should I call this method on a button click event for example.
I tried:
getSelectedRow()
grid.getSelectedRow()
$(“#scroll1”).getSelectedRow()
But none of them works

Thanks,
Alek

Thanks, Tony
I saw your example works correctly
I think my issue is due to creating the grid in separate dll and bundling the scripts as WebResource (I’m working with C#.Net). So when the page render; It doesn’t recognize object grid; so the function calls fail as well.
Do you have any idea in my case ?

Thanks,
Alek

Great! It worked.

By defining the grid variable in global scope I can now access it in my page.
Thank you very much.

Alek.

Hi man, very impressive work.

I have several suggestions to make it better, hope you can agree them:)

1. support multi-select
2. support google like page numbers, like 1,2,3,4…..
3. support go to page [by input page number] directly
4. support sort in page only option, which do not send request to server but sort in currect page only
5. hidden the page part if the records less than one page

Wa, too much request this time, hope you do not mind!

Best regards,

Jiming

Hi, thanks for the great plugin.

I tried the grid with 250 test data using the ‘json’ datatype. The grid seemed populated correctly, but the red “Loading…” div on the upper left coner of the grid would not go away. Could you please help?

Thanks,
Chinchih

Hi, first of all, congratulations for the excelent piece of code!

I??m struggling to create an addRow method, since I would need to populate the grid rows one by one (and also delete a specificly row).

The plan is allow the user to insert items, and them send the grid data to a PHP application.

I??ve tried this to the addRow (copying from addJSONData, of course)
var addRow(data,t) {
var row = “”
var cur = “”
row = ”;
for (var j=0;j”+data.cell[j]+””;
formatCol($(data,t), j);
}
row += ”;
$(“tbody”,t).append(row);
}
but could not figure out the format of the expected data parameter! 🙁

Could you help me on this?

thanks in advance for any help!

Hi Tony,

Thank you for having most features I expected in next version, which is a supprise!

Best regards!

Jiming

Hi, thanks for this wonderful plugin which I’m trying to modify a little. I would like to know how to work server side with the search box. I see that a ‘whr’ var is added to the querystring, but how do I have to set the mysql query?

Thanks!

Nevermind, I eventually get it to works. It was simple because I do not thought that the querystring was generated entirely by the javascript.

So I added this

if(isset($_GET[‘whr’])) $whr = $_GET[‘whr’]; else $whr = “1=1”;

and then added “…WHERE $whr…” in the SQL string.

Hi all,
Thanx a lot to makers of this grid . I would like to know features of subgrid in this plug-in .Nothing is mentioned about sub grid , sub grid column model, and it’s usage in documentation.

your plug-in not work with jquery1.2

Any chance to get more polish on the UI? Looks a bit outdated. Also is it possible to hide columns?

hi, im using your amazing plugin and im trying to complement it with Thickbox. in every row i show some information and in the last column put a ‘more details’ link, wich shows extra info. this extra info is showed in a modal window with thickbox, but i have a problem: the version of jquery used for jqgrid is not compatible with the jquery version used with thickbox (v1.2) . do you have any idea how to solve it?
thanks

Hi, Thank you very much for this component!

I have question regarding generating image and links in jqGrid, currently i generating complete image tag in server side, instead of i want sent only the image name and it should be generated client side scripting. same thing for link also, please help me how can do this?

I missed an important feature for the jqGrid component; selecting an item from JS.
So extended the class a little;

this.setSelection = function(selection)
{
var ptr = $(“tbody tr#”+selection,grid.bDiv);
if (!ptr.html())
return false;
if( p.selrow ) { $(“tbody tr#”+p.selrow,grid.bDiv).removeClass(“selected”);}
p.selrow = $(ptr).attr(“id”);
if($(ptr).attr(“class”) != “subgrid”) $(ptr).addClass(“selected”);
if( p.onSelectRow ) { p.onSelectRow(p.selrow); }
return true;
};
I hope this is useful for some of you

Although i have yet to try your code the Demo looks great and is just what i am after.

Thank you very much for your hard work!

how build json array in php for jqgrid

to get working with 1.2
replace line 192 with
formatCol($(‘tr #’ + cur.id,t), j);

and for a php json array example
this works as a json datasource for the current example site

total = 1;
$response->page = 1;
$response->records = 1;
$response->rows[0][‘id’] = “1”;
$response->rows[0][‘cell’] = array (1,2,3,4,5,6);
echo json_encode($response);
?>

i try the plugin with the new version of jquery but dont work….what is the problem?? with the previus version runs fine

Sorry for my bad english

i don’t now how that was worng but that not work with 1.2.1 i try with ie 6.1

I try with the version 1.1.3.1 and work find (this version is the version of the demo page)

Thanks

I find another problem on the searchdb.js with the new version of jquery that not work…there is a javascript error

Error: [Exception… “‘type property can’t be changed’ when calling method: [nsIDOMEventListener::handleEvent]” nsresult: “0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)” location: “” data: no]

Thanks for all

hello…

im trying to have a modifications for the grid is that ok ? i want the source of the grid to be more flexible i mean xml format should not be like rows etc..

i will give you guyz an update for this one and if you want a copy of my work

thanks!!

🙂

I am experiencing a weird problem when instancing the grid in a iframe inside another iframe.
In FF I get a JS error:

document.defaultView.getComputedStyle(elem, null) has no properties

It seems to be a JQuery .css() problem.
It works without problems in IE.

Further investigations took me to the conclusion that the problem is not the iframe, but a jquery tab-control that surrounds it.
The jqgrid is contained into an iframe that is hidden by a tab control.
I try to instantiate it into nested iframes and it worked until i try to hide via the tab control one of the iframes. It seems that this way the css properties disappear, and FF runs into js error.
Again, IE works well.
If I’m right, some of jqGrid startup logic depends on css properties of the container, and if it can’t get these properties it runs into error.

Hey! 🙂
You`ve made a great plugin, it helps me a lot and I don`t have a need to reinvent a bicycle 🙂

But have a little problem with search reset.
Search works perfect, by when reset event fires, nothing happens, data inside of grid stays old. Little debug shown me when $($t).trigger(“reloadGrid”) fires – it sends old search options, not empty array of them (i mean 3 search fields).
Don`t know what to do. Can you help me a little with advice? 🙂

This is server side. Didn`t find serverdside-sample with search at here, so did it myself.

$searchField = $this->conn->clean($_GET[‘searchField’]);
$searchOper = $this->conn->clean($_GET[‘searchOper’]);
$searchString = $this->conn->clean($_GET[‘searchString’]);
$whr=”1=1″;
switch($searchOper)
{
case “bw”:
{
$whr=”`”.$searchField.”` LIKE ‘”.$searchString.”%'”;
break;
}
…………………………………………
………………………………………..
………………………………………..
case “cn”:
{
$whr=”`”.$searchField.”` LIKE ‘%”.$searchString.”%'”;
break;
}
}
………………………………………..
$SQL = “SELECT * FROM `”.DB_WINDOWS_TABLE.”` WHERE “.$whr.” ORDER BY “.$sidx.” “.$sord.” LIMIT “.$start.” , “.$limit.”;”;

Regards and thanks again for this really amazing plugin! 🙂

Hi
If search is not activated only a _search with false value is send.
You can easy check this with getGridParam(‘search’) and getGridParam(‘searchdata’) which will return the current state of the search.

Maybe you missed this
if(_search == ‘true’) {
// do search here
} else {
// clear serch
}

Regards
Tony

There is a piece of this code at grid.formedit.js file:

$(“#sreset”,”#”+IDs.themodal).click(function(){
if ($t.p.search) {
$t.p.search = false;
$t.p.searchdata = {};
$t.p.page= 1;
$(“#sval”,”#”+IDs.themodal).val(“”);
if(p.dirty) $(“.no-dirty-cell”,$t.p.pager).removeClass(“dirty-cell”);
$($t).trigger(“reloadGrid”);
}
});
And it executes fine, but grid doesn`t reloaded with correct parameters. There is a problem.

Ok what I`ve found:
after RESET button click, there goes an AJAX request with old searchdata (this is why grid doesn`t reloaded with no search) and _search param becomes false. So we should lood at it at server side, not at searchdata parameters.

So code at server becomes:

if($_GET[‘_search’]==”false”)
{
$whr=”1=1″;
}
else
{
switch($searchOper)
{
………………

Thanks to Tony again 🙂

Hi,

Thanks for giving such a good grid, I was trying to add column dynamically to grid. But could not find it. Can you please help me with this.

With Best regards,
Natesh

Hi,
I can do multiple selection in only current page.
when go back the previouse page, all those selected item is unchecked.
how can I save all the selected rows in different pages?

Thanks

@Jqgrid multiple selection problem

I get around this by:
a) changing grid.base such that I comment out the line:

ts.p.selarrrow = [];

in several places where it’s inside an if(ts.p.multiselect) block (in 3.4.1, I think I disabled it around lines 1031, 1106, 1153 and 1437. I could have been overzealous, but it works for me). This is to prevent the selarrrow array from getting nuked any time the page is sorted, reloaded, etc. I’m not totally sure why this is, and I hate to change the core code, but hey, it works for me.

and
b)
adding (to your grid options)
loadComplete: function() {

var selected = $(“#my_table”).getGridParam(‘selarrrow’);

if (selected.length) {
for (var i = selected.length – 1; i >= 0; i–){
var row = $(‘#’+selected[i]);
if (row) {
$(“#jqg_”+selected[i]).attr(“checked”,true);
row.addClass(‘selected’);
}
}
}
},

YMMV

Hello, I am trying to get the grid working in an iFrame. I had no doubts that it would work, however the pager is where the issue lies. When I render the content in it’s own window everything shows up just fine, but when I render it within an iframe (Mozilla 3.0) I haven’t tested other browsers yet, the pager just disappears entirely. Any help would be greatly appreciated.

I’ve just confirmed that IE is functional with this bug, however fixing what I had to fix to make it IE ready (we all hate it) it still does not work properly in FF

Thanks for the work. Everything works great.

I have a small suggestion for this bug fix.

“IE does not format correct the table row if some data is empty – I analyze the data and add a space if it is empty.”

Would it be possible for you to add a space to the td only but not to the title attribute of td? In IE it shows a small blank tooltip when you mouse over the empty column.