1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Ajuda com javascript

Discussão em 'Programação' iniciada por sard, 30 de Maio de 2007. (Respostas: 5; Visualizações: 2315)

  1. Boas, tou a fazer um trabalho académico e tou com um ligeiro problema. É o seguinte: Tenho uma página com um formulário para introduzir dados numa base de dados relativos a um DVD. Quando chego à parte de seleccionar as legendas desse DVD tenho um "button" que ao carregar vai abrir uma nova página (pop up) com um novo formulário com as possíveis legendas. Dps de seleccionar as legendas q o DVD a introduzir tem eu queria fechar essa página (pop up) e voltar à página inicial (carregando no "submit"). Fazer cada acção dessas em separado é relativamente simples, fechar e voltar para uma nova página tb consigo fazer. Agora fechar a pop up e fazer o refresh à página inicial, adicionando as novas variaveis (utilizando o get) n tou a chegar lá.. Alguém sabe como fazer isto? Ou sabe me apontar o caminho q devo seguir pa conseguir?
     
  2. p3dro

    p3dro Power Member

    pk n optas por uma abordagem javascript?

    vê se este exemplo te ajuda:
    ficheiro "teste.htm", será o teu formulario principal:
    Código:
    <html>
      <body>
        <form name="frmTeste" method="POST" id="frmTeste">
          Nome: <input type="text" id="txtName" name="txtName">
          Sexo:
            <select name="ddlSex" id="ddlSex">
              <option value="masculino">Masculino</option>
              <option value="feminino">Feminino</option>
            </select>
          <br>
          Sexo (extenso): <input type="text" id="txtSex" name="txtSex">
          <br>
          <input type="button" value="Abrir opções" onclick="window.open('teste2.htm')">
        </form>
      </body>
    </html>
    
    ficheiro "teste2.htm" será a tal popup que te vai permitir escolher uma opção, quando pressionares o botão do form, nesta página, vai actualizar os campos que estão no formulário anterior:
    Código:
    <html>
      <head>
        <script type="text/javascript">
        function updateValues(form){
          //campos da "outra" página que vão ser actualizados
          var arrFieldsToUpdate = new Array();
          arrFieldsToUpdate[0]="txtName";
          arrFieldsToUpdate[1]="ddlSex";
          arrFieldsToUpdate[2]="txtSex";
    
          //campos desta página que contém os valores que vão ser actualizados
          var arrFieldsToUpdateFrom = new Array();
          arrFieldsToUpdateFrom[0]="txtName2";
          arrFieldsToUpdateFrom[1]="ddlSex2";
          arrFieldsToUpdateFrom[2]="ddlSex2";
          
          var count=arrFieldsToUpdate.length;
          
          for(var i=0;i<count;i++){
            var fieldToUpdate=opener.document.getElementById(arrFieldsToUpdate[i]);
            var fieldToUpdateFrom=form.elements[arrFieldsToUpdateFrom[i]];
            fieldToUpdate.value=fieldToUpdateFrom.value;
          }
          self.close();
        }
      </script>
      </head>
      <body>
        <form name="frmTeste" method="post" id="frmTeste">
          Nome: <input type="text" id="txtName" name="txtName2">
          Sexo:
            <select name="ddlSex" id="ddlSex2">
              <option value="masculino">Masculino</option>
              <option value="feminino">Feminino</option>
            </select>
          <input type="button" value="Actualizar Valores" onclick="updateValues(this.form);">
        </form>
      </body>
    </html>
    
    penso que se optares por 1 solução server-side, terás de por ex. na popup qdo escolheres uma opção e a submeteres terás de a guardar na bd, depois terás de reconstruir o formulário, porém imagina que alteraste vários campos no formulário principal, esses valores iriam ser perdidos, visto que não seriam guardados em lado nenhum e o formulário iria ser carregado.

    espero n ter baralhado ainda mais :joker:
     
  3. p2dro, obg pela resposta..

    O meu caso é o seguinte:

    Ficheiro 'novo_dvd.php'
    Código:
    <form name="form1" action="novo_dvd.php" method="get" enctype="multipart/form-data" id="form1">
    
    <?php 
                include("conf.php");
                $con=mysql_connect($host,$user,$pass);
                if(!$con){
                    die("ERRO NA LIGAÇÃO". mysql_error());
                }
                mysql_select_db($db,$con);            
    ?>
    
    <table width="600" border="1" cellspacing="1" cellpadding="1">
      
      <tr>
        <td><div align="right">Nome:</div></td>
        <td><input name="nome" id="nome" type="text" size="30" maxlength="45"></td>
      </tr>
      
      <tr>
          <td><div align="right">Genero:</div></td>
        <td>
            <select name="genero" id="genero">
            <?php
                
                $result=mysql_query(" SELECT idgenero as id,tipo as name from generos"); 
                
                while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
                    if($genero==$row["id"])
                        printf("<option value='%d'  selected='selected'>%s</option>\n", $row["id"], $row["name"]);
                    else
                        printf("<option value='%d'>%s</option>\n", $row["id"], $row["name"]);
                }
                mysql_free_result($result);
                if(!isset($genero))
                    echo "<option value='-1' selected='selected'>Seleccione um genero</option>";
                else
                    echo "<option value='-1'>Seleccione um genero</option>";
            ?>
            </select>
        </td>
      </tr>
      
      <tr>
          <td><div align="right">Ano:</div></td>
        <td>
            <select name="ano" id="ano">
                <?php
                    for($i=date("Y");$i>=date("Y")-50;$i--){
                        printf("<option value='%d'>%d</option>\n", $i, $i);
                    }
                ?>
            </select>
        </td>
      </tr>
      
      <tr>
          <td><div align="right">Formato:</div></td>
        <td>
         <select name="formato" id="formato">
            <?php
                $result=mysql_query(" SELECT idformato as id,formato as name from formatos"); 
                
                while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
                    if($formato==$row["id"])
                        printf("<option value='%d'  selected='selected'>%s</option>\n", $row["id"], $row["name"]);
                    else
                        printf("<option value='%d'>%s</option>\n", $row["id"], $row["name"]);
                }
                mysql_free_result($result);
                if(!isset($formato))
                    echo "<option value='-1' selected='selected'>Seleccione um formato</option>";
                else
                    echo "<option value='-1'>Seleccione um formato</option>";
            ?>
         </select>
        </td>
      </tr>
      
      <tr>
          <td><div align="right">Idioma:</div></td>
        <td><input name="nomee" type="hidden" value="<?php echo $nome;?>">
        <input name="idiomas_filme" type="button" onClick="AbrirPopUp('idiomas_filme.php');" value="Seleccione"></td>
             
      </tr>
      
      <tr>
          <td><div align="right">Legendas:</div></td>
        <td><input name="escolher_legendas" type="button" onClick="MM_openBrWindow('legendas_filme','EscolherLegendas','scrollbars=yes,width=200px,height=400px')" value="Seleccione"></td>
      </tr>
       
      <tr>
          <td><div align="right">Número de discos:</div></td>
        <td>
            <select name="numdiscos" id="numdiscos">
                <?php
                    for($i=1;$i<=5;$i++){
                        printf("<option value='%d'>%d</option>\n", $i, $i);
                    }
                ?>
            </select>
        </td>
      </tr>
      
      <tr>
        <td><div align="right">Link:</div></td>
        <td><input name="link" type="text" size="30" maxlength="45" id="link"></td>
      </tr>
      
      <tr>
          <td><div align="right">Imagem:</div></td>
        <td>
            <input type="hidden" name="MAX_FILE_SIZE" value="2000000"> <!--http://www.php-mysql-tutorial.com/php-mysql-upload.php-->
            <input name="userfile" type="file" id="userfile">
        </td>
      </tr>
      
      <tr>
        <td><input name="flag" type="hidden" value="<?php echo '1'; ?>"></td>
        <td><input type="submit" name="submit" value="Introduzir"></td>
      </tr>
    
    </table> 
    
    </form>
    
    
    Ficheiro 'idiomas_filme.php': (Abre ao clicar no botão que está em frente ao Idioma)

    Código:
    <body>
        <?php 
            include("conf.php");
            $con=mysql_connect($host,$user,$pass);
            if(!$con){
                die("ERRO NA LIGAÇÃO". mysql_error());
            }
            mysql_select_db($db,$con);            
        ?>
            <form action="" method="get">
             
              <?php
                
                $result=mysql_query(" SELECT ididioma as id,idioma as name from idiomas"); 
                echo "<table width='200' border='1px'>";
                while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
                        echo "<tr>";
                        printf("<td><div align='right'><input name='idiomas' type='checkbox' value='%d'></div></td><td><div align'left'>%s</div></td>", $row["id"], $row["name"]);                    
                        echo "</tr>";            
                }
                echo "<tr><td>&nbsp;</td><td><input name='submit' type='submit' value='OK' onClick='updateValues(this.form);refreshParent();'></td></tr>";
                echo "</table>";
                mysql_free_result($result);
                echo "O nome é:</br>";
                echo "$nomee";
            ?>
        </form>
                
           
        <?php
            mysql_close($con);
        ?>
    </body>
    
    Ficheiro 'funcoes.js':

    Código:
    function AbrirPopUp(pagina) {
        var width = 285;
        var height = 390;
        var left = (screen.width-width)/2;
        var top = (screen.height-height)/2;
        window.open(pagina,'pagina','width='+width+', height='+height+', top='+top+', left='+left+'');
                        
    }
    
    function refreshParent() {
      window.opener.location.href = window.opener.location.href;
    
      if (window.opener.progressWindow){
        window.opener.progressWindow.close()
      }
      window.close();
    }
    
    
    function updateValues(form){
          //campos da "outra" página que vão ser actualizados
          var arrFieldsToUpdate = new Array();
          arrFieldsToUpdate[0]="nome";
          arrFieldsToUpdate[1]="genero";
          arrFieldsToUpdate[2]="ano";
          arrFieldsToUpdate[3]="formato";
          arrFieldsToUpdate[4]="numdiscos";
          arrFieldsToUpdate[5]="link";
          arrFieldsToUpdate[6]="userfile";
    
    
    
          //campos desta página que contém os valores que vão ser actualizados
          var arrFieldsToUpdateFrom = new Array();
          arrFieldsToUpdateFrom[0]="idiomas";
          
          var count=arrFieldsToUpdate.length;
          
          for(var i=0;i<count;i++){
            var fieldToUpdate=opener.document.getElementById(arrFieldsToUpdate[i]);
            var fieldToUpdateFrom=form.elements[arrFieldsToUpdateFrom[i]];
            fieldToUpdate.value=fieldToUpdateFrom.value;
          }
          self.close();
    }
    
    
    
    Era isto que estavas a dizer para fazer? Tou com dúvida ali no fim do 'idiomas_filme.php', é para meter o onClick='updateValues(this.form);refreshParent();' ??

    Não tou a conseguir meter isto a funcionar ainda.. :mad:
     
  4. p3dro

    p3dro Power Member

    pelo k percebi só vais actualizar o campo idioma, recorrendo à popup


    tenta mudar isto
    Código:
          var arrFieldsToUpdate = new Array();
          arrFieldsToUpdate[0]="nome";
          arrFieldsToUpdate[1]="genero";
          arrFieldsToUpdate[2]="ano";
          arrFieldsToUpdate[3]="formato";
          arrFieldsToUpdate[4]="numdiscos";
          arrFieldsToUpdate[5]="link";
          arrFieldsToUpdate[6]="userfile";
    
    
    
          //campos desta página que contém os valores que vão ser actualizados
          var arrFieldsToUpdateFrom = new Array();
          arrFieldsToUpdateFrom[0]="idiomas";
    
    para isto

    Código:
          var arrFieldsToUpdate = new Array();
          arrFieldsToUpdate[0]="nomee";
    
          //campos desta página que contém os valores que vão ser actualizados
          var arrFieldsToUpdateFrom = new Array();
          arrFieldsToUpdateFrom[0]="idiomas";
    
    atenção que não precisas de fazer o refresh ao parent, a função "updateValues" vai modificar o campo idiomas, se vais fazer 1 refresh vais re-carregar a página com os valores da BD;

    no file "idiomas_filme.php" altera o type="submit" para type="button" e onClick='updateValues(this.form);refreshParent();' para onClick='updateValues(this.form);'

    basicamente aquele código que mostrei altera directamente o formulário principal, depois nesse formulário principal quando fizeres o submit é que vai guardar a informação na bd.
     
    Última edição: 4 de Junho de 2007
  5. Ok, já estou a perceber melhor a lógica disto, pelo menos já voltei do popup para a parent sem perder os dados que lá tinha inicialmente.

    Continuando,

    eu quero manter todos os dados e actualizar só o campo "idiomas_filme", por isso mudei para isto:

    Código:
    var arrFieldsToUpdate = new Array();
          arrFieldsToUpdate[0]="idiomas_filme";
    
          //campos desta página que contém os valores que vão ser actualizados
          var arrFieldsToUpdateFrom = new Array();
          arrFieldsToUpdateFrom[0]="idiomas";
    Não é isto?

    Agora não estou é a conseguir passar para a parent o q selecciono na página idiomas_filme.php. Será por estar a usar várias checkbox com o mesmo nome?

    Qdo volto à parent o button q carrego para ir para o popup fica assim:

    [​IMG]

    Aquele undefined quer dizer o que?

    Desculpa lá tar a fazer tantas perguntas, mas tou mm a fritar com isto..
     
  6. p3dro

    p3dro Power Member

    pois, aquele script de exemplo que te mostrei não funciona com checkboxes :-D, nem reparei k era isso k kerias utilizar, aquele script só funciona com textbox e dropdown.

    subtitui a função "updateValues" (ou então muda o nome, caso precises dela para alguma coisa :)) por esta:
    Código:
        
        function updateValues(form, fieldSource, fieldDestination){
          fieldDestination=opener.document.getElementById(fieldDestination);
          fieldSource=form.elements[fieldSource];
          count=fieldSource.length;
          result="";
    
          if(count==undefined){ //só existe 1 checkbox
            result = (fieldSource.checked) ? fieldSource.value : "";
          }
          else{ //várias checkbox, percorrer array
            for(i=0;i<count;i++){
              if (fieldSource[i].checked) {
                result+=fieldSource[i].value+";";
              }
            }
          }
    
          fieldDestination.value=result;
          self.close();
        }
    
    e agora põe o botão assim:
    Código:
    <input name='submit' type='button' value='OK' onClick="updateValues(this.form,'idiomas','idiomas_filme');">
    Pelo k vejo no teu código (não sei se é o mais actual k tu tens) o idiomas_filme é um botão, é ai k pretendes mostrar a informação? É pk eu acho k o valor do button não é passado no formulário, cria antes uma textbox (ou usa um hidden field) e armazena lá a informação.
     

Partilhar esta Página