2017-06-08 12 views
0

私はデータテーブルを持っています。ユーザーがテーブル行をクリックすると{{ content.id }}が得られ、別の子テーブルがポップアップします。子テーブル内ドロップダウンリストからデータテーブルの行をクリックしてオプションを選択してください

<table id="project-content-datatable" class="display table table-hover table-responsive" style="width: 100%"> 
    <thead> 
    <tr> 
     <th class="small text-muted text-uppercase"><strong>ID</strong></th> 
     <th class="small text-muted text-uppercase"><strong>Name</strong></th> 
     <th class="small text-muted text-uppercase"><strong>Description</strong></th> 
    </tr> 
    </thead> 
    <tbody> 
    {% for content in content_list %} 
     {% if content.search_type.name == searchtype.name %} 
      <tr class="text-primary"> 
       <td class="text-left" style="cursor: pointer" 
        onclick='load_workorder({{ content.id }});'> 
        {{ content.id }} 
       </td> 
       <td class="text-left" style="cursor: pointer" onclick='load_workorder({{ content.id }});'> 
        {{ content.name }} </td> 
       <td class="text-left"> {{ content.description }} </td> 
      </tr> 
     {% endif %} 
    {% endfor content_list %} 
    </tbody> 

<script> 
    function load_workorder(content_id) { 
    workorder_path = "/dashboard/workorder_list/" + content_id + "/?format=json"; 
    workorder_table.api().ajax.url(workorder_path).load(); 
</script> 

私はそれで新しいコンテンツを作成するために、モーダルフォームをポップアップ表示するボタンがあり、その分野の一つは、ドロップダウンForeignKeyフィールドです。

<div class="modal-body"> 
<div class="field"> 
<label>Project Type</label> 
<select name="parent_project_content" required="" id="id_parent_project_content"> 
     <option value="">---------</option> 

     <option value="1" selected="">Iron man suit</option> 

     <option value="2">SEQ 001</option> 

     <option value="4">SEQ 002</option> 

    </select> 
</div> 

<option>値は{{ content.id }} .Iに等しいので、どのように私は、ユーザーが{{ content.id }}クリックに基づいて選択する<option>を変更することができ、ユーザーからこのフィールドを非表示にします。すべてのヘルプは非常にappreaciatedさ

、おかげ

答えて

0

のでcontent.id値は、そのための選択ドロップダウンjQueryのではオプションで非常に簡単であることと一致した場合。

はここで少し例ですが、あなたがする必要があるすべてはselectOption()関数を呼び出すと、あなたのcontent.id値を通過している:この作品partypete25 @

// my simplified example to grab a value from the table 
$('td').click(function(){ 
    var value = $(this).text(); 
    selectOption(value); 
}); 

// pass the value to this function 
function selectOption(v){ 
    $('#id_parent_project_content option[value="'+v+'"]').prop('selected', true); 
} 
関連する問題