別のページにリダイレクトし、テーブルの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']の挿入方法がわかりません。これを行う方法は?
ユーザー名を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と評価されます。
上記のリストは、ECMA/Javascriptで考えられるすべての偽の値を表しています。
これを行う :
<script type = "text/javascript"> function showDetails(username) { window.location = '/ player_detail?username =' + username; } </ script> <input type = "button" name = "theButton" value = "Detail" onclick = "showDetails( 'username' ); ">
ボタンをバインドします。これはjQueryで行います。
$("#my-table input[type='button']").click(function(){
var parameter = $(this).val();
window.location = "http://yoursite.com/page?variable=" + parameter;
});
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>