web-dev-qa-db-ja.com

別のページにリダイレクトし、テーブルのURLにパラメータを渡す方法は?

別のページにリダイレクトし、テーブルのURLにパラメータを渡す方法は?トルネートテンプレートで次のようなものを作成しました

_<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>  
_

そして、詳細を押して_/player_detail?username=username_にリダイレクトし、そのプレーヤーに関するすべての詳細を表示したいと思います。 inputタグ内でhref="javascript:window.location.replace('./player_info');"を試しましたが、result ['username']の挿入方法がわかりません。これを行う方法は?

23
PaolaJ.

ユーザー名をdata-username属性としてボタンおよびクラスに設定します。

[〜#〜] 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;
    }
});​

編集:

また、次を使用してundefined && nullを簡単に確認できます。

$(document).on('click', '.btn', function() {

    var name = $(this).data('username');        
    if (name) {
        window.location = '/player_detail?username=' + name;
    }
});​

このように answer

if (name) {            
}

値が以下の場合、trueと評価されます。

  • ヌル
  • undefined
  • ナン
  • 空の文字列( "")
  • false

上記のリストは、ECMA/Javascriptで考えられるすべての偽の値を表しています。

36
palaѕн

これを行う :

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

ボタンをバインドします。これはjQueryで行います。

$("#my-table input[type='button']").click(function(){
    var parameter = $(this).val();
    window.location = "http://yoursite.com/page?variable=" + parameter;
});
6
Atticus

JQueryに依存しない一般的なソリューションを次に示します。 window.locationの定義を変更するだけです。

<html>
   <head>
      <script>
         function loadNewDoc(){ 
            var loc = window.location;
            window.location = loc.hostname + loc.port + loc.pathname + loc.search; 
         };
      </script>
   </head>
   <body onLoad="loadNewDoc()">
   </body>  
</html>
2
TennisVisuals