[sailwave] sortable html table results

Imported from Yahoo
1

Thanks to Colin for the pointer for a solution.

This is what I have done to get the results table so that clicking on the column headings sorts by that column. The below uses the sorttable.js file, but you can replace that file with your own favorite table sorting js and it should work.

Method 1:

  • Step 4: When you publish - it should just work (i.e., the table should be sortable)

Method 2 (note Steps 2 and 3 are identical for Method 1 and Method 2):

  • Step one: add this .js file http://www.kryogenix.org/code/browser/sorttable/sorttable.js to the sailwave javascript folder (note, you should remove the comments that contain quotes, if any, from the javascript file as that caused problems for me).
  • Step two: add the below line to the Sailwave/Templates/header.txt file between in the “” and “” lines.
  • Step 4: When you publish - you have to enable the effect sorttable in the final publish pop up.

Method 1 keeps the results html files small, but the sorting will only work if the sorttable.js file is located in the right place.

Method 2 results in the sorting code being placed inside the html file, so the file is larger, but the sorting should always work (i.e., does not depend on the .js file).

2

Are there results or example results with sortable posted on a website anywhere?

regards,
Malcolm Osborne
Sedgefield South Africa

···

On 2014/05/20 19:09, Scott Rickard rickard23@yahoo.com [sailwave] wrote:

Thanks to Colin for the pointer for a solution.

This is what I have done to get the results table so that clicking on the column headings sorts by that column. The below uses the sorttable.js file, but you can replace that file with your own favorite table sorting js and it should work.

Method 1:

  * Step one: add this .js
    filehttp://www.kryogenix.org/code/browser/sorttable/sorttable.jsto
    the web folder where the results will uploaded.
  * Step two: add the below line to the Sailwave/Templates/header.txt
    file between in the "</script>" and "</head>" lines.

<script src="sorttable.js"></script><script>

  * Step 3: add the below code to the Sailwave/Templates/footer.txt
    file before the </body> line.

<script>
var table_array = document.getElementsByClassName("summarytable");
for (i=0;i<table_array.length;i++) {
  table_array[i].setAttribu te("class","summarytable sortable");
}
</script>

  * Step 4: When you publish - it should just work (i.e., the table
    should be sortable)

Method 2 (note Steps 2 and 3 are identical for Method 1 and Method 2):

  * Step one: add this .js
    filehttp://www.kryogenix.org/code/browser/sorttable/sorttable.jsto
    the sailwav e javascript folder (note, you should remove the
    comments that contain quotes, if any, from the javascript file as
    that caused problems for me).
  * Step two: add the below line to the Sailwave/Templates/header.txt
    file between in the "</script>" and "</head>" lines.

<script src="sorttable.js"></script><script>

  * Step 3: add the below code to the Sailwave/Templates/footer.txt
    file before the </body> line.

<script>
var table_array = document.getElementsByClassName("summarytable");
for (i=0;i<table_array.length;i++) {
  table_array[i].setAttribute("class", "summarytable sortable");
}
</script>

  * Step 4: When you publish - you have to enable the effect sorttable
    in the final publish pop up.

Method 1 keeps the results html files small, but the sorting will only work if the sorttable.js file is located in the right place.
Method 2 results in the sorting code being placed inside the html file, so the file is larger, but the sorting should always work (i.e., does not depend on the .js file).

------------------------------------------------------------------------
<http://www.avast.com/>

This email is free from viruses and malware because avast! Antivirus <http://www.avast.com/> protection is active.

---
This email is free from viruses and malware because avast! Antivirus protection is active.
http://www.avast.com

3

Slightly different approach and by no means perfect but does the trick for us:

http://www.eastdorsetsailingclub.co.uk/activities/results/?race=friday_race_series_cruisers_2014_fleet_1_part_1

Arjen

···

Are there results or example results
with sortable posted on a website anywhere?

  On 2014/05/20 19:09, Scott Rickard [sailwave]

wrote:

regards,
Malcolm Osborne
Sedgefield South Africa

rickard23@yahoo.com

Thanks to Colin for the pointer for a solution.

          This is what I have done to get the results table so

that clicking on the column headings sorts by that column.
The below uses the sorttable.js file, but you can replace
that file with your own favorite table sorting js and it
should work.

Method 1:

          <script

src=“sorttable.js”> 

  •               Step 4: When you publish - it should just work
    (i.e., the table should be sortable)
          Method 2 (note Steps 2 and 3 are identical for Method 1

and Method 2):

  •                   Step one: add this .js
    file http://www.kryogenix.org/code/browser/sorttable/sorttable.js to the sailwav e
    javascript folder (note, you should remove the
    comments that contain quotes, if any, from the
    javascript file as that caused problems for me).
  •                   Step two: add the below
    line to the Sailwave/Templates/header.txt file
    between in the “” and
    “” lines.
            <script

src=“sorttable.js”> 

  •                 Step 4: When you publish - you have to enable the
    effect sorttable in the final publish pop up.
          Method 1 keeps the results html files small, but the

sorting will only work if the sorttable.js file is located
in the right place.

          Method 2 results in the sorting code being placed

inside the html file, so the file is larger, but the
sorting should always work (i.e., does not depend on the
.js file).


This email is free from viruses and
malware because avast! Antivirus
protection is active.




This email is free from viruses and malware because avast! Antivirus protection is active.

4

Arjen,

Thanks for the link but if East Dorset using Sailwave they are in

breach of the simple condition of use, i.e . they do not have
a link to Sailwave on the results page or anywhere on the website
that I have found.

Kind regards,
Huw
···

On 20/05/2014 20:16, Arjen Schipmolder
[sailwave] wrote:

schipmolder@gmail.com

            Slightly different approach and by no means perfect

but does the trick for us:

http://www.eastdorsetsailingclub.co.uk/activities/results/?race=friday_race_series_cruisers_2014_fleet_1_part_1

Arjen

            On 20 May 2014, at 19:43, "Malcolm Osborne malcolmo@telkomsa.net
            [sailwave]" <sailwave@yahoogroups.com                >

wrote:


This email is free from viruses and
malware because avast! Antivirus
protection is active.




This email is free from viruses and malware because avast! Antivirus protection is active.

                  Are there results or

example results with sortable posted on a website
anywhere?

                  On 2014/05/20 19:09, Scott Rickard [sailwave] wrote:

regards,
Malcolm Osborne
Sedgefield South Africa

rickard23@yahoo.com

                      Thanks to Colin for the pointer for a

solution.

                      This is what I have done to get the results

table so that clicking on the column headings
sorts by that column. The below uses the
sorttable.js file, but you can replace that
file with your own favorite table sorting js
and it should work.

Method 1:

                      <script

src=“sorttable.js”> 

  •                           Step 4: When you publish - it should
    just work (i.e., the table should be
    sortable)
                      Method 2 (note Steps 2 and 3 are identical

for Method 1 and Method 2):

  • Step one: add this .js file http://www.kryogenix.org/code/browser/sorttable/sorttable.js to the sailwav e javascript
    folder (note, you should remove the
    comments that contain quotes, if any,
    from the javascript file as that
    caused problems for me).
  •                               Step two: add the below line to
    the Sailwave/Templates/header.txt file
    between in the “” and
    “” lines.
                        <script

src=“sorttable.js”> 

  •                             Step 4: When you publish - you have to
    enable the effect sorttable in the final
    publish pop up.
                      Method 1 keeps the results html files

small, but the sorting will only work if the
sorttable.js file is located in the right
place.

                      Method 2 results in the sorting code being

placed inside the html file, so the file is
larger, but the sorting should always work
(i.e., does not depend on the .js file).


This email is free from viruses and
malware because avast!
Antivirus protection is active.


This email is free from viruses and
malware because avast!
Antivirus protection is active.

5

Hmm used to be on there.

I’ll have a look what happened to that, thanks for flagging.

···

On 20/05/2014 20:16, Arjen Schipmolder
[sailwave] wrote:

schipmolder@gmail.com

            Slightly different approach and by no means perfect

but does the trick for us:

http://www.eastdorsetsailingclub.co.uk/activities/results/?race=friday_race_series_cruisers_2014_fleet_1_part_1

Arjen

            On 20 May 2014, at 19:43, "Malcolm Osborne malcolmo@telkomsa.net
            [sailwave]" <sailwave@yahoogroups.com                >

wrote:


This email is free from viruses and
malware because avast! Antivirus
protection is active.

                  Are there results or

example results with sortable posted on a website
anywhere?

                  On 2014/05/20 19:09, Scott Rickard [sailwave] wrote:

regards,
Malcolm Osborne
Sedgefield South Africa

rickard23@yahoo.com

                      Thanks to Colin for the pointer for a

solution.

                      This is what I have done to get the results

table so that clicking on the column headings
sorts by that column. The below uses the
sorttable.js file, but you can replace that
file with your own favorite table sorting js
and it should work.

Method 1:

                      <script

src=“sorttable.js”> 

  •                           Step 4: When you publish - it should
    just work (i.e., the table should be
    sortable)
                      Method 2 (note Steps 2 and 3 are identical

for Method 1 and Method 2):

  • Step one: add this .js file http://www.kryogenix.org/code/browser/sorttable/sorttable.js to the sailwav e javascript
    folder (note, you should remove the
    comments that contain quotes, if any,
    from the javascript file as that
    caused problems for me).
  •                               Step two: add the below line to
    the Sailwave/Templates/header.txt file
    between in the “” and
    “” lines.
                        <script

src=“sorttable.js”> 

  •                             Step 4: When you publish - you have to
    enable the effect sorttable in the final
    publish pop up.
                      Method 1 keeps the results html files

small, but the sorting will only work if the
sorttable.js file is located in the right
place.

                      Method 2 results in the sorting code being

placed inside the html file, so the file is
larger, but the sorting should always work
(i.e., does not depend on the .js file).


This email is free from viruses and
malware because avast!
Antivirus protection is active.


This email is free from viruses and
malware because avast!
Antivirus protection is active.




This email is free from viruses and malware because avast! Antivirus protection is active.

6

Well researched Scott. A great addition to Sailwave publishing.

Ian.

···

On 20 May 2014 18:09, Scott Rickard rickard23@yahoo.com [sailwave] sailwave@yahoogroups.com wrote:

Thanks to Colin for the pointer for a solution.

This is what I have done to get the results table so that clicking on the column headings sorts by that column. The below uses the sorttable.js file, but you can replace that file with your own favorite table sorting js and it should work.

Method 1:

  • Step 4: When you publish - it should just work (i.e., the table should be sortable)

Method 2 (note Steps 2 and 3 are identical for Method 1 and Method 2):

  • Step one: add this .js file http://www.kryogenix.org/code/browser/sorttable/sorttable.js to the sailwave javascript folder (note, you should remove the comments that contain quotes, if any, from the javascript file as that caused problems for me).
  • Step two: add the below line to the Sailwave/Templates/header.txt file between in the “” and “” lines.
  • Step 4: When you publish - you have to enable the effect sorttable in the final publish pop up.

Method 1 keeps the results html files small, but the sorting will only work if the sorttable.js file is located in the right place.

Method 2 results in the sorting code being placed inside the html file, so the file is larger, but the sorting should always work (i.e., does not depend on the .js file).