How to make commandButton don't reload / refresh the page

Question

Actually I have one input and I want to send the request without page reload (Ajax, probably). My code is bellow, but first I need to say I already see this question and it don't solve my problem.

Following is my code:

<h:form>
    <div class="form-group">
        <div class="col-md-10">
            <h:inputText styleClass="form-control" id="disciplina" value="#{disciplinaMBean.nome}" valueChangeListener="#{disciplinaMBean.atualizarListagemPesquisa}">
                 <f:ajax event="keyup" render=":meuForm:minhaTabela"/>  
            </h:inputText>
        </div>
        <div class="col-md-2">
            <h:commandButton value="Adicionar" styleClass="btn btn-md btn-success" action="#{disciplinaMBean.cadastrar}">
                 <f:ajax event="click" execute="@form" render=":meuForm:minhaTabela"/>
            </h:commandButton>
        </div>
    </div>
</h:form>

The "render" in is to update a dataTable that I have in my page.

So, what I'm doing wrong?

Remembering, I want:

1. When user insert a text and click in button, send the form normally.
2. But when send the request/form, don't refresh/reload the page.

Thanks!

Answer 1

Answer found:

I searched in Google and I find some solutions, so I adapt the answers I find to my problem.

Following is my lastest code:

<h:form id="inserirDisciplina">
    <h:inputText id="disciplina" value="#{disciplinaMBean.nome}" />
    <h:commandButton value="Adicionar" action="#{disciplinaMBean.cadastrar}">
        <f:ajax event="click" listener="#{disciplinaMBean.cadastrar}"/>
    </h:commandButton>
</h:form>

If you have the same problem, probably what you need is the tag f:ajax with #{yourBean.yourMethod} inside the listener attribute.