1

Em uma outra pergunta, conseguiram me ajudar sobre armazenar os valores de alguns input de um popup, para passar para a página pai.

Resumo.jsp (pág pai)

<input type="button" onclick="test();" value="Palavras" />
<div id="idPai"></div>

function test(){
  window.showModalDialog('saida.jsp',null,'status:off;center:yes;scroll:no;');
}

No popup, há uma função, addCampos(), para que o usuário crie vários campos input.

saida.jsp (popup)

<div id="campoPai"></div>
<input type="text" id='ctxt' name="campo[]" class="form-control">   
<input type="button" value="Adicionar campos" onclick="addCampos()">
<button class="btn btn-success" onclick="enviaDados();">Envia Dados</button>

<script type="text/javascript">
  var qtdeCampos = 0;
  function addCampos() {
    var objPai = document.getElementById("campoPai");
    var objFilho = document.createElement("div");//Criando o elemento DIV;
    objFilho.setAttribute("id","filho"+qtdeCampos);//Definindo atributos ao objFilho
    objPai.appendChild(objFilho);//Inserindo o elemento no pai
    //Escrevendo algo no filho recém-criado:
    document.getElementById("filho"+qtdeCampos).innerHTML = "<input type='text' id='ctxt"+qtdeCampos+"' name='campo[]'>\n\<input type='button' onclick='removerCampo("+qtdeCampos+")' value='Apagar campo'>";
    qtdeCampos++;
  }
  function removerCampo(id) {
    var objPai = document.getElementById("campoPai");
    var objFilho = document.getElementById("filho"+id);
    //Removendo o DIV com id específico do nó-pai:
    var removido = objPai.removeChild(objFilho);
  }
</script>

No método abaixo, é a parte principal da outra pergunta, é onde é passado os valores (um array) para a página pai.

<script language="javascript">
  function enviaDados(){
    $("#idPai").html(""); // Aqui irá resetar o conteudo da div.
    $('input[id^="ctxt"]').each(function(){
    $("#idPai").append("<p><b> Valor do Imput: "+$(this).val()+"</b></p>");
    });
    window.close();
  }
</script>

Atualização

O meu problema é que não sei como usar (pegar) esse valor na página pai. O que preciso é: o usuário vai digitar várias palavras no popup, quando fechar o popup, as palavras digitadas serão comparadas com um array java, e assim somente as palavras digitadas que estiverem contidas nesse array serão mostradas na tela.

11
  • 1
    Amiguinho, você pode pegar os valores a partir do each colocando o $(this).val() em um array no objeto window usando a função Array.push(). Commented 13/05/2016 às 14:40
  • 1
    @Pacíficão Opa, tu precisa pegar os valores dos inputs e jogar para o jsp pai ( aqui se entende como o proprio html já renderizado), ou para o java?
    – Matheus
    Commented 13/05/2016 às 17:50
  • 1
    @Pacíficão Acho que está um pouco confuso, no jsp se entende como o html com suas funções JavaScript, se tu quer jogar para o java, pq não usa um Form normal?
    – Matheus
    Commented 13/05/2016 às 17:54
  • 2
    @Pacíficão Agora entendi o que você precisa. Porém terá que editar a pergunta, anexando tal problema para que possam te auxiliar.
    – Matheus
    Commented 13/05/2016 às 18:03
  • 1
    @devgaspa Sim, partindo do principio que o programador pegou a lista do java e passou para um array no JS. Depois apenas se compara os valores do each com o array vindo do java.
    – Matheus
    Commented 13/05/2016 às 18:12

1 Resposta 1

3

Vamos lá, para pegar os dados você usa a mesma função($(this).val()), dentro do each, que esta atribuindo os valores na div#idPai do HTML.

Para armazenar esses valores em um array você declara uma variável antes da função enviaDados. Dentro do each, a cada execução, você adiciona no array o valor utilizando a função push().

Veja como fica no código:

<script language="javascript">
  var arrayDados = []; // declaração do array no escopo global.
  function enviaDados(){
    $("#idPai").html(""); // Aqui irá resetar o conteudo da div.
    $('input[id^="ctxt"]').each(function(){
      arrayDados.push($(this).val()); // adiciona o valor no array.
      $("#idPai").append("<p><b> Valor do Imput: "+$(this).val()+"</b></p>");
    });
    window.close();
  }
</script>

Esta implementação é para guardar os valores que vieram do modal em um array no escopo global do JavaScript, sendo possível acessar da pagina pai.

@Edit

Pressupondo que você tenha criado um array no JS com os valores do JAVA, como nosso amigo @Matheus disse nos comentários, sendo este array de escopo global. Para verificar a existência dos valores você pode utilizar a função indexOf() para validar.

Obs: Vamos supor que você criou o array var ArrayJScomValoresDoJava = [x,p,t,o] com os valores do array do JAVA.

Veja como fica no código:

<script language="javascript">
  function enviaDados(){
    $("#idPai").html(""); // Aqui irá resetar o conteudo da div.
    $('input[id^="ctxt"]').each(function(){
      if(ArrayJScomValoresDoJava.indexOf($(this).val()) != -1) {
        $("#idPai").append("<p><b> Valor do Imput: "+$(this).val()+"</b></p>");
      };
    });
    window.close();
  };
</script>

Esta implementação irá adicionar à div#idPai apenas quando o valor passado pelo modal existir no array, leia sobre indexOf se houver dúvidas.

2
  • Como eu acesso esse vetor na página pai? Commented 13/05/2016 às 17:51
  • 2
    @Pacíficão através da variável arrayDados. Porem pela discussão nos comentários, talvez, este exemplo não seja viável para seu problema. Commented 13/05/2016 às 18:06

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 .