Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Aug 2007
    Posts
    71
    Thanks
    17
    Thanked 0 Times in 0 Posts

    Need a sortable table as an embed

    I have done a lot of searching for sortable tables. I have found the codes on kryogenix and yoast to add to a table to make it sortable. Problem is, I want to embed the tables on wix and ning sites and into mailchimp emails. So the code on these sites won't work for these platforms.

    The only option I could find was keepandshare.com, but it is a subscription site and i could not figure it out using the 14 day free trial.

    Below is a sample script of a table I have created. Can anyone help to add code to it that will make it sortable that I can apply to other simple tables and then be able to embed them? Thanks!!

    Code:
    <style type="text/css">
    	table.tableizer-table {
    	border: 1px solid #CCC; font-family: Arial, Helvetica, sans-serif
    	font-size: 12px;
    } 
    .tableizer-table td {
    	padding: 4px;
    	margin: 3px;
    	border: 1px solid #ccc;
    }
    .tableizer-table th {
    	background-color: #104E8B; 
    	color: #FFF;
    	font-weight: bold;
    }
    </style>
    <table class="tableizer-table">
    <tr class="tableizer-firstrow"><th>First Name</th><th>Last Name</th><th>Name of School</th><th>Level of School</th><th>Title</th><th>City</th><th>State</th><th>School #</th><th>Cell #</th><th>School Email Address</th></tr>
     <tr><td>Kristin</td><td>Schalk</td><td>Fort Scott Community College</td><td>JUCO/CC</td><td>Head Coach</td><td>Fort Scott</td><td>KS</td><td>(620) 2232700</td><td>(740) 7390125</td><td>kristins@fortscott.edu </td></tr>
     <tr><td>Megan</td><td>Cairns</td><td>North Central Missouri College</td><td>CC/JUCO</td><td>Head Coach</td><td>Trenton</td><td>Mo</td><td>(660) 3593748</td><td>(816) 5176156</td><td>mcairns@mail.ncmissouri.edu</td></tr>
     <tr><td>Cassie </td><td>Cunningham</td><td>Ohio Wesleyan University</td><td>D3</td><td>Head Coach</td><td>Delaware</td><td>OH</td><td>(740) 368-3737</td><td>(614) 361-6711</td><td>cccunnin@owu.edu</td></tr>
     <tr><td>Diana </td><td>Pepin</td><td>Eastern CT State University</td><td>Division 3</td><td>Head Coach</td><td>Willimantic</td><td>CT</td><td>(860) 465-5182</td><td>(860) 614-6201</td><td>pepind@easternct.edu</td></tr>
     <tr><td>Allen</td><td>Kent</td><td>Copiah-Lincoln Community College</td><td>CC/JUCO</td><td>Head Coach</td><td>Wesson</td><td>MS</td><td>(601) 643-8314</td><td>(601) 757-0269</td><td>allen.kent@colin.edu</td></tr>
     <tr><td>Will</td><td>Atkinson</td><td>University of West Alabama</td><td>Division 2</td><td>Head Coach</td><td>Livingston</td><td>AL</td><td>(205) 6523485</td><td>(205) 6098386</td><td>watkinson@uwa.edu</td></tr>
    </table>

  • #2
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,091
    Thanks
    38
    Thanked 498 Times in 492 Posts

    Question

    Quote Originally Posted by billvasko View Post
    I have done a lot of searching for sortable tables. I have found the codes on kryogenix and yoast to add to a table to make it sortable. Problem is, I want to embed the tables on wix and ning sites and into mailchimp emails. So the code on these sites won't work for these platforms.

    The only option I could find was keepandshare.com, but it is a subscription site and i could not figure it out using the 14 day free trial.

    Below is a sample script of a table I have created. Can anyone help to add code to it that will make it sortable that I can apply to other simple tables and then be able to embed them? Thanks!!

    Code:
    ...
    So many questions, so little time to answer them without additional information...

    So what are "wix and ning sites" or "mailchimp" and why won't the JS solutions work on these platforms?

    And what do you mean by wanting to "be able to embed them"?

  • #3
    New Coder
    Join Date
    Aug 2007
    Posts
    71
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Wix and ning are web platform with hosted websites. You don't have access to source code. But you can add scripts in a code box that will embed (add) or change things on the website. Mailchimp is an email service like constant contact.....again, you can add scripts and codes that will embed html features into the email.

  • #4
    New Coder
    Join Date
    Aug 2007
    Posts
    71
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Embed just means you take a a script and add it to an area on the host platform and it will impolement whatever the code is designed to do. For example, the script in my original post is a just a plain table. If I add that to coding area on any of these sites, it will embed or add the table onto a webpage.

  • #5
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,980
    Thanks
    56
    Thanked 557 Times in 554 Posts
    do you have any idea why the scripts you have found so far won't work when you try to embed them on your pages?

  • #6
    New Coder
    Join Date
    Aug 2007
    Posts
    71
    Thanks
    17
    Thanked 0 Times in 0 Posts
    The scripts I have found talk about adding things to header and downloading/uploading things that the script refers to.

  • #7
    hgs
    hgs is offline
    New Coder
    Join Date
    Jan 2010
    Location
    Germany
    Posts
    83
    Thanks
    3
    Thanked 5 Times in 5 Posts
    My site
    If you’re doing software development right, you’re probably doing Agile wrong.
    -- Isaac Schlueter

  • Users who have thanked hgs for this post:

    billvasko (08-25-2013)

  • #8
    New Coder
    Join Date
    Aug 2007
    Posts
    71
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Thanks hgs....I plugged in your exact code and it worked on my Wix site. I havent tested it putting in my table data yet. However, the arrow images did not work--I assume I will have to figure out a way to host them myself?

  • #9
    hgs
    hgs is offline
    New Coder
    Join Date
    Jan 2010
    Location
    Germany
    Posts
    83
    Thanks
    3
    Thanked 5 Times in 5 Posts
    You don't need the images. You just need two elements you can attache
    the sort function to the onclick event.

    Below is an example for the first TH-element. Here I use the SPAN tag
    for this.


    Code:
    <th>
    <span onclick="sortUp(0);" title="sort ascending"><b>+</b> </span>
    Colum 0 
    <span onclick="sortDown(0);" title="sort descending"><b>-</b></span>
    </th>
    Last edited by hgs; 08-26-2013 at 10:55 AM.
    My site
    If you’re doing software development right, you’re probably doing Agile wrong.
    -- Isaac Schlueter


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •