ajax calls not working when including primefases extension v 12

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
kimg
Posts: 61
Joined: 22 Aug 2013, 17:13

24 Oct 2022, 00:41

I'm in the process of playing with the new Jakarta EE 10.

I'm running on Payara 6.2022.1alpha, Primefaces 12, jakarta faces 4.0.0

I'm using the Serenity v 5.0.0 application as a starter using empty.xhtml as the starting point.

empty.xhtml:

Code: Select all


<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                template="/WEB-INF/template.xhtml">

    <ui:define name="breadcrumb">
        <li><p:link outcome="/empty">Empty</p:link></li>
    </ui:define>

    <ui:define name="content">
        <div class="grid">
            <div class="col">
                <div class="card">
                    <h4>Empty Page</h4>
                    <p>This is your empty page template to start building beautiful applications.</p>
                    
                    <h:form>
                            
                        <p:dataTable id="dt-products" widgetVar="dtProducts" var="product" value="#{ajaxTestView.products}" 
                                     reflow="true" styleClass="products-table"
                                    selection="#{ajaxTestView.selectedProduct}" rowKey="#{product.id}" 
                                    paginator="true" rows="10" rowSelectMode="add" paginatorPosition="bottom">
                            <f:facet name="header">
                                <div class="products-table-header">
                                    <span style="font-weight: bold">Manage Products</span>
                                
                                    
                                </div>
                            </f:facet>

                            
                            <p:ajax event="rowSelect" listener="#{ajaxTestView.onRowToggle}" />
                           

                            <p:column selectionMode="single" exportable="false"></p:column>

                            <p:column headerText="Code" sortBy="#{product.code}" filterBy="#{product.code}">
                                <h:outputText value="#{product.code}" />
                            </p:column>
                            <p:column headerText="Name" sortBy="#{product.name}" filterBy="#{product.name}">
                                <h:outputText value="#{product.name}" />
                            </p:column>
                            <p:column headerText="Image" exportable="false">
                                <p:graphicImage name="images/product/#{product.image}" library="demo" styleClass="product-image" />
                            </p:column>
                            <p:column headerText="Price" sortBy="#{product.price}">
                                <h:outputText value="#{product.price}" style="font-weight: 700">
                                    <f:convertNumber currencySymbol="$" type="currency" />
                                </h:outputText>
                            </p:column>
                            <p:column headerText="Category" sortBy="#{product.category}" filterBy="#{product.category}">
                                <h:outputText value="#{product.category}" />
                            </p:column>
                            <p:column headerText="Reviews" sortBy="#{product.rating}">
                                <p:rating value="#{product.rating}" readonly="true"/>
                            </p:column>
                          
                        </p:dataTable>
                        
                    </h:form>
                </div>
            </div>
        </div>
    </ui:define>

</ui:composition>


The managed bean

Code: Select all

/*
   Copyright 2009-2022 PrimeTek.

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
 */
package org.primefaces.serenity.view;

import org.primefaces.PrimeFaces;
import org.primefaces.serenity.service.OrderService;
import org.primefaces.serenity.service.Product2Service;

import jakarta.annotation.PostConstruct;
import jakarta.faces.application.FacesMessage;
import jakarta.faces.context.FacesContext;
import jakarta.faces.view.ViewScoped;
import jakarta.inject.Inject;
import jakarta.inject.Named;
import java.io.Serializable;
import java.util.List;
import java.util.UUID;
import org.primefaces.event.SelectEvent;
import org.primefaces.serenity.domain.Product2;

@Named
@ViewScoped
public class AjaxTestView implements Serializable {
    
    private List<Product2> products;

    private Product2 selectedProduct;

    private List<Product2> selectedProducts;

    @Inject
    private Product2Service productService;

    @Inject
    private OrderService orderService;

    @PostConstruct
    public void init() {
        this.products = this.productService.getClonedProducts(5);
    }
    
    public List<Product2> getProducts() {
        return products;
    }

    public Product2 getSelectedProduct() {
        return selectedProduct;
    }

    public void setSelectedProduct(Product2 selectedProduct) {
        this.selectedProduct = selectedProduct;
    }

    public List<Product2> getSelectedProducts() {
        return selectedProducts;
    }

    public void setSelectedProducts(List<Product2> selectedProducts) {
        this.selectedProducts = selectedProducts;
    }

    public void openNew() {
        this.selectedProduct = new Product2();
    }

    public void saveProduct() {
        if (this.selectedProduct.getCode() == null) {
            this.selectedProduct.setCode(UUID.randomUUID().toString().replaceAll("-", "").substring(0, 9));
            this.products.add(this.selectedProduct);
            FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Product Added"));
        }
        else {
            FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Product Updated"));
        }
        
        PrimeFaces.current().executeScript("PF('manageProductDialog').hide()");
        PrimeFaces.current().ajax().update("form:messages", "form:dt-products");
    }

    public void deleteProduct() {
        this.products.remove(this.selectedProduct);
        this.selectedProduct = null;
        FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Product Removed"));
        PrimeFaces.current().ajax().update("form:messages", "form:dt-products");
    }

    public String getDeleteButtonMessage() {
        if (hasSelectedProducts()) {
            int size = this.selectedProducts.size();
            return size > 1 ? size + " products selected" : "1 product selected";
        }

        return "Delete";
    }

    public boolean hasSelectedProducts() {
        return this.selectedProducts != null && !this.selectedProducts.isEmpty();
    }

    public void deleteSelectedProducts() {
        this.products.removeAll(this.selectedProducts);
        this.selectedProducts = null;
        FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Products Removed"));
        PrimeFaces.current().ajax().update("form:messages", "form:dt-products");
    }

    public void onRowToggle(SelectEvent event) {  System.out.println("CRUD onrowtoggle...");
        
    }
}


The product2 service

Code: Select all


/*
   Copyright 2009-2022 PrimeTek.

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
 */
package org.primefaces.serenity.service;


import org.primefaces.serenity.domain.Product2;

import jakarta.annotation.PostConstruct;
import jakarta.enterprise.context.ApplicationScoped;
import jakarta.inject.Named;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;


@Named
@ApplicationScoped
public class Product2Service {

    List<Product2> products;

    @PostConstruct
    public void init() {
        products = new ArrayList<>();
        products.add(new Product2(1000, "f230fh0g3", "Bamboo Watch", "Product Description", "bamboo-watch.jpg", 65, "Accessories", 24, 5));
        products.add(new Product2(1001, "nvklal433", "Black Watch", "Product Description", "black-watch.jpg", 72, "Accessories", 61,  4));
        products.add(new Product2(1002, "zz21cz3c1", "Blue Band", "Product Description", "blue-band.jpg", 79, "Fitness", 2, 3));
        products.add(new Product2(1003, "244wgerg2", "Blue T-Shirt", "Product Description", "blue-t-shirt.jpg", 29, "Clothing", 25, 5));
        products.add(new Product2(1004, "h456wer53", "Bracelet", "Product Description", "bracelet.jpg", 15, "Accessories", 73, 4));
 
    }

    public List<Product2> getProducts() {
        return new ArrayList<>(products);
    }

    public List<Product2> getProducts(int size) {

        if (size > products.size()) {
            Random rand = new Random();

            List<Product2> randomList = new ArrayList<>();
            for (int i = 0; i < size; i++) {
                int randomIndex = rand.nextInt(products.size());
                randomList.add(products.get(randomIndex));
            }

            return randomList;
        }

        else {
            return new ArrayList<>(products.subList(0, size));
        }

    }

    public List<Product2> getClonedProducts(int size) {
        List<Product2> results = new ArrayList<>();
        List<Product2> originals = getProducts(size);
        for (Product2 original : originals) {
            results.add(original.clone());
        }
        return results;
    }
}



and the product2 entity

Code: Select all

/*
   Copyright 2009-2022 PrimeTek.

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

   Licensed under PrimeFaces Commercial License, Version 1.0 (the "License");

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
 */
package org.primefaces.serenity.domain;

import java.io.Serializable;
import java.util.List;

public class Product2 implements Serializable {
    
    private int id;

    private String code;

    private String name;

    private String description;

    private String image;

    private double price;

    private String category;

    private int quantity;

     private int rating;

    private List<Order> orders;

    public Product2() {}

    public Product2(int id, String code, String name, String description, String image, double price, String category, int quantity, int rating) {
        this.id = id;
        this.code = code;
        this.name = name;
        this.description = description;
        this.image = image;
        this.price = price;
        this.category = category;
        this.quantity = quantity;
 
        this.rating = rating;
    }

    public Product2 clone() {
        return new Product2(getId(), getCode(), getName(), getDescription(), getImage(), getPrice(), getCategory(), getQuantity(),  getRating());
    }

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getCode() {
        return code;
    }

    public void setCode(String code) {
        this.code = code;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getDescription() {
        return description;
    }

    public void setDescription(String description) {
        this.description = description;
    }

    public String getImage() {
        return image;
    }

    public void setImage(String image) {
        this.image = image;
    }

    public double getPrice() {
        return price;
    }

    public void setPrice(double price) {
        this.price = price;
    }

    public String getCategory() {
        return category;
    }

    public void setCategory(String category) {
        this.category = category;
    }

    public int getQuantity() {
        return quantity;
    }

    public void setQuantity(int quantity) {
        this.quantity = quantity;
    }

    public int getRating() {
        return rating;
    }

    public void setRating(int rating) {
        this.rating = rating;
    }

    public List<Order> getOrders() {
        return this.orders;
    }

    public void setOrders(List<Order> orders) {
        this.orders = orders;
    }

    @Override
    public int hashCode() {
        final int prime = 31;
        int result = 1;
        result = prime * result + ((code == null) ? 0 : code.hashCode());
        return result;
    }

    @Override
    public boolean equals(Object obj) {
        if (this == obj)
            return true;
        if (obj == null)
            return false;
        if (getClass() != obj.getClass())
            return false;
        Product2 other = (Product2) obj;
        if (code == null) {
            if (other.code != null)
                return false;
        } else if (!code.equals(other.code))
            return false;
        return true;
    }


}


Basically just a very simple copy of some files already in the Serenity package.

My pom.xml (only my additions)

Code: Select all


<dependencies>
        <dependency>
            <groupId>org.primefaces</groupId>
            <artifactId>primefaces</artifactId>
            <version>12.0.0</version>
            <classifier>jakarta</classifier>
        </dependency>
       <dependency>
            <groupId>org.glassfish</groupId>
            <artifactId>jakarta.faces</artifactId>
            <version>4.0.0</version>
        </dependency>
        <dependency>
            <groupId>jakarta.platform</groupId>
            <artifactId>jakarta.jakartaee-web-api</artifactId>
            <version>10.0.0</version>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>jakarta.el</groupId>
            <artifactId>jakarta.el-api</artifactId>
            <version>4.0.0</version>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>jakarta.servlet</groupId>
            <artifactId>jakarta.servlet-api</artifactId>
            <version>4.0.4</version>
            <scope>provided</scope>
        </dependency>
       

When I build the system based on these pom entries and files everything works as expected.

The 'empty.xhtml' files shows up and it contains a table with some products in it. When I click on the Bell, the Envelope or the Gear in the top bar the drop down menus shows up. When i select a product I see this text in my appserver console:

CRUD onrowtoggle...

indicating that the ajax call is working and the event is created as expected.

If I include the following in my pom file:


Code: Select all

 <dependency>
            <groupId>org.primefaces.extensions</groupId>
            <artifactId>primefaces-extensions</artifactId>
            <version>12.0.0</version>
            <classifier>jakarta</classifier>
        </dependency>
then the applications starts as expected and the page is shown. But when i click either of the objects in the menu bar no drop down menus are shown.

When I click a product (select a product) the managed bean is not called and I don't see the text i expected.

So when I include the extension something stops working. I don't know if it is a Primefaces problem or Serenity problem. Maybe it's another place in the stack but I can't find out what goes wrong.

Can you help me out here?

Kim
Primefaces 6.2 / Glassfish 5 / Payara 5.182

cagatay.civici
Prime
Posts: 18616
Joined: 05 Jan 2009, 00:21
Location: Cybertron
Contact:

25 Oct 2022, 08:34

This is not an issue with serenity, please use the primefaces extensions issue tracker to report it, they may need to release a v12 compatible version. You can also create the ticket at PrimeFaces issue tracker as extensions team is also a part of the PrimeFaces team.

Post Reply

Return to “Serenity - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 7 guests