How to redirect on another page and pass parameter in url from table?

Question

How to redirect on another page and pass parameter in url from table ? I've created in tornato template something like this

<table data-role="table" id="my-table" data-mode="reflow">     <thead>         <tr>             <th>Username</th>             <th>Nation</th>             <th>Rank</th>             <th></th>         </tr>     </thead>     <tbody>         {% for result  in players %}         <tr>             <td>{{result['username']}}</td>             <td>{{result['nation']}}</td>             <td>{{result['rank']}}</td>             <td><input type="button" name="theButton" value="Detail"                        ></td>         </tr>     </tbody>     {% end %} </table>   

and I would like when I press detail to be redirect on /player_detail?username=username and show all detail about that player. I tried with href="javascript:window.location.replace('./player_info');" inside input tag but don't know how to put result['username'] in. How to do this ?

Answer 1

Do this :

 <script type="text/javascript"> function showDetails(username) {    window.location = '/player_detail?username='+username; } </script>  <input type="button" name="theButton" value="Detail" onclick="showDetails('username');"> 

Answer 2

Set the user name as data-username attribute to the button and also a class:

HTML

<input type="button" name="theButton" value="Detail" class="btn" data-username="{{result['username']}}" /> 

JS

$(document).on('click', '.btn', function() {      var name = $(this).data('username');             if (name != undefined && name != null) {         window.location = '/player_detail?username=' + name;     } });​ 

EDIT:

Also, you can simply check for undefined && null using:

$(document).on('click', '.btn', function() {      var name = $(this).data('username');             if (name) {         window.location = '/player_detail?username=' + name;     } });​ 

As, mentioned in this answer

if (name) {             } 

will evaluate to true if value is not:

• null
• undefined
• NaN
• empty string ("")
• 0
• false

The above list represents all possible falsy values in ECMA/Javascript.