Thread

I noticed that in firefox the column headers were slightly smaller causing them to be left shifted…

Using firebug I was able to see that the div inside of td’s had an offset of 1, Where the div’s inside of the th’s did not…

I’m not really sure why the issue is only in firefox but adding a margin seemed to give it that 1px it needed to line back up…

.flexigrid div.hDiv th div { margin:1px; }

Although I don’t think this is a good solution.

It would be good to have bot the th’s and td’s both have the same properties…

Any ideas?

I can provide some pictures if you want to see the issue…

P.S.

Why is a second table used for the headers ?  Just Wondering…

Great job!

sure send me some shots.

To note I’m using html 4.0 strict where all examples I have seen people have used xhtml…

Is this an issue?

Here are the photos…
http://picasaweb.google.com/mr.danielaquino/Temp/photo#5192437596347091074

I’m afraid xhtml strict is required. I can’t support too many standards, because supporting xhtml alone requires me to handle differences in opera, ie6, ie7, safari, and firefox. supporing html as well might multiply that to 2.

Is there anyway I could have flexigrid have a height of 100% just like the unspecified width goes to 100% ?

Right now nope.

I noticed that in firefox the column headers were slightly smaller causing them to be left shifted…

Using firebug I was able to see that the div inside of td’s had an offset of 1, Where the div’s inside of the th’s did not…

I’m not really sure why the issue is only in firefox but adding a margin seemed to give it that 1px it needed to line back up…

.flexigrid div.hDiv th div { margin:1px; }

Although I don’t think this is a good solution.

It would be good to have bot the th’s and td’s both have the same properties…

Any ideas?

I can provide some pictures if you want to see the issue…

P.S.

Why is a second table used for the headers ?  Just Wondering…

Great job!

sure send me some shots.

To note I’m using html 4.0 strict where all examples I have seen people have used xhtml…

Is this an issue?

Here are the photos…
http://picasaweb.google.com/mr.danielaquino/Temp/photo#5192437596347091074

I’m afraid xhtml strict is required. I can’t support too many standards, because supporting xhtml alone requires me to handle differences in opera, ie6, ie7, safari, and firefox. supporing html as well might multiply that to 2.

Ok I switched over to xhtml and even created a little mock example.  For some reason I’m still seeing this issue when I don’t see it on your main page, or in other examples…

https://dev.ispbx.com/dan/flexigrid/

Ok I switched over to xhtml and even created a little mock example.  For some reason I’m still seeing this issue when I don’t see it on your main page, or in other examples…

https://dev.ispbx.com/dan/flexigrid/

Your target element is a div, it should be a table.

Hi guys, I found flexigrid a few days ago, and I think it’s great. I had been wondering if it were possible to make it select only 1 row at a time, and I saw that many other people were asking for this functionality. So, I sat down this afternoon and worked out a solution that seems to work (IE7/8, and FF2).
First, add a new property to the

p = $.extend({
selOne: true,
...

array (line 19).

Then, I added this method:

selNone: function() {
//go through each row in the table, and make sure it is not selected
                $('tbody tr',this.bDiv).each(
                    function() {
                        $(this).removeClass('trSelected');    
                    }
                    );
                return true;
            },

to line 95 right before the fixHeight method.

Lastly, inside the `addRowProp` method, there is a click handler, add:

if (p.selOne)
                                        {
                                            if (!$(this).hasClass('trSelected'))
                                            {
                                                g.selNone();
                                                $(this).toggleClass('trSelected');    
                                            } else {
                                                g.selNone();
                                            }
                                        } else {
                                            $(this).toggleClass('trSelected');
                                        }

after

var obj = (e.target || e.srcElement); if (obj.href || obj.type) return true;

(line 718)
Then, change the mousedown handler to

.mousedown(
                                function (e)
                                    {
                                        if (!p.selOne)
                                        {
                                            if (e.shiftKey)
                                            {
                                            $(this).toggleClass('trSelected'); 
                                            g.multisel = true; 
                                            this.focus();
                                            $(g.gDiv).noSelect();
                                            }
                                        }
                                    }
                            )

(Line 727)
I think that I got all my changes on here. Try it out and tell me what you think.

—Andrew

Hi guys, I found flexigrid a few days ago, and I think it’s great. I had been wondering if it were possible to make it select only 1 row at a time, and I saw that many other people were asking for this functionality. So, I sat down this afternoon and worked out a solution that seems to work (IE7/8, and FF2).
First, add a new property to the

p = $.extend({
selOne: true,
...

array (line 19).

Then, I added this method:

selNone: function() {
//go through each row in the table, and make sure it is not selected
                $('tbody tr',this.bDiv).each(
                    function() {
                        $(this).removeClass('trSelected');    
                    }
                    );
                return true;
            },

to line 95 right before the fixHeight method.

Lastly, inside the `addRowProp` method, there is a click handler, add:

if (p.selOne)
                                        {
                                            if (!$(this).hasClass('trSelected'))
                                            {
                                                g.selNone();
                                                $(this).toggleClass('trSelected');    
                                            } else {
                                                g.selNone();
                                            }
                                        } else {
                                            $(this).toggleClass('trSelected');
                                        }

after

var obj = (e.target || e.srcElement); if (obj.href || obj.type) return true;

(line 718)
Then, change the mousedown handler to

.mousedown(
                                function (e)
                                    {
                                        if (!p.selOne)
                                        {
                                            if (e.shiftKey)
                                            {
                                            $(this).toggleClass('trSelected'); 
                                            g.multisel = true; 
                                            this.focus();
                                            $(g.gDiv).noSelect();
                                            }
                                        }
                                    }
                            )

(Line 727)
I think that I got all my changes on here. Try it out and tell me what you think.

—Andrew

Super Andrew.

Hi Paolo.

First of all, congratulations for your hard work, your plugin is awesome :wow: .

I’d like to use it in my current project, which is a track&trace;interface for a transporter. It’s a web based java application witch uses Struts/hibernate with an AS400 database. I use the DWR library for AJAX calls.

So i’d like to know if i can use your plugin in some JSP’s to retrieve the initial datas, and then DWR calls to refresh it?

Has someone tried to do something similar?

PS: Excuse me in advance for my english

I can’t seem to find a way for regular HTML tables to be sortable. Or are only JSON tables sortable?

This grid is really amazing. Thank you!

I got the code that Synergiq made to use with asp (http://jamesowers.co.uk/asp-tutorials/57/flexigrid-with-asp/) but unfortunately, I’m getting an error when I execute it on IE. I’m using the example code without modifications. The error that I got stay below:

Line: 403
Char: 8
Error: ‘id’ is null or not an object
Code: 0

And my grid stay blank without the data from the database. I checked the test.asp (file with the response from the database) and works perfectly. On firefox all file works perfectly and I see my grid working with data inside. And when I try to change the sortname: “id” to firstname or lastname, my IE freeze and needs to restarted. Could someone help me with this issue, please?

My test page stay at http://www.robertomiguez.com.br/flexgrid/default.asp

Thank you and best regards,
Roberto Miguez

Ok, James Owers gave me the necessary corrections. It is working now. Thank you James!

The problem with the asp code was my fault, an extra comma.

There is an asp version for flexigrid that works in IE here: http://jamesowers.co.uk/asp-tutorials/63/flexigrid-with-asp-version-2/

I got the code but now I got other error. The search doesn’t work. I receive the answer “Processing, please wait…” but nothing happens and I need to refresh the page to continue to use. Could someone help me? Thank you.

Its probably a mistake in my code somewhere. I’ll have a look.

I’ve fixed that problem now, just re-download the rar file.

Thank you Synergiq, now it is working perfectly!