管理在div行

时间:2018-06-07 09:42:31

标签: javascript jquery html odoo

在我的Odoo模块中,我使用qweb生成一个行div,它可以包含不同的元素,如checkbox,texarea,input等。

从数据库加载数据时。我知道元素行的id并将其分配给可以包含元素的div行。

我需要知道用户何时点击精确div行中的某个输入。

代码:

                   <!-- Load the section lines of the section_ids choosed-->
                    <t t-foreach="checklist_lines" t-as="check_line">
                        <div class="row section_line" t-att-id="check_line.id" style="border-top: 1px solid black; padding:2px;">

                            <div class="col-xs-12 col-sm-4 col-md-4">
                                <span t-esc="check_line.name"/>
                            </div>
                            <t t-if="check_line.answer_yes_type">
                                <div class="col-xs-12 col-sm-1 col-md-1" style="display:inline;">
                                    <!-- TODO if yes is true check if have subsections and load it-->
                                    <input type="checkbox"
                                           t-att-id="str(check_line.id) + 'answer_yes_type'"
                                           t-att-name="str(check_line.id) + 'answer_yes_type'"
                                           t-att-value="check_line.answer_yes"
                                           style="margin:10px;">Yes
                                    </input>
                                </div>
                            </t>
                            <t t-if="check_line.answer_no_type">
                                <div class="col-xs-12 col-sm-1 col-md-1">

                                    <input type="checkbox"
                                           t-att-value="check_line.answer_no"
                                           style="margin:10px;">No
                                    </input>

                                </div>
                            </t>
                            <t t-if="check_line.answer_undecided_type">
                                <div class="col-xs-12 col-sm-2 col-md-2">

                                    <input type="checkbox"
                                           t-att-value="check_line.answer_undecided"
                                           style="margin:10px;">Undecided
                                    </input>

                                </div>
                            </t>
                            <t t-if="check_line.answer_text_type">
                                <div class="col-xs-12 col-sm-4 col-md-4">
                                    <textarea type="text"
                                              t-att-value="check_line.answer_text"
                                              style="margin:10px; width:100%; height:100px;"
                                    />
                                </div>
                            </t>
                            <t t-if="check_line.answer_value_type">
                                <div class="col-xs-12 col-sm-1 col-md-1">
                                    <input type="text"
                                           t-att-value="check_line.answer_value"
                                           style="margin:10px;"
                                    />
                                    <t t-if="check_line.answer_value_uom_id">
                                        <span t-esc="check_line.answer_value_uom_id.name"/>
                                    </t>
                                </div>
                            </t>
                            <t t-if="check_line.order_id">
                                <div class="col-xs-12 col-sm-1 col-md-1">
                                    <a t-attf-href="/my/orders/{{check_line.order_id.id}}?{{keep_query()}}">
                                        <span t-esc="check_line.order_id.name"/>
                                    </a>
                                </div>
                            </t>

                        </div>
                        <br/>
                    </t>

使用t-att-namet-att-id我设置动态ID,以根据此规则row更改id=row_id + name_of_view内的元素。

现在,我有这个jQuery函数拦截用户点击并返回点击行的id:

jQuery(document).ready(function () {
        $('.section_line').on("click", function () {
            var checklist_line_id = $(this).attr('id');
            alert(checklist_line_id);
        });
    });

但是我需要检查div中的所有元素并检查用户是否更改了某些内容。

我想知道用户是否例如点击id为1的div行内的复选框。 所以我有row=1checkbox id = 1answer_yes_type ....我想知道用户是否点击了ID 1answer_yes_type ....或元素1answer_value等...

我该如何管理?

1 个答案:

答案 0 :(得分:0)

你走了:

 $(document).ready(function () {
    $('.clicked').find("div").on("click", function(){
      var id = $(this).attr('id');
     var valueofcheckbox = $(this).find('input')[0].value;
    var textofcheckbox = $(this).first().text();
    alert('div id: '+ id + ' checkbox value: '+ 
       valueofcheckbox + ' text of checkbox: ' +textofcheckbox);
       })
   });

工作链接:

  

https://codepen.io/sidhanshu28/pen/MXjVzo

让我知道这是否有帮助,或者您需要了解其他任何内容