Jquery Onchange事件没有被触发 - Primefaces - inputText

时间:2012-02-21 08:58:39

标签: jquery primefaces

未调用以下事件:

<script>
        $("#inputTxt").change(function() {
            alert("changed");
        }); 
 </script>

inputTxt的代码如下:

<p:inputText id ="inputTxt" name="inputTxt" value="#{article.description}"
                    style="border:none; box-shadow:none;"/>

coloumn“articleDescription”在名为“articlesInformation”的数据表中定义,该数据表放在表单“articleForm”上。

在检查元素时,我发现inputText的id变为 - “articlesInformation:0:inputTxt”。可能这就是问题所在。

查看页面信息说:

    <td role="gridcell">
       <div class="ui-dt-c">
        <input id="articlesInformation:0:inputTxt" name="articlesInformation:0:inputTxt"
         type="text" value="Description of Article 1"
         style="border:none; box-shadow:none;"
         class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all" />
       <script id="articlesInformation:0:inputTxt_s"
  type="text/javascript">PrimeFaces.cw('InputText','widget_articlesInformation_0_inputTxt'
    {id:'articlesInformation:0:inputTxt'});
</script></div></td>

如何为primefaces组件定义jquery?

谢谢, Shikha

3 个答案:

答案 0 :(得分:3)

当inputText放在datatable中时,primefaces给它id = datatable_id:row_index:inputText_id。也就是说,第7行中的inputText被赋予id = datatable_id:7:inputText_id。试试以下......

<p:dataTable id="table_Details" var="dataItem" rowIndexVar="rowIndex">
     <p:column id="articleDescription" headerText="Article Description">
        <p:inputText id="inputTxt" name="inputTxt" value="#{article.description}" onchange="inputTextChanged(#{rowIndex})"/>
     </p:column>
</p:dataTable>

function inputTextChanged(rowIndex){
    var str = 'table_Details:' + rowIndex + ':inputTxt';
    var selected = $(document.getElementById(str));
    alert (selected.val());
}

希望这有帮助

答案 1 :(得分:1)

您可以使用attributes ends with selector

jQuery('input[id$="inputTxt"]').change(function() {
        alert("changed");
    }); 

答案 2 :(得分:0)

当Primefaces正在更改元素的id时,您可以使用属性选择器来获取元素的名称(假设它也没有更改),或者您可以将类添加到元素并选择:

按属性:

$("input[name='inputTxt']").change(function() {
    alert("changed");
});

按班级:

$(".inputTxt").change(function() {
    alert("changed");
});