使用Flask/Jquery將可點擊的表格行中的值傳遞到Python

Question

所以，我是Python和Flask的新手，並且構建了一個應用程序，該應用程序顯示錶中的投資組合列表。現在，我使用js/Jquery使這些行可點擊。然而，我想實現的是，點擊行（portfolio_id）的第二列的值以某種方式返回給Python。這個想法是，從列表中選擇一個組合後，會出現一個包含該特定組合的詳細信息的新屏幕，因此Python需要知道要加載哪個組合。我確實設法將href /鏈接包含到click事件中，因此新的屏幕出現了，但是我無法弄清楚如何從我的表中獲取值到我的Python代碼中....在Flask代碼下方：

{% block main %} 
 
<h2>Portfolio List</h2> 
 
<ul> 
 
    <table style="width:100%"> 
 
    <tr> 
 
     <th>Relationship Nbr </th> 
 
     <th>Portfolio Nbr </th> 
 
     <th>Strategy </th> 
 
     <th>Portfolios </th> 
 
     <th>Last Rebalancing </th> 
 
    </tr> 
 
    {% for portfolio in portfolios %} 
 
    <tr class='clickable-row' data-href="{{ url_for('portfolio') }}" method = POST> 
 
     <td>{{portfolio.rel_nbr }} </td> 
 
     <td>{{portfolio.portfolio_id}}</td> 
 
     <td>{{portfolio.strategy_name}} </td> 
 
     <td>{{portfolio.security_list}} </td> 
 
     <td>{{portfolio.last_rebalance}} </td> 
 
    </tr> 
 
    {% endfor %} 
 
    </table> 
 
</ul> 
 

 
{% endblock %}

我使用jQuery代碼如下：

src="jquery-3.2.1.min-js"> 
 
    
 
    jQuery(document).ready(function($) { 
 
    $(".clickable-row").click(function() { 
 
     window.location = $(this).data("href"); 
 
    }); 
 
});

任何想法如何做到這一點？ Txs！ Bart

Answer 1

您的代碼對我來說工作正常。我剛換了jQuery腳本的地方。

嘗試將您的jquery腳本放在適當的位置。我認爲這是你的代碼無法正常工作的唯一原因。

jQuery(document).ready(function($) { 
 
    $(".clickable-row").click(function() { 
 
     alert($(this).data("href")); 
 
     window.location = $(this).data("href"); 
 
    }); 
 
});

{% block main %} 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<h2>Portfolio List</h2> 
 
<ul> 
 
    <table style="width:100%"> 
 
    <tr> 
 
     <th>Relationship Nbr </th> 
 
     <th>Portfolio Nbr </th> 
 
     <th>Strategy </th> 
 
     <th>Portfolios </th> 
 
     <th>Last Rebalancing </th> 
 
    </tr> 
 
    {% for portfolio in portfolios %} 
 
    <tr class='clickable-row' data-href="{{ url_for('portfolio') }}" method = POST> 
 
     <td>{{portfolio.rel_nbr }} </td> 
 
     <td>{{portfolio.portfolio_id}}</td> 
 
     <td>{{portfolio.strategy_name}} </td> 
 
     <td>{{portfolio.security_list}} </td> 
 
     <td>{{portfolio.last_rebalance}} </td> 
 
    </tr> 
 
    {% endfor %} 
 
    </table> 
 
</ul> 
 

 
{% endblock %}