Jx.Grid with Expendable column

[GoogleCodeExporter]

When the parent element of the grid is resize wider, the grid container is
resized too, but only the container not the column. Maybe it's could be
interresting to specify the column wanted to expand in this behavior in the
declaration.

           {
              header: 'Description',
              modelField: 'Description',
              width: '287px',
              isEditable: false,
              isSortable: false,
              isResizable: true,
              isHidden: false,
       ---->  isExpendable: true,     
              templates: {
            cell:{
               cssClass: 'textWrap'
            }
            },
              formatter: null,
              name: 'Description',
              dataType: 'alphanumeric'
          }

So when the grid container is suddendly resized wider, the column
previously set to expendable could take the whole free space. either as
when grid container is resized smaller.

* why is this feature desirable?
* what components of the library are affected?

Jx.Grid

* does it change the existing API in any way?
yes
* does it require documentation changes?
yes
* does it require changes to the examples?
yes

Original issue reported on code.google.com by hugues.gauthier@gmail.com on 18 Mar 2010 at 5:24

Attachments:

• shot.jpg

[GoogleCodeExporter]

Original comment by jbomgard@gmail.com on 18 Mar 2010 at 11:36

• Changed state: Accepted

[GoogleCodeExporter]

Check out the latest commit to the trunk. It has a revamped grid that should do 
what 
you asked. Please give it a try and let me know. It's not exactly the way you 
suggested 
though. Check out the grid.html file in the examples directory as well as the 
actual 
code files in the trunk for more information

Jon

Original comment by jbomgard@gmail.com on 24 Mar 2010 at 6:03

[GoogleCodeExporter]

hi Jon,

How can I set my column expendable ?

Thanks

Original comment by hugues.gauthier@gmail.com on 24 Mar 2010 at 5:39

[GoogleCodeExporter]

Set renderMode to "expand"

Original comment by jbomgard@gmail.com on 24 Mar 2010 at 10:29

[GoogleCodeExporter]

Hi jon,

I set my description column to expand. But when I resize my grid, a empty column
expand instead of description column. see shot. Is there a way to get rid of 
this
empty column at the end of the grid ?

Thanks for your help

Original comment by hugues.gauthier@gmail.com on 26 Mar 2010 at 3:17

Attachments:

• shot.png
• shot_expand.png

[GoogleCodeExporter]

just a quick heads up, Fred and I are deep in this code right now trying to 
solve a Safari rendering issue so there 
are some changes coming I think that may impact this.  Let us finish our 
changes before diving into this.

Original comment by pagameba on 26 Mar 2010 at 3:21

[GoogleCodeExporter]

Thanks for the info, and great job, I have a crush on Jxlib. :)

Original comment by hugues.gauthier@gmail.com on 26 Mar 2010 at 3:30

[GoogleCodeExporter]

Thanks to fixed this, my column is expand well.

Thanks

Original comment by hugues.gauthier@gmail.com on 26 Mar 2010 at 6:26

[GoogleCodeExporter]

I found a glitch.

When I resize the grid wider, the row height is not affected.

See the shot.

Thanks

Original comment by hugues.gauthier@gmail.com on 26 Mar 2010 at 6:43

Attachments:

• shot.png

[GoogleCodeExporter]

how are you changing the width of the grid?

Original comment by jbomgard@gmail.com on 26 Mar 2010 at 6:55

[GoogleCodeExporter]

my grid have this css
.gridBox {
  display: block;
  position: relative;
  margin: 0px;
  border: 1px solid #ccc;
  width: 100%;
  height: 305px;
  clear: both;
}

When I expand the html table where my grid sit on, the grid expand. Yes the 
width of
the grid is changed.

There is a glitch in the column size too, see the previous shot.

if you cannot reproduce the bug, I can with pleasure, share my pure code :)

Thanks

Original comment by hugues.gauthier@gmail.com on 26 Mar 2010 at 7:03

[GoogleCodeExporter]

ok, I just committed a change that makes the expandable column *almost* work, 
the size calculations are off by 
some amount that I don't have time to figure out right now.  If someone is 
interested in looking at it, the relevant 
code seems to be in columns.js around lines 270 - 290.  If the leftOverSpace 
variable is calculated correctly, the 
tables will be sized correctly and everything will line up.  Right now it is 
off by some amount I don't understand - 
I thought perhaps it was the rowHeaderWidth but that doesn't seem to be the 
case.

Original comment by pagameba on 26 Mar 2010 at 9:38

[GoogleCodeExporter]

Paul,

I just ran the grid through some tests and found that the row heights are not 
working on Chrome or Safari on Windows 7. They're fine in FF3.6 and in Opera. 
I've 
never debugged in either Chrome or Safari. Is there a component similar to 
Firebug 
for one or the other?

Jon

Original comment by jbomgard@gmail.com on 26 Mar 2010 at 10:19

[GoogleCodeExporter]

you can get the web inspector using the Develop menu or by right-clicking on an 
element and choosing 
inspect element.  The web inspector includes a script debugger.  I think Chrome 
might have something similar 
(since it is based on WebKit)

I can confirm that the row heights do not work in Safari 4.0.5 on Mac but they 
DO work in WebKit (the nightly 
build).  In addition, clicking the first column header to sort actually crashes 
both Safari and Web Kit which I 
swear it wasn't doing an hour ago when I left for home.

There are no problems in FF 3.6 Mac.  I didn't try Opera in a while and I don't 
think anyone has tried IE for a 
while - which scares me!

Original comment by pagameba on 26 Mar 2010 at 11:23

[GoogleCodeExporter]

I tried the grid example in IE 8 today but it crashes in line 87 of Jx.Styles 
saying 
'sheet.rules' is null or not an object.

But I have in mind that the grid worked last week ago ;)

Original comment by conrad.b...@gmail.com on 26 Mar 2010 at 11:38

[GoogleCodeExporter]

I only changed one thing in Jx.Styles, when creating the style sheet it was 
setting a title - I removed this because 
it was disabling the stylesheet in Safari, I think because the theme switcher 
in tests.js uses the title some how to 
determine which style sheet is active.  Perhaps that affects IE?

On another note, it seems that anything that causes the grid to be rendered is 
causing Safari to crash.  I hope to 
have some time tomorrow morning to take a look at this in more detail.

Original comment by pagameba on 27 Mar 2010 at 1:56

[GoogleCodeExporter]

I fixed the following:

- the row heights in webkit browsers. I had to add a style to apply the height 
to the 
cell itself.

- the width of the expand column, though now it's off if there is a scrollbar. 
I'm not 
sure how to figure out the width of the system scrollbar (this is where using 
the 
custom scrollbar would help as we'd already know the size of that).

- There was a 1px offset in the row headers as compared to the main table. It 
seems 
that webkit calculates the border into the contentBoxSize. I adjusted the 
calculations 
to remove 1px to account for it.

The only other issue I've noticed at this point is that when you resize the 
description 
column the row header heights don't adjust while the main table does. I'll try 
to dig 
into that one tomorrow if I have the chance. 

BTW, the grid didn't crash chrome or safari under windows 7 and I can sort 
everything 
just fine.

Original comment by jbomgard@gmail.com on 28 Mar 2010 at 4:33

[GoogleCodeExporter]

Hi folks,

1. The expand column have glitch, it over expand. (shot.png)
2. jxGridContainer do not expand and take the whole free space in the gridbox.
3. when I resize wider the grid, the expand column don't expand, instead it's a 
empty
column. (shot_resize.png)

I attached the code too.

Thanks for your help

Original comment by hugues.gauthier@gmail.com on 30 Mar 2010 at 1:16

Attachments:

• shot.png
• shot_resize.png
• grid.js
• json.txt
• html.txt

[GoogleCodeExporter]

1. it over expands due to the scrollbar. I haven't yet found a way to reliably 
determine its width.
2. I think I blew this - I'll get it fixed asap.
3. I didn't actually try putting it in something I could expand so I didn't 
test 
that aspect. I'll write a test and get it taken care of.

Jon

Original comment by jbomgard@gmail.com on 30 Mar 2010 at 3:48

[GoogleCodeExporter]

what revision of the trunk are you using?

Original comment by jbomgard@gmail.com on 30 Mar 2010 at 3:49

[GoogleCodeExporter]

Trunk version at 09h55 today.

Thanks

Original comment by hugues.gauthier@gmail.com on 30 Mar 2010 at 3:56

[GoogleCodeExporter]

I was specifically looking for a revision #. Paul committed a fix for at least 
one 
of these so please update to the current revision and try it again.

Original comment by jbomgard@gmail.com on 30 Mar 2010 at 5:37

[GoogleCodeExporter]

Jon, I'm not sure if I would have fixed any of these, I specifically fixed a 
case where resizing the columns to make 
the whole thing smaller than the container would screw up rendering by adding 
an extra, blank TD to the rows.

I think we need a method that will run through the resize of the column and row 
headers without triggering a 
rebuild of the entire grid - this should be triggered after a column resize or 
a container resize and probably 
some other cases.  I'm pretty sure all the code to do this is there somewhere, 
just need to maybe change the API 
methods a little to expose more fine-grained control over recomputing the 
layout of the row and column headers 
???

Original comment by pagameba on 30 Mar 2010 at 5:42

[GoogleCodeExporter]

#820

Original comment by hugues.gauthier@gmail.com on 30 Mar 2010 at 5:55

[GoogleCodeExporter]

oh.. I see.

You're right, everything is there. We could move the width and height 
calculations 
into it's own method that would be called when we need to recompute column/row 
dimensions. That way the resize plugin could call it when moving column sizes 
and 
the resize() method can call it when the container resizes.

I'll work on getting this in this evening if I have time.

Original comment by jbomgard@gmail.com on 30 Mar 2010 at 6:38

[GoogleCodeExporter]

I notice too, that when the first I open the browser and first time the grid is
render, it render wrong, or css is half-applied. see shot. I have to refresh 
the page
to fix it.

revision #824, FF 3.6.2 samething with GC 4.1.249.1045 (42898)

Thanks

Original comment by hugues.gauthier@gmail.com on 31 Mar 2010 at 5:48

Attachments:

• shot.png

[GoogleCodeExporter]

Paul,
I spend the last two hours with finding out
1st: how to better use the IE debugger tools (yes I watched a microsoft video 
about
this!)
2nd: why ss.sheet.rules breaks.

when the first part of line 87 of Jx.Style is replaced by 'ss.styleSheet.rules'
instead of 'ss.sheet.rules' - it breaks afterwars inside the brackets because
'ss.insertRule' is not defined. I watched it over in firebug to see what
'ss.indicies' is about and I can't find anything comparable (that makes sense 
for me)
inside the IE 'ss' variable except 'ss.all.length' - which is '0' in that case 
exactly like 'ss.indicies.length' in any other browser.. 
Do you have any idea about this? I'm asking because I don't want to replace any
variables in one of the core classes without talking about it :)

Original comment by conrad.b...@gmail.com on 1 Apr 2010 at 2:42

[GoogleCodeExporter]

I'm sorry, I don't have any ideas right now.  Jon put this together from some 
sample code for manipulating css 
directly, I can't remember where I found it.

Original comment by pagameba on 1 Apr 2010 at 3:44

[GoogleCodeExporter]

I was able to do some troubleshooting on this issue during lunch today. I found 
the 
fix for IE8 to make the grid render properly (though there are a few issues to 
getting the various plugins - especiallythe selector plugin - working at 100%). 
I'll 
get the changes into SVN this evening -- hopefully.

FYI - the inidcies variable is something I added to track what index each 
different 
rule is added at. This is to make it easier to get and remove rules on teh fly 
without having to search through the entire stylesheet.

Jon

Original comment by jbomgard@gmail.com on 1 Apr 2010 at 9:11

[GoogleCodeExporter]

Just committed a fix to the grid that will allow resizing independent of 
rendering. If 
you need to resize the rows/cols you can call grid.resizeRowsCols(mode) where 
mode is 
one of "all", "rows", or "columns". If you leave it blank it defaults to all.

I also updated the paging toolbar grid example and committed a few other fixes.

Original comment by jbomgard@gmail.com on 20 Apr 2010 at 6:07

[GoogleCodeExporter]

Jon, I just tried the grid example with the resize plugin and the performance 
seems to have degraded significantly 
for the drag-to-resize column case.  I reverted to  r854 to check and the 
resize behaviour there is moderately 
smooth in  WebKit nightly build whereas the head version, the resize is very 
chunky.

I will try to dig into the performance problems before we close this issue.  Is 
there anything else needed for this 
issue before we can close it?

Original comment by pagameba on 20 Apr 2010 at 12:46

[GoogleCodeExporter]

I noticed the performance hit as well but didn't have time to address it. I 
tried 
simply having  the resize occur at the end of the drag (onComplete) but didn't 
like 
that the rows were all wacked out during the resize. Hopefully you'll be able 
to 
find a better answer.

The only other grid fix I have in the works is to make the extra column you 
added 
only show up if there are no expandable columns. Should have that done today or 
tomorrow (I hope).

Jon

Original comment by jbomgard@gmail.com on 20 Apr 2010 at 3:58

[GoogleCodeExporter]

I want noticed too, that the expendable column still over expend the gridbox

In the first shot (600px.png). I think the last column isnt calculated in the 
total
width.

.gridBox {
  display: block;
  position: relative;
  margin: 0px;
  border: 1px solid #ccc;
  width: 600px;
  height: 305px;
  clear: both;
}

second example 700px.png

.gridBox {
  display: block;
  position: relative;
  margin: 0px;
  border: 1px solid #ccc;
  width: 700px;
  height: 305px;
  clear: both;
}

In conclusion, the exendable column always over expend the witdh of the last 
column.

Thanks for your help

Original comment by hugues.gauthier@gmail.com on 20 Apr 2010 at 5:02

Attachments:

• 600px.PNG
• 700px.PNG

[GoogleCodeExporter]

Hughues,

I got this one figured out. Will try to get it into SVN for you test this 
evening.

Jon

Original comment by jbomgard@gmail.com on 20 Apr 2010 at 8:34

[GoogleCodeExporter]

expanding column fix committed in r858

Original comment by jbomgard@gmail.com on 20 Apr 2010 at 9:29

[GoogleCodeExporter]

r858 also fixes the addition of the extra column. It should only be added when 
there 
is no expandable column and is marked with the class of jxGridCellUnattached.

Jon

Original comment by jbomgard@gmail.com on 20 Apr 2010 at 9:31

[GoogleCodeExporter]

ok, spent some time looking at the performance issues with the resize and I 
know at least partially what the 
problem is.  The resizeRowsCols method actually deletes all existing rules and 
rebuilds them.  This is very 
expensive as each change causes a reflow and repaint in the browser.  It would 
be much more efficient if we just 
updated the existing rules, assuming they existed.  I've looked briefly at the 
relevant code and I think that we 
should do some optimization to use cached rules where they exist.  I will take 
a look at this next chance I get.

Original comment by pagameba on 21 Apr 2010 at 1:39

[GoogleCodeExporter]

Hi Jon,

The expendable column over expend just a little bit more. take a look.

Thanks

Original comment by hugues.gauthier@gmail.com on 21 Apr 2010 at 2:15

Attachments:

• shot.PNG

[GoogleCodeExporter]

i agree that that would be best however the reason I removed the stylesheet was 
that 
when measuring the rows after a column resize they were always coming out the 
same. 
The stylesheet rules were not allowing the grid to change the row heights. The 
way 
that I designed the row measuring was to allow the rows to naturally resize on 
the 
main part of the grid and then measure the height of each TR.

Now that I think about it the same could be accomplished by simply disabling 
the 
stylesheet however you would still get the reflow/repaint. The issue is that 
the only 
other way to do it is to do it the same way we do the column widths and measure 
each 
individual cell in the row and I'm not sure that would be any faster.

Hopefully you'll come up with some way to do this because I'm all out of ideas 
myself.

Jon

Original comment by jbomgard@gmail.com on 21 Apr 2010 at 2:15

[GoogleCodeExporter]

Hugues - 

Can you attach the actual code you're using here, or at least a reduced test 
case, as 
all my tests have this working perfectly. Also, what browser are you using here?

jon

Original comment by jbomgard@gmail.com on 21 Apr 2010 at 2:19

[GoogleCodeExporter]

Jon, aren't cells with a button/checkbox in it unattached too or have I
missunderstood something?

Original comment by conrad.b...@gmail.com on 21 Apr 2010 at 2:47

[GoogleCodeExporter]

revision #859
FF 3.6.3

take a look at the shoot.. I set the gridbox style to 100%.

JS:

function LoadGrid() 
{
    var parser = new Jx.Store.Parser.JSON();
    var full = new Jx.Store.Strategy.Full();

    var save = new Jx.Store.Strategy.Save({autoSave: true});
    var sort = new Jx.Store.Strategy.Sort({sortOnStoreEvents: null});

    prelighter = new Jx.Plugin.Grid.Prelighter({});
    selector = new Jx.Plugin.Grid.Selector({
        row:true,
        useCheckColumn:true,
        checkAsHeader:true,
        multiple:true
    });
    sorter = new Jx.Plugin.Grid.Sorter({});

    store = new Jx.Store({
        columns:[
                {name: 'IdEvent', type: 'numeric'},
                {name: 'Name', type: 'alphanumeric'},
                {name: 'Description', type: 'alphanumeric'},
                {name: 'Edit', type: 'alphanumeric'},
                {name: 'Status', type: 'alphanumeric'},
                {name: 'Delete', type: 'alphanumeric'}
                ],
        protocol: new Jx.Store.Protocol.Ajax({
                     requestOptions: {
                                     async: false,
                                     wait: true,
                                     link: 'chain'
                                     },

                     urls:  {
                                read: 'Ajax.Events.GetListEnabled.php',
                                'delete': 'Ajax.Events.Delete.php'
                            },
                     parser: new Jx.Store.Parser.JSON(),
                     rest: false
                }),
        strategies: [full,save,sort],
        record: Jx.Record
    });

    //setup options
    var options = {
      parent: 'gridEventEnabled',
      row: {
            useHeaders: true,
            alternateRowColors: true,
            headerColumn: 'header',
            rowHeight: 'auto'
            },
      columns: {
          headerRowHeight: 20,
          useHeaders: true,
          columns: [{
              template: '<span class="jxGridCellContent"> </span>',
              isEditable: false,
              isSortable: false,
              isResizable: false,
              isHidden: true,
              name: 'IdEvent',
              dataType: 'numeric'
          },{
              template: '<span class="jxGridCellContent">Name</span>',
              isEditable: false,
              isSortable: true,
              isResizable: false,
              name: 'Name',
              dataType: 'alphanumeric'
          },{
              template: '<span class="jxGridCellContent">Description</span>',
              renderMode: 'expand',
              isEditable: false,
              isSortable: false,
              isResizable: true,
              name: 'Description',
              dataType: 'alphanumeric'
          },{
              template: '<span class="jxGridCellContent"> </span>',
              isEditable: false,
              isSortable: false,
              isResizable: false,
              name: 'Edit',
              dataType: 'alphanumeric'
          },{
              template: '<span class="jxGridCellContent"> </span>',
              isEditable: false,
              isSortable: false,
              isResizable: false,
              name: 'Status',
              dataType: 'alphanumeric'
          },{
              template: '<span class="jxGridCellContent"> </span>',
              isEditable: false,
              isSortable: false,
              isResizable: false,
              name: 'Delete',
              dataType: 'alphanumeric'
          }]
      },
      model: store
    };

    //create grid
    grid = new Jx.Grid(options);

    store.addEvent(
        'storeDataLoaded', function () {

            prelighter.activate('cell');
            prelighter.attach(grid);

            selector.attach(grid);

            grid.render();

        });

    store.load();

    // trap gridCellSelect event
    grid.addEvent('gridCellSelect', function(cell)
    {
        var data = cell.retrieve('jxCellData');
        store.moveTo(data.row);
        var row = store.getRecord();

        if ( data.col['name'] == "Delete" )
        {

            var confirmDelete = new Jx.Dialog.Confirm({
                question:'Are you sure you want delete the ' + row.get("Name") + ' event ?'
            });

            confirmDelete.addEvent('close',function(dialog, result)
            {
                if ( result == "Yes" )
                {
                    DeleteEvent( row.get("IdEvent"), data.row );
                }
            });

            confirmDelete.open();           

        }

        if(data.col['name'] == "Edit" ){
          EditEvent( row.get("IdEvent"), row.get("Name") );
        }
    });

}

styles:
<style>
.tmp{background-color:whitesmoke; width:100%;}
.tmp th{height:30px;background-color:silver;}
.tmp td{height:25px;border:1px solid silver;text-align:center;}
#layout{
    border-color:#F0F0F0 #CCCCCC #CCCCCC #F0F0F0;
    border-style:solid;
    border-width:1px;
}
#TextName{
    width:250px;
}

.gridBox {
  display: block;
  position: relative;
  margin: 0px;
  border: 1px solid #ccc;
  width: 800px;
  height: 305px;
  clear: both;
}

#divListing{margin: 20px;}

.textWrap { white-space: normal }
.jxGridCellContent{ text-align: left }
.jxInputCheck{ vertical-align: bottom }

</style>

Thanks for your help

Original comment by hugues.gauthier@gmail.com on 21 Apr 2010 at 2:48

Attachments:

• shot.PNG

[GoogleCodeExporter]

Conrad,

Buttons would be but the checkbox doesn't have to be. The checkbox renderer can 
be 
used with or without a store. I haven't gone through and changed those yet but 
I 
will whenI have a chance.

Jon

Original comment by jbomgard@gmail.com on 21 Apr 2010 at 4:11

[GoogleCodeExporter]

You don't need to worry about this too much Jon. It isn't that important that 
you
would need to take care of it hasty :)

Original comment by conrad.b...@gmail.com on 21 Apr 2010 at 10:37

[GoogleCodeExporter]

Are you able to reproduce the issue ?

Thanks

Original comment by hugues.gauthier@gmail.com on 23 Apr 2010 at 1:22

[GoogleCodeExporter]

r878 has changes for marking all unattached columns as such. see the code for 
details.

Original comment by jbomgard@gmail.com on 25 Apr 2010 at 10:11

[GoogleCodeExporter]

hugues,

I started to look at this but realized I also need some of the data that you're 
passing via the ajax request (or at least a representative sampling).

I added a page in the example directory that I'll use to replicate what's going 
on. 
it's called simply "test.html".  I stripped out the column event stuff so I 
could 
just concentrate on the grid render.

Thanks,
Jon

Original comment by jbomgard@gmail.com on 25 Apr 2010 at 10:24

[GoogleCodeExporter]

check out the comment #18 , there is my json result passed to the grid there.

thanks

Original comment by hugues.gauthier@gmail.com on 26 Apr 2010 at 12:24

[GoogleCodeExporter]

hugues,

The data in comment 18 doesn't match the columns in the store in comment 42. 
Your store 
there has 3 columns (edit, status, and delete) that are not in the json file.

Jon

Original comment by jbomgard@gmail.com on 26 Apr 2010 at 8:14

[GoogleCodeExporter]

Here is the good JSON

{"success":true,"meta":null,"data":[{"IdEvent":"1","Name":"Camp
7-9","Description":"\u00c0 travers des journ\u00e9es th\u00e9matiques, les 
enfants
sont invit\u00e9s \u00e0 vivre d'extraordinaires activit\u00e9s qui leur 
permettront
de d\u00e9couvrir la faune, la flore ainsi que la culture d'ici et
d'ailleurs.","IsEnabled":"1","Edit":"<img src=\"\/img\/menu\/16\/pencil.png\"
\/>","Status":"<img src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"},{"IdEvent":"2","Name":"Camp
10-12","Description":"Quelques soient leurs go\u00fbts, les enfants seront
combl\u00e9s puisque sports, journ\u00e9es th\u00e9matiques et plus d'une 
dizaines
d'ateliers au choix (th\u00e9\u00e2tre, canotage, bricolage, activit\u00e9s
aquatiques, tir \u00e0 l'arc, tir \u00e0 la carabine, etc.) seront au programme.
","IsEnabled":"1","Edit":"<img src=\"\/img\/menu\/16\/pencil.png\"
\/>","Status":"<img src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"},{"IdEvent":"3","Name":"Camp
13-17","Description":"Deux semaines remplies de plaisir, d'aventure, de 
nouvelles
rencontres et de d\u00e9couvertes, voil\u00e0 ce qui attend les
adolescents.","IsEnabled":"1","Edit":"<img src=\"\/img\/menu\/16\/pencil.png\"
\/>","Status":"<img src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"},{"IdEvent":"5","Name":"Camp
Familial","Description":"Le camp familial vous permet de passer du temps loin 
des
pr\u00e9occupations de la ville, des t\u00e2ches domestiques, de faire des 
rencontres
int\u00e9ressantes et de prendre du temps pour \u00e9tudier la Bible. Des
activit\u00e9s adapt\u00e9es \u00e0 chaque groupe d'\u00e2ge sont offertes dans 
la
journ\u00e9e mais, n'ayez crainte, vous aurez amplement le temps de relaxer et 
de
profiter du merveilleux environnement qui s'offrira \u00e0
vous.","IsEnabled":"1","Edit":"<img src=\"\/img\/menu\/16\/pencil.png\"
\/>","Status":"<img src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"},{"IdEvent":"6","Name":"Camp
18+","Description":"Ce camp se veut une fin de semaine de ressourcement pour 
jeunes
adultes afin de marquer la fin des vacances et les pr\u00e9parer \u00e0 servir 
le
Seigneur l\u00e0 o\u00f9 il les appelle. C'est aussi l'occasion de rencontrer de
nouveaux amis.","IsEnabled":"1","Edit":"<img src=\"\/img\/menu\/16\/pencil.png\"
\/>","Status":"<img src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"},{"IdEvent":"7","Name":"Camp pour
adultes","Description":"Les adultes de tous \u00e2ges sont invit\u00e9s \u00e0 
se
rencontrer pour quelques jours de d\u00e9tente, de plaisir et d'\u00e9tude de la
Bible. Un v\u00e9ritable ressourcement.","IsEnabled":"1","Edit":"<img
src=\"\/img\/menu\/16\/pencil.png\" \/>","Status":"<img
src=\"\/img\/menu\/16\/stop.png\" \/>","Delete":"<img
src=\"\/img\/menu\/16\/cross.png\" \/>"}]}

Thanks

Original comment by hugues.gauthier@gmail.com on 26 Apr 2010 at 2:37