0

Estou tentando pegar o valor de um select pelo jquery a partir da classe, porém essa classe tem parte do valor como variável php.

Atualmente meu código está assim:

echo '
  <select name="contarecebvenda" class="selects2'.$linha[cod].'" id="lista1" >
';

Estou tentando executar um jquery com ele porém não sei como passar o valor desse select para ele.

Já tentei o seguinte código:

$('.selects2<?$linha[cod]?>')

Porém como imaginei não obtive nenhum sucesso, alguém tem alguma sugestão para fazer isso?

2
  • Em que momento você quer pegar essa classe? Qual seria a finalidade? 23/02/2018 às 17:20
  • A finalidade seria para executar o plugin Select2, no caso estou executando utilizando a classe que varia conforme o $linha [cod].
    – Wel
    23/02/2018 às 17:41

5 Respostas 5

1

Uma alternativa de solução é colocar o nome da class que vem do PHP no value de um <input type="hidden" /> e no JavaScript obter o nome dessa class:

HTML:

<input type="hidden" name="classeAuxiliar" id="classeAuxiliar" value="<?= $cod?>" />

<select name="select" class="select2<?= $cod?>" id="lista1">
   <option value="01">01</option>
</select>

JavaScript:

var classeAuxiliar = $("#classeAuxiliar").val();
$(".selects2." +classeAuxiliar).select2();

Segue abaixo um exemplo decomo funcionaria:

//Obtenho o nome da classe que está no valor do input hidden
var classeAuxiliar = $("#classeAuxiliar").val();

//Busco os elementos que pertencerem a classe selects2 e a Classe informada no input e atribuo o plugin select2().

$(".selects2." +classeAuxiliar).select2();
#lista1{
  width:200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css" rel="stylesheet"/>




<!-- Aqui seria seu input com valor oriundo do PHP -->
<input type="hidden" name="classeAuxiliar" id="classeAuxiliar" value="teste" />

<!-- Aqui seria o seu select com a classe vinda do PHP -->
<select name="contarecebvenda" class="selects2 teste" id="lista1">
  <option value="1">Opção 1</option>
  <option value="2">Opção 2</option>
  <option value="3">Opção 3</option>
  <option value="4">Opção 4</option>
  <option value="5">Opção 5</option>
</select>

3
  • acredito que não deveria mas este "artifício computacional" funcionou no meu código com a seguinte modificação: Coloquei tudo dentro do valor da classe auxiliar : value=".selects2'.$cod.'"; e depois na hora de aplicar no JS chamei apenas a classe auxiliar: $(classeAuxiliar).select2(); porém acredito que eu deva estar passando por algum erro no meu código para os outros metódos mais convencionais não funcionarem, enfim valeu pela idéia!
    – Wel
    6/03/2018 às 14:20
  • Que bom que ajudou, existem outras formas de solução. Optei por essa pois eu particularmente não acho correto colocar diretamente o php no javascript 6/03/2018 às 14:29
  • também acho um pouco incoveniente, porém um input a mais gera mais trabalho na hora de fazer manutenção do código, ou até mesmo na sua leitura...
    – Wel
    6/03/2018 às 14:37
1

Execute o seguinte:

$linha = [ 0 => 'asdf', 1=> 'zxcv'];
$cod=0;
$('.selects2<?php echo $linha[$cod];?>');

resulta em:

$('.selects2asdf') //seleciona o SELECT a partir da classe
3
  • Desculpe, porém não entendi muito bem o código, $linha [cod] seria apenas uma variável que recebe códigos "infinitos", pelo que entendi você sugeriu algum tipo de controle, porém isso seria impossível visto que são geradas a todo momento...
    – Wel
    23/02/2018 às 17:09
  • Não sei se entendi o que você achou que eu sugeri como "algum tipo de controle" ehehe. Vejamos: se você se refere ao array e a inicialização de $cod=0 , foi apenas para testar o exemplo num arquivo php. Pra falar a verdade, eu arrisquei uma resposta, mas acho que a sua pergunta precisava de um pouco mais de clarificação. Talvez postar o código com o seu PHP e Javascript . A resposta do @LuizFelipe , que seguiu a minha, vai na mesma direção do que escrevi. Qualquer coisa, dê mais detalhes.
    – monovox
    26/02/2018 às 1:49
  • agora entendi, no meu caso esse select está dentro de um foreach no php, onde cada loop tem um valor para a linha [cod], agora que verifiquei o source, o valor está correto tanto no class quanto no código JS, porém apenas o script com o último valor do loop funciona corretamente. mesmo todos os valores estando corretos...
    – Wel
    26/02/2018 às 13:00
0

Você poderia tentar pegar da seguinte forma:

$(function() {

	var selects = $('[class^="selects2"]');
  
  selects.each(function(index, element) {
 
  	alert(element.className);
  
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="contarecebvenda" class="selects210" id="lista1"></select>

<select name="contarecebvenda" class="selects211" id="lista2"></select>

<select name="contarecebvenda" class="selects212" id="lista3"></select>

Dentro do laço de repetição do método each você pode fazer a manipulação conforme você queira.

0

Então, se seu js estiver inline, você consegue usar o php dentro da tag script, veja como:

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="author" href="humans.txt">
</head>
<body>
        <?php
        $cod = 23;
        ?>

        <select name="select" class="select2<?= $cod?>" id="item1">
            <option value="01">01</option>
        </select>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            $('.selects2<?= $cod ?>').select2();
        </script>
</body>
</html>

Agora, caso seu js estiver dentro de um arquivo externo, você pode criar uma variavel na window e recuperar ela no seu arquivo, assim:

HTML:

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="author" href="humans.txt">
</head>
<body>
        <?php
        $cod = 23;
        ?>

        <select name="select" class="select2<?= $cod?>" id="item1">
            <option value="01">01</option>
        </select>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            window.classeSelect = ".select2<?= $cod ?>";
        </script>
        <script src="script.js"></script>
</body>
</html>

JS:

$(window.classeSelect).select2();
-1

Isso parece muito errado, provavelmente há uma solução mais elegante para o problema. Contudo, se esse trecho de código estiver em um arquivo php, você pode usar o seguinte:

$('.selects2'+<?= $linha[cod]?>+');
1
  • Está dentro de um arquivo php, porém esse código não me parece funcionar mesmo com ajustes.
    – Wel
    23/02/2018 às 17:10

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .