I have come across this neat Javascript table sorter at http://kryogenix.org/code/browser/sorttable/ It seems straigh forward to use but i cant get it to work. I have included in the head <script src="javascripts/sorttable.js" type="text/javascript"></script> In the View <table class="sortable" id="anyid"> <thead> <th>Numbers</th> <th>Alphabet</th> <th>Dates</th> <th>Currency</th> </thead> <tr> <td>1</td> <td>Z</td> <td>01-01-2006</td> <td>€ 5.00</td> </tr> <tr> <td>2</td> <td>y</td> <td>04-13-2005</td> <td>€ 6.70</td> </tr> <tr> <td>3</td> <td>X</td> <td>08-17-2006</td> <td>€ 6.50</td> </tr> <tr> <td>4</td> <td>w</td> <td>01-01-2005</td> <td>€ 4.20</td> </tr> <tr> <td>5</td> <td>V</td> <td>05-12-2006</td> <td>€ 7.15</td> </tr> </table> The table is displayed but the table headers are not sortable. Has anyone got any ideas? -- Posted via http://www.ruby-forum.com/.
Sorry, i forgot to mention. I have gotten this to work in a normal html page with the same code Is the problem rails specific? -- Posted via http://www.ruby-forum.com/.
Johnny B wrote: > I have come across this neat Javascript table sorter at > http://kryogenix.org/code/browser/sorttable/ > > It seems straigh forward to use but i cant get it to work. > > I have included in the head ><script src="javascripts/sorttable.js" type="text/javascript"></script> Your problem may lie in this include line. Make sure this is absolute, IE: <script src="/javascripts/sorttable.js" type="text/javascript"></script> (note the prepended ''/'') Otherwise if you access a route of say /test/sortable/ it will be looking for the javascript in /test/sortable/javascripts/ and not /javascripts/ Hope that helps. -- R.Livsey http://livsey.org> > In the View > <table class="sortable" id="anyid"> > <thead> > <th>Numbers</th> > <th>Alphabet</th> > <th>Dates</th> > <th>Currency</th> > </thead> > <tr> > <td>1</td> > <td>Z</td> > <td>01-01-2006</td> > <td>€ 5.00</td> > </tr> > <tr> > <td>2</td> > <td>y</td> > <td>04-13-2005</td> > <td>€ 6.70</td> > </tr> > <tr> > <td>3</td> > <td>X</td> > <td>08-17-2006</td> > <td>€ 6.50</td> > </tr> > <tr> > <td>4</td> > <td>w</td> > <td>01-01-2005</td> > <td>€ 4.20</td> > </tr> > <tr> > <td>5</td> > <td>V</td> > <td>05-12-2006</td> > <td>€ 7.15</td> > </tr> > </table> > > The table is displayed but the table headers are not sortable. > > Has anyone got any ideas? >
Thanks for yuor response, i have tried the absolute location with but this makes no difference. <script src="/javascripts/sorttable.js" type="text/javascript"></script> I am using some other stuff form prototype and scriptaculous on the same page and the drag and drop and autocomplete are working fine. The sorttable.js is definetly in the javascripts folder so the fact that i got the same code to work in a general html page made me think i may be doing something wrong in rails. <script src="javascripts/sorttable.js" type="text/javascript"></script> <script src="javascripts/prototype.js" type="text/javascript"></script> <script src="javascripts/effects.js" type="text/javascript"></script> Is there anything else you can think off? -- Posted via http://www.ruby-forum.com/.
On 21 Apr 2006, at 10:49, Johnny B wrote:> Thanks for yuor response, i have tried the absolute location with but > this makes no difference. > <script src="/javascripts/sorttable.js" type="text/javascript"></ > script> > > > I am using some other stuff form prototype and scriptaculous on the > same > page and the drag and drop and autocomplete are working fine. The > sorttable.js is definetly in the javascripts folder so the fact that i > got the same code to work in a general html page made me think i > may be > doing something wrong in rails. > > <script src="javascripts/sorttable.js" type="text/javascript"></ > script> > <script src="javascripts/prototype.js" type="text/javascript"></ > script> > <script src="javascripts/effects.js" type="text/javascript"></script> > > Is there anything else you can think off?Maybe there''s something in prototype or effects that overrides a function/event of your sorttable. Have you tried moving the sorttable.js after the prototype and effects script tag? Best regards Peter De Berdt
Yes i have tried placing the sorttable.js at the end of the list. I even removed the protype/effests.js because i thought the same that maybe they were overriding the sorttable.js. That is why i created a html page on its own and included the the sorttable.js and it worked fine. I have moved the sorttable.js into the public folder and tried the code below without success <script src="sorttable.js" type="text/javascript"></script>. I am going to try some rico stuff now so i''ll see how that goes. Baffling!! -- Posted via http://www.ruby-forum.com/.
Does the Rails generated HTML validate via W3C? -- -- Tom Mornini On Apr 21, 2006, at 2:44 AM, Johnny B wrote:> Yes i have tried placing the sorttable.js at the end of the list. I > even removed the protype/effests.js because i thought the same that > maybe they were overriding the sorttable.js. > > That is why i created a html page on its own and included the the > sorttable.js and it worked fine. > > I have moved the sorttable.js into the public folder and tried the > code > below without success > > <script src="sorttable.js" type="text/javascript"></script>. > > I am going to try some rico stuff now so i''ll see how that goes. > > Baffling!!
Tom Mornini wrote:> Does the Rails generated HTML validate via W3C? > > -- > -- Tom MorniniI dont know what you mean by "Does the Rails generated HTML validate via W3C?" I''m new to rails, only started using it a few weeks ago. I have tried to use rico and it seems to be the same problem. Rico needs prototype so i have checked my prototype version and its 1.5. The code i have used is below: #Layout <script src="javascripts/prototype.js" type="text/javascript"></script> <script src="javascripts/effects.js" type="text/javascript"></script> <script src="javascripts/controls.js" type="text/javascript"></script> <script src="javascripts/dragdrop.js" type="text/javascript"></script> <script src="javascripts/application.js" type="text/javascript"></script> <script src="javascripts/rico.js" type="text/javascript"></script> #View <div id="name_panel"> <table id="data_grid" class="live_grid" cellspacing="0" cellpadding="0"> <thead> <tr> <th class="first cellHeader">#</th> <th class="title cellHeader">Name</th> </tr></thead> <tbody> <% n = 1 %> <% for name in @names %> <tr> <td class="first cell"><%= n %></td> <td class="title cell"><%= name.name %></td> </tr> <% n += 1 %> <% end %> </tbody> </table> </div> #Controller def ajax @names = Name.find(:all) render :partial => ''blog/scriptexamples/ajax'' end What the about shows is below but with no sorting ability # Name 1 John 2 Thomas 3 Paul 4 Craig 5 Andrew 6 Mike 7 David 8 Karl 9 Ricky 10 Jeff 11 Jeremy 12 Timothy 13 Jack 14 Brian 15 Barry 16 William 17 Jonathon I have drag and drop, autcomplete scriptaculous examples on this page and they work fine. -- Posted via http://www.ruby-forum.com/.
If i put the following code in the layout it works fine: <table class="sortable" id="anyid"> <thead> <th>Numbers</th> <th>Alphabet</th> <th>Dates</th> <th>Currency</th> </thead> <tr> <td>1</td> <td>Z</td> <td>01-01-2006</td> <td>€ 5.00</td> </tr> <tr> <td>2</td> <td>y</td> <td>04-13-2005</td> <td>€ 6.70</td> </tr> <tr> <td>3</td> <td>X</td> <td>08-17-2006</td> <td>€ 6.50</td> </tr> <tr> <td>4</td> <td>w</td> <td>01-01-2005</td> <td>€ 4.20</td> </tr> <tr> <td>5</td> <td>V</td> <td>05-12-2006</td> <td>€ 7.15</td> </tr> </table> This code will not work in the template scriptexamples/_ajax.rhtml, It looks like it cant find the sorttable.js in the public folder. Is there amy way to include it again on the template _ajax.rhtml? <script src="sorttable.js" type="text/javascript"></script> -- Posted via http://www.ruby-forum.com/.
I know what the problem is but don''t know why it is happening. If i place the sortable table in any view that isn''t called using AJAX it works. If i put the table code on the view index.rhtml it works <%= link_to ''Savantis Blog'', :action => ''index'', :collection => @posts %> If i put the table code on the view _ajax.rhtml and use the link_to_remote the scrollable table doesn''t work: <%= link_to_remote(''Scriptaculous'', :update => ''maindiv'', :url =>{ :action => ''ajax'' })%> <table class="sortable" id="anyid"> <tr> <th>Numbers</th> <th>Alphabet</th> <th>Dates</th> <th>Currency</th> </tr> <tr> <td>1</td> <td>Z</td> <td>01-01-2006</td> <td>€ 5.00</td> </tr> <tr> <td>2</td> <td>y</td> <td>04-13-2005</td> <td>€ 6.70</td> </tr> <tr> <td>3</td> <td>X</td> <td>08-17-2006</td> <td>€ 6.50</td> </tr> <tr> <td>4</td> <td>w</td> <td>01-01-2005</td> <td>€ 4.20</td> </tr> <tr> <td>5</td> <td>V</td> <td>05-12-2006</td> <td>€ 7.15</td> </tr> </table> Is there any reason for this? I have scriptaculous ajax stuff working on the same page but the table using the sorttable.js doesn''t? -- Posted via http://www.ruby-forum.com/.
On 21 Apr 2006, at 14:36, Johnny B wrote:> I know what the problem is but don''t know why it is happening. If i > place the sortable table in any view that isn''t called using AJAX it > works. If i put the table code on the view index.rhtml it worksAha, couldn''t it be because your sorttable.js initializes everything on window.load (JavaScript experts, correct me if I''m wrong, I''m not that much of a JS guru :-)) addEvent(window, "load", sortables_init); With this function, your page is searched for tables which need to be sortable and then the necessary events are attached, ? When you replace certain parts of your page using AJAX, the onload event doesn''t fire anymore, so the new table isn''t getting the necessary events added to be sortable. You should be able to call the sortables_init() function again after each AJAX call, so that your table gets the events it needs. Don''t know if something in the JavaScript can be replaced to automatically do this on each call to the page, whether it''s through normal loading or AJAX. Best regards Peter De Berdt
Thanks peter that makes sense. The sorttable.js does contain the code below so when i''m using an ajax call to render the partial the neccessary events arn''t attached to the sortable table as you stated. addEvent(window, "load", sortables_init); I''m new to rails and javascript so i will search the web for a solution but if anyone has any good idea''s it will be much appreciated! -- Posted via http://www.ruby-forum.com/.
>>> If i put the table code on the view _ajax.rhtml and use the >>> link_to_remote the scrollable table doesn''t work: >>> >>> <%= link_to_remote(''Scriptaculous'', :update => ''maindiv'', :url =>{ >>> :action => ''ajax'' })%> >>> >> When you replace certain parts of your page using AJAX, the onload >> event doesn''t fire anymore, so the new table isn''t getting the >> necessary events added to be sortable. >> >> You should be able to call the sortables_init() function again after >> each AJAX call, so that your table gets the events it needs. Don''t >> know if something in the JavaScript can be replaced to automatically >> do this on each call to the page, whether it''s through normal loading >> or AJAX. > > I''m new to rails and javascript so i will search the web for a solution > but if anyone has any good idea''s it will be much appreciated!<%= link_to_remote(''Scriptaculous'', :update => ''maindiv'', :complete => ''sortables_init()'', :url =>{ :action => ''ajax'' } ) %>