Primefaces Autocomplete Component "disappears from the screen" after update in Managedbean

Question

Good afternoon, I am trying to insert a product automatically after reading the code and update the components on managedBean. However, the component autocomplete disappears from the screen after I do the context.update(panelGroup)

Note: The solution works, however I would like to clean the autocomplete after insertion of the product.

Could someone help me understand what’s going on, please?

public List<Produto> produtosSugeridos(String query) {              
        lisProdutosSugeridos = produtoServico.listarTodos();        

        List<Produto> produtosFiltrado = new ArrayList<Produto>();
        for (Produto p : lisProdutosSugeridos) {
            if (Pattern.compile(Pattern.quote(query), Pattern.CASE_INSENSITIVE).matcher(p.getNome()).find()
                    || Pattern.compile(Pattern.quote(query), Pattern.CASE_INSENSITIVE).matcher(p.getCodigoDeBarras()).find()) {
                produtosFiltrado.add(p);
            }
        }

        if(produtosFiltrado.size() == 1 && query.length() == 13 && query.matches("[0-9]*")){            

            RequestContext context = RequestContext.getCurrentInstance();           

            for (Produto p : produtosFiltrado) {                    
                produtoDaVenda.setProduto(p);

                adicionaProdutosNaVenda();  
                produtoDaVenda.setQuantidade(1.0);

                produtosFiltrado = new ArrayList<Produto>();

                 context.update("panelProdutos");
                 context.update("panel");
                 //Atualizo o autocomplet
                 context.update("panelInputProdu");
            }

        }       
        return produtosFiltrado;    
}

Here code on page . xhtml

<h:panelGroup id="panelInputProdu">
    <h:panelGrid        
<p:autoComplete
    tabindex="8"
    id="autoProduto" 
    value="#{vendaControlador.produtoDaVenda.produto}"
    completeMethod="#{vendaControlador.produtosSugeridos}" 
    var="p" itemLabel="#{p.nome}"
    converter="produtoConverter" 
    temValue="#{p}"
    minQueryLength="2" maxResults="20"                                       
    update="autoProduto,:formVenda:precoVenda">`

   <p:ajax event="itemSelect" update="autoProduto,:formVenda:precoVenda" />                                     
</p:autoComplete>
     <p:watermark for="autoProduto" value="Digite o produto" />
</h:column>

Answer 1

on the page I have on value of automplete: value="#{vendaControlador.produtoDaVenda.produto}"

In the method produtosSugeridos(String query) i put:

produtoDaVenda.setQuantidade(1.0); produtoDaVenda.setProduto(null);

the amount is ok as seen in the image above, but the autocomplete disappears when doing context.update("panelInputProdu");

Someone could tell me what’s going on. I appreciate.

Answer 2

The autocomplete is getting this way because the return of it is always an empty array, see that there you make a produtosFiltrado = new ArrayList<Produto>();, thus the return array of the aucomplete method is empty. I believe you are mixing methods there, so I understand you want to select an item of the autocomplete and add it to your listing, if yes, try the following:

public List <Produto> produtosSugeridos( String query ) {
  lisProdutosSugeridos = produtoServico.listarTodos();

  List<Produto> produtosFiltrado = new ArrayList<Produto>();
  for (Produto p :lisProdutosSugeridos) {
    if ( Pattern.compile( Pattern.quote( query ), Pattern.CASE_INSENSITIVE).matcher(p.getNome()).find()
        || Pattern.compile( Pattern.quote( query ), Pattern.CASE_INSENSITIVE).matcher(p.getCodigoDeBarras()).find()) {
      produtosFiltrado.add(p);
    }
  }

  return produtosFiltrado;
}

public void addProdutoAutoComplete(){
  RequestContext context = RequestContext.getCurrentInstance();
  if(produtoDavenda.getProduto != null){
    adicionaProdutosNaVenda();
    produtoDaVenda.setQuantidade(1.0);
    context.update("panelProdutos");
    context.update("panel");
    //Atualizo o autocomplet
    context.update("panelInputProdu");
  }
}

And in the ajax of the autocomplete is as follows:

<p:ajax event="itemSelect" update="autoProduto,:formVenda:precoVenda" listener="#{vendaControlador.addProdutoAutoComplete}" process="@this,autoProduto"/>

Answer 3

Good afternoon, Adriano. Thank you for trying to help.

"from what I understand you want to select an autocomplete item and add it to your listing.."

In that case, no! I want to read the code of a product and automatically insert it without the need of the user click on the "Add" button (Note: If clicking works).

The situation is as follows: let’s say you will have a code reader and when you find the product you will insert. That’s all in managedBean, the user will not select the item on the screen and will not click on the Add button. Really the problem is this part of the code you spoke:produtosFiltrado = new ArrayList<Produto>(); What I did was: How do I insert the item and give upadte and the component works properly? clear on the List or Automcomplete for what possession to inform a new code? That’s what I’m confused! Note: if you leave the produtosFiltrado = new ArrayList<Produto>(); the component "disappears", and if it is removed, the component "hangs" with the selected product. As can be seen below.