Primefaces SelectOne菜单选择/单击时的ajax事件

我使用的是PrimeFaces5.0。我有一个内置ajax侦听器的SelectOne菜单：

<p:selectOneMenu value="#{mybean.myselection}" >
    <f:selectItems value="#{mybean.mylist}" />
    <p:ajax listener="#{mybean.test}" />
</p:selectOneMenu>

每次更改值时都会调用侦听器。这个很好用。但我还需要一个类似“选择”或“单击”的事件，它在单击selecteditem时也会触发一个操作

我在PF UserGuide中找不到事件。有没有一个简单的方法可以做到这一点

编辑： 添加Javascript函数

   <h:form>
    <p:selectOneMenu value="#{mybean.myselection}" widgetVar="mySelect">
        <f:selectItems value="#{mybean.mylist}" />
        <p:ajax listener="#{mybean.test}" />
    </p:selectOneMenu>
   <h:form>

<script>
            //<![CDATA[
            $(document)
                    .ready(
                            function() {
                                PF('mySelect').selectItem = function(item,
                                        silent) {
                                    var selectedOption = this.options.eq(this
                                            .resolveItemIndex(item)), currentOption = this.options
                                            .filter(':selected'), shouldChange = null;

                                    if (this.cfg.editable) {
                                        shouldChange = (selectedOption.text() != this.label
                                                .val());
                                    } else {
                                        shouldChange = true;
                                    }

                                    if (shouldChange) {
                                        this.highlightItem(item);
                                        this.input.val(selectedOption.val())

                                        this.triggerChange();

                                        if (this.cfg.editable) {
                                            this.customInput = false;
                                        }
                                    }

                                    if (!silent) {
                                        this.focusInput.focus();
                                    }

                                    if (this.panel.is(':visible')) {
                                        this.hide();
                                    }
                                }
                            })
            //]]>
        </script>

//

在小部件的功能中，您可以看到，当选择项目时，存在一个条件，即，如果该条件为真，则不会触发更改事件

这是设计的。要覆盖此选项，您有多个选项，您可以更改

selectItem

的原型，其中

sameOption

始终被视为

false

，这意味着您不必删除与该选项相关的所有代码，也可以永远删除该选项

这个例子就是我从等式中选择的

PrimeFaces.widget.SelectOneMenu.prototype.selectItem = function(item, silent) {
    var selectedOption = this.options.eq(this.resolveItemIndex(item)),
    //sameOption = selectedOption.val() == currentOption.val() | or make it false |
    currentOption = this.options.filter(':selected'),
    shouldChange = null;

    if(this.cfg.editable) {
        shouldChange = (selectedOption.text() != this.label.val()); //changes done here, see original function 
    }
    else {
        shouldChange = true;
    }

    if(shouldChange) {
        this.highlightItem(item);
        this.input.val(selectedOption.val())

        this.triggerChange();

        if(this.cfg.editable) {
            this.customInput = false;
        }
    }

    if(!silent) {
        this.focusInput.focus();
    }

    if(this.panel.is(':visible')) {
        this.hide();
    }
}

现在，改变整个对象的原型可能不是您的情况，如果您希望特定的selectOneMenu具有这种行为，您可以只更改如下功能：

PF('selectOneMenuWidgetVarName').selectItem = function(item, silent) {
    var selectedOption = this.options.eq(this.resolveItemIndex(item)),
    currentOption = this.options.filter(':selected'),
    shouldChange = null;

    if(this.cfg.editable) {
        shouldChange = (selectedOption.text() != this.label.val());
    }
    else {
        shouldChange = true;
    }

    if(shouldChange) {
        this.highlightItem(item);
        this.input.val(selectedOption.val())

        this.triggerChange();

        if(this.cfg.editable) {
            this.customInput = false;
        }
    }

    if(!silent) {
        this.focusInput.focus();
    }

    if(this.panel.is(':visible')) {
        this.hide();
    }
}

这样，即使选择了相同的值，也会触发更改事件。 您需要在

$（文档）中执行此代码。ready

在小部件的功能中，您可以看到，当选择项目时，存在一个条件，即如果该条件为真，则不会触发更改事件

这是设计的。要覆盖此选项，您有多个选项，您可以更改

selectItem

的原型，其中

sameOption

始终被视为

false

，这意味着您不必删除与该选项相关的所有代码，也可以永远删除该选项

这个例子就是我从等式中选择的

PrimeFaces.widget.SelectOneMenu.prototype.selectItem = function(item, silent) {
    var selectedOption = this.options.eq(this.resolveItemIndex(item)),
    //sameOption = selectedOption.val() == currentOption.val() | or make it false |
    currentOption = this.options.filter(':selected'),
    shouldChange = null;

    if(this.cfg.editable) {
        shouldChange = (selectedOption.text() != this.label.val()); //changes done here, see original function 
    }
    else {
        shouldChange = true;
    }

    if(shouldChange) {
        this.highlightItem(item);
        this.input.val(selectedOption.val())

        this.triggerChange();

        if(this.cfg.editable) {
            this.customInput = false;
        }
    }

    if(!silent) {
        this.focusInput.focus();
    }

    if(this.panel.is(':visible')) {
        this.hide();
    }
}

现在，改变整个对象的原型可能不是您的情况，如果您希望特定的selectOneMenu具有这种行为，您可以只更改如下功能：

PF('selectOneMenuWidgetVarName').selectItem = function(item, silent) {
    var selectedOption = this.options.eq(this.resolveItemIndex(item)),
    currentOption = this.options.filter(':selected'),
    shouldChange = null;

    if(this.cfg.editable) {
        shouldChange = (selectedOption.text() != this.label.val());
    }
    else {
        shouldChange = true;
    }

    if(shouldChange) {
        this.highlightItem(item);
        this.input.val(selectedOption.val())

        this.triggerChange();

        if(this.cfg.editable) {
            this.customInput = false;
        }
    }

    if(!silent) {
        this.focusInput.focus();
    }

    if(this.panel.is(':visible')) {
        this.hide();
    }
}

这样，即使选择了相同的值，也会触发更改事件。

---

您需要在

$（文档）中执行此代码。准备就绪

很抱歉响应太晚。我添加了你的javascript，但它不起作用。你能给我一个提示吗？它在什么意义上不起作用？我是说你的控制台有错误吗？或者你对javascript不太了解？啊，好吧，我看到了你的更新。。。如果有任何错误，请查看控制台好吗？对不起，我忘记清除浏览器缓存。。。很好用！谢谢。很抱歉回复晚了。我添加了你的javascript，但它不起作用。你能给我一个提示吗？它在什么意义上不起作用？我是说你的控制台有错误吗？或者你对javascript不太了解？啊，好吧，我看到了你的更新。。。如果有任何错误，请查看控制台好吗？对不起，我忘记清除浏览器缓存。。。很好用！非常感谢。