[jQuery] Re: Moving the COLUMNS of a table around

[G[N]Urpreet Singh]

Yes, worked bro...
Thanks...
g

On 7/16/07, Richard D. Worth <[EMAIL PROTECTED]> wrote:
>
> Try this:
>
> var aLeft = $(document.createElement('a')).attr('href',
> '#').html('&lt;').addClass('aLeft');
> var aRight = $(document.createElement('a')).attr('href',
> '#').html('&gt;').addClass('aRight');
> $('th').prepend(aLeft, '&nbsp;').append('&nbsp;', aRight);
>
> $('.aLeft').click(function() {
>     var n = 0, th = $(this).parent('th')[0];
>     $(this).parents('tr:eq(0)').find('th').each(function(i) { // find 'n'
> of clicked column
>         n++; return ($(this)[0] != th)
>     });
>     $('th:nth-child(' + n + '), td:nth-child(' + n + ')').each(function()
> {
>         $(this).insertBefore($(this).prev()); // move column to left
>     });
>     return false;
> });
>
> $('.aRight').click(function() {
>     var n = 0, th = $(this).parent('th')[0];
>     $(this).parents('tr:eq(0)').find('th').each(function(i) { // find 'n'
> of clicked column
>         n++; return ($(this)[0] != th)
>     });
>     $('th:nth-child(' + n + '), td:nth-child(' + n + ')').each(function()
> {
>         $(this).insertAfter($(this).next()); // move column to right
>     });
>     return false;
> });
>
> Another option is add a unique class for each col (TH, TD) and use that
> instead of nth-child.
>
> - Richard
>
> On 7/16/07, G[N]Urpreet Singh <[EMAIL PROTECTED]> wrote:
> >
> > Hi,
> > I was trying to move around the columns of a table. I noticed that you
> > can specify styles for columns using the <col> html construct.
> >
> > I tried this...
> >
> > <script language="javascript">
> >  $(document).ready(function()
> >  {
> >     $("#switch").click(function()
> >             { $("#2").hide(); });
> >  });
> > </script>
> > <table border="1">
> >     <col id="1" width="20px" />
> >     <col id="2" width="20px" />
> >     <col id="3" width="20px" />
> >     <col id="4" width="20px" />
> >     <col id="5" width="20px" />
> >     <col id="6"  width="20px"/>
> >     <tbody>
> >         <tr>
> >             <th>1</th><th>2</th><th>3</th><th>4</th><th>5</th><th>6</th>
> >
> >         </tr>
> >         <tr>
> >             <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
> >         </tr>
> >         <tr>
> >             <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
> >         </tr>
> >     </tbody>
> > </table>
> >
> >
> > Here only "Hide" worked. Remove, insertBefore, insertAfter did not work
> > for obvious reasons
> >
> > Any ideas on how to achieve that?? reordering the columns of a table...
> >
> > Gurpreet
> > --
> > Gurpreet Singh
> >
>
>


-- 
Gurpreet Singh