CODEWITHSUNDEEP
pythonhtmldjangohyperlink
user541686
user541686

Reputation: 210755

HTML Table -- Putting a Link in the Header for Sorting? (No JavaScript)

I'm dynamically generating a table, as well as the column headers.

How do I make the columns clickable (NO JavaScript!), so that when they're clicked, they add a sort=columnNameHere entry to the query, and reload the current page with that query?

Upvotes: 2

Views: 6387

Answers (2)

Tim Hoolihan
Tim Hoolihan

Reputation: 12396

It would be helpful to know your server-side language, but since you didn't include that, you'll want the code to output html as follows...

<table>
   <thead>
      <th><a href="test.html?sort=Name">Name</a></th>
      <th><a href="test.html?sort=Location">Location</a></th>
   </thead>
   <tr>
      <td>Bob</td>
      <td>Canada</td>
   </tr>
</table>

on the server you need to make sure you get the sort variable from the collection of get variables and apply it to the source query. In pseudocode, this would be something like:

   currentSort = Request["sort"] 
   data = db.Execute("select * from customersorder by " + sqlescape(currentSort))

  //write table header 
  foreach col in columns
    write("<th><a href='test.html?sort=" + col + "'>" + col + "</a>")

  //close header, start data 
  for each row in data    
    write...

Upvotes: 3

baraboom
baraboom

Reputation: 1408

You would have to grab the 'sort' variable in your server-side code and resend the query to the data source so your table would be populated in the desired manner.

In order to add the link, you would want to dynamically generate the href so it would append the sort=columnnamehere to the query string.

If you need help crafting the server-side code, please include more details about your set up (scripting language, data source, etc).

Good luck!

Upvotes: 0

Related Questions