abrir pagina.php no centro

Duarte_ · Janeiro 26, 2010

Caro Colegas estou com um probleminha a quase 1 mês, e gostaria muito de que me ajudassem. O problem é que tenho um script jquery que monta um layout com com duas colunas e duas linhas, até ai tudo bem, depois tenho um menu accordion que funciona perfeitamente, porém quando. clico no link tabelas->bairros e mando abrir no centro ele abre uma nova página. script logo abaixo:

layout.html

<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Resizing Border Layout example</title>
        <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-1" />

        <link type="text/css" href="media/css/jquery-ui-1.7.2.custom.css" rel="stylesheet" />
        <script type="text/javascript" src="media/js/jquery.min.js"></script>
        <script type="text/javascript" src="media/js/ddaccordion.js"></script>
        <script type="text/javascript" src="media/js/jquery-1.3.2.js"></script>
        <script type="text/javascript" src="media/js/jquery-ui-1.7.2.custom.min.js"></script>
        <script type="text/javascript" src="media/js/jquery.metadata.js"></script>
        <script type="text/javascript" src="media/js/jquery.sizes.js"></script>
        <script type="text/javascript" src="media/js/jlayout.border.js"></script>
        <script type="text/javascript" src="media/js/jquery.jlayout.js"></script>
        <script type="text/javascript">
        ddaccordion.init({
           headerclass: "submenuheader", //Shared CSS class name of headers group
           contentclass: "submenu", //Shared CSS class name of contents group
           revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
           mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
           collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
           defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
           onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
           animatedefault: false, //Should contents open by default be animated into view?
           persiststate: true, //persist state of opened contents within browser session?
           toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
           togglehtml: ["suffix", "<img src='media/images/plus.gif' class='statusicon' />","<img src='media/images/minus.gif' class='statusicon' />"],
                 //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"]
                 //(see docs)
           animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
           oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
           //do nothing
        },
          onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
          //do nothing
        }
        })
        </script>
        <script type="text/javascript">
            jQuery(function($)
            {
                var container = $('.layout');

                function relayout() {
                    container.layout({resize: false});
                }
                relayout();

                $(window).resize(relayout);

                $('.north').resizable({
                    handles: 's',
                    stop: relayout
                });

                $('.south').resizable({
                    handles: 'n',
                    stop: relayout
                });

                $('.east').resizable({
                    handles: 'w',
                    stop: relayout
                });

                $('.west').resizable({
                    handles: 'e',
                    stop: relayout
                });
            });
        </script>
        <style>
            html, body {
                width: 100%;
                height: 100%;
                padding: 0;
                margin: 0;
                overflow: hidden;
            }

            .layout {
                height: 100%;
            }

            .center, .east, .west, .north, .south {
                background-color: rgb(220,220,220);
                border: 1px solid rgb(200,200,200);
                text-align: center;
                display: inline-block;
            }

            .west, .east {
                width: 20%;
            }

            .north {
                height: 10%;
            }
            .south{
                height: 5%;
            }

        $(document).ready(function(){
           $('a').click( function(){
             var href = $(this).attr('href');// pega o valor do atributo href da âncora clicada
             $('#center').load(href);
             return false;
           });
        });

            
        </style>

        <style type="text/css">
            @import url(media/css/principal.css);
            @import "media/css/demo_page.css";
            @import "media/css/demo_table_jui.css";
            @import "examples_support/themes/smoothness/jquery-ui-1.7.2.custom.css";
        </style>


    </head>
    <body>
        <div class="layout {layout: {type: 'border', hgap: 3, vgap: 3}}">
            <div id="center" class="center">
                Center
            </div>
            <!--
            <div class="east">
                East
            </div>
            -->
            <div class="west">
                West

                 <div class="glossymenu">
                      <a class="menuitem submenuheader" href="http://www.dynamicdrive.com/style/" >Tabelas</a>
                         <div class="submenu">
                              <ul>
                              <li><a href="grid_bairro.php"">Bairros</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Tipo de Documentos</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Opcao 3</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Opcao 4</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">Opcao 5</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Opcao 6</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Opcao 7</a></li>
                              <li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Opcao 8</a></li>
                              </ul>
                         </div>
                      <a class="menuitem" href="http://www.dynamicdrive.com/">Requerimento</a>
                      <a class="menuitem" href="http://www.javascriptkit.com/jsref/">Relatórios</a>
                      <a class="menuitem" href="http://www.javascriptkit.com/domref/">DOM Reference</a>
                      <a class="menuitem submenuheader" href="http://www.cssdrive.com">CSS Drive</a>
                      <div class="submenu">
                           <ul>
                           <li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
                           <li><a href="http://www.cssdrive.com/index.php/menudesigns/">Menu Gallery</a></li>
                           <li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
                           <li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
                           <li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
                           <li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
                           </ul>
                           <img src="http://i27.tinypic.com/sy7295.gif" style="margin: 10px 5px" />
                      </div>
                      <a class="menuitem" href="http://www.codingforums.com/" style="border-bottom-width: 0">Coding Forums</a>
                 </div>

                
            </div>
            <div class="north">
                North
            </div>
            <div class="south">
                South
            </div>
        </div>

    </body>
</html>

grid_bairro.php

<?
      header("Content-Type: text/html; charset=ISO-8859-1");
      $host = 'c:/sistemas/www/alvara/dados/alvara.gdb';
      $username = 'sysdba';
      $password = 'masterkey';
      $dbh = ibase_connect($host, $username, $password);
      
    ?>

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
        <!--<link rel="shortcut icon" type="image/ico" href="http://www.sprymedia.co.uk/media/images/favicon.ico" />-->
        
        <title>DataTables example</title>
        <script type="text/javascript" language="javascript" src="media/js/jquery.js"></script>
        <script type="text/javascript" language="javascript" src="media/js/jquery.dataTables.js"></script>
        <style type="text/css" title="currentStyle">
            @import "media/css/demo_page.css";
            @import "media/css/demo_table_jui.css";
            @import "examples_support/themes/smoothness/jquery-ui-1.7.2.custom.css";
        .style1 {font-size: 80%}
        </style>
        <script type="text/javascript" >
            $(document).ready(function() {
                oTable = $('#example').dataTable({
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "aoColumns": [
                        { bSortable: false },
                        { bSortable: false },
                        null,
                        { bSortable: true },
                        null
                        
                    ]
                });
            } );
        </script>
    </head>
    <body id="dt_example">
        <div id="container">
            <div class="full_width big">
                <i>Bairros</i> / Cadastro de Bairros
            </div>
            <div class="demo_jui">
                 <form action="" method="post" name="gridbairros" class="demo_jui" id="gridbairros">
                 <table border="0" align="center" cellpadding="0" cellspacing="0" class="display" id="example">
                    <thead>
                       <tr>
                       <th width="5" ><div align="center" class="style1">EDITAR</div></th>
                       <th width="5" ><div align="center">EXCLUIR</div></th>
                       <th width="5%">CODIGO</th>
                       <th width="75%">BAIRRO</th>
                       <th width="15%">ADL</th>
                       </tr>
                    </thead>
                    <tbody>
           
                      <?


                      header("Content-Type: text/html; charset=ISO-8859-1");
                      // consulta SQL e retornando os resultados em uma tabela HTML
                      ini_set('memory_limit',"1390M");
                      $stmt = 'SELECT * FROM ALV_BAIRRO';
                      $sth = ibase_query($dbh, $stmt);
      
                      while ($row = ibase_fetch_object($sth)) {  ?>

                        <tr class="gradeX">
                        <td width="15" height="15" align="center" valign="top"><a href="cadastro_bairro.php?alvbair_cod=<?=$row->ALVBAIR_COD; ?>"><img src="media/images/editar3.png" id="imagem" width="16" height="16" border="0" align="top"></a>
                        <td width="15" height="15" align="center" valign="top"><a href=""> <img src="media/images/excluir.png" width="13" height="15" border="0"></a>
                        <td><?= $row->ALVBAIR_COD; ?></td>
                        <td><?= $row->ALVBAIR_NOME;   ?></td>
                        <td><?= $row->ALVBAIR_ADL;    ?></td>
                        </tr>


                      <?}?>

                      <?

                      ibase_free_result($sth);
                      ibase_close($dbh);
                      ?>
                    </tbody>
                 </table>
                 </form>
            </div>
            <div class="spacer"></div>
            
            <div id="footer" style="text-align:center;">
                <span style="font-size:10px;">
                
                    InformaÃ§Ãµes mande um email para &copy; <a href="#">duarteol2000@yahoo.com.br</a> </span>
            </div>
        </div>
    </body>
</html>

relmente não sei o que acontece, lembrando que sou principiante estou estudando para tentar fazer um sisteminha, obrigado desde já a todos que puderem me dar uma forcinha.

Marcos Duarte :rolleyes:

.Andreia. · Janeiro 31, 2010

fica meio dificil analisar um codigo desse tamanho, mas geralmente se coloca uma name no frame e no link da chamada, use o target="nome_do_frame"

Entrar

abrir pagina.php no centro

Pergunta

Duarte_

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

.Andreia.

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades