Capture the value of the selected item in selectOneRadio with JavaScript

Navigation
1

I have this component Primefaces: 

<p:selectOneRadio id="mercado" styleClass="teste">
    <f:selectItem itemLabel="Interno" itemValue="I"/>
    <f:selectItem itemLabel="Externo" itemValue="E"/>
</p:selectOneRadio>

I tried capturing the value of the selection via JavaScript as below, but it returns empty. 

$('.teste').change(function () {
    alert($(this).val());
});

How do I retrieve the value of the selection via JavaScript?

Complete form code: 

<!-- Dialog com Formulario de Produtos-->
<p:dialog header="Formulário de Produtos" widgetVar="dialogProdutos" resizable="false" modal="true">
  <h:form id="formCadClientes">
    <p:panelGrid columns="2" id="painel" columnClasses="rotulo, campo" style="margin-top: 20px; margin-bottom: 20px">
      <p:outputLabel value="Código" for="codigo" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:inputText id="codigo" size="20" />
      </p:panelGrid>
      <p:outputLabel value="Descrição" for="descricao" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:inputText id="descricao" size="70" />
      </p:panelGrid>
      <p:outputLabel value="Categoria" for="categoria" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:selectOneMenu id="categoria" style="width: 230px">
          <f:selectItem itemLabel="Selecione uma categoria" />
        </p:selectOneMenu>
        <p:commandButton value="+" oncomplete="PF('dialogCategorias').show();" title="Adicionar nova categoria" style="height: 30px" />
      </p:panelGrid>
      <p:outputLabel value="Mercado" for="mercado" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:selectOneRadio id="mercado" styleClass="teste">
          <f:selectItem itemLabel="Interno" itemValue="I" />
          <f:selectItem itemLabel="Externo" itemValue="E" />
        </p:selectOneRadio>
      </p:panelGrid>
      <p:outputLabel value="Preço" for="preco" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:inputText id="preco" size="15" />
      </p:panelGrid>
      <p:outputLabel value="Moeda" for="moeda" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:inputText id="moeda" size="15" />
      </p:panelGrid>
      <p:outputLabel value="Imposto" for="imposto" />
      <p:panelGrid columns="2" styleClass="semBorda">
        <p:inputText id="imposto" size="15" />
      </p:panelGrid>
    </p:panelGrid>
    <p:commandButton value="Gravar" icon="ui-icon-disk" style="width: 120px; height: 40px; font-size: 16px" />
    <p:commandButton value="Cancelar" icon="ui-icon-cancel" oncomplete="PF('dialogProdutos').hide();" style="width: 120px; height: 40px; font-size: 16px" />
  </h:form>
</p:dialog>

Follow the image of the rendered form:

BasicallywhatIwouldlikeisthatwhenyouselectInternal,inthecurrencyfieldthevalue"R $" is set if you select External, set the value "US $".

    
asked by anonymous 29.11.2017 / 01:52

1 answer

1

Enter onchange="teste(this.value)" (or onclick="teste(this.value)" ) in <p:selectOneRadio id="mercado" styleClass="teste"> , thus: 

<p:selectOneRadio id="mercado" styleClass="teste" onchange="teste(this.value)">

And the JavaScript function that will get the value: 

<script>
function teste(a){
    alert('O valor do radio clicado é '+a);
}
</script>
    
29.11.2017 / 03:37
Add button, insert input value into the form itself Why the error in PDO Uncaught Error: Call to undefined method PDO :: fetch ()?