Scribd Logo
Importer

Bienvenue sur Scribd !

  • 2016-COTEMIG-TPA-Exercicio13-PDO - View PDF

    Transféré par

    ademaralve
    4 vues4 pages

    Titre original

    2016-COTEMIG-TPA-Exercicio13-PDO - View.pdf

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    4 vues4 pages

    2016-COTEMIG-TPA-Exercicio13-PDO - View PDF

    Transféré par

    ademaralve

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 4

    Exercício 13 – PDO – View (MVC)

    21 out
    Disciplina: Técnicas de Programação Avançada
    Carga-horária: 160 horas-aula
    4 aulas semanais

    Téc Prog Avançada Definição


    PDO
    MVC Montando a VIEW do modelo MVC.

    Referências

    http://www.w3schools.com/bootstrap/

    Exercícios
    1) A partir da estrutura de diretórios utilizada no projeto, acrescentar os arquivos destacados em anexo:

    2) Customizar o layout do site deixando-o com a sua cara.

    Anexos
    pdo/index.html
    <?php include("ui/header.htm"); ?>
    <?php include("ui/nav.htm"); ?>
    <div id="content"></div>
    <?php include("ui/deleteconfirmmodal.htm"); ?>
    <?php include("ui/footer.htm"); ?>

    pdo/ui/header.html
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>PRODUTO</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link rel="stylesheet"
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <link href="ui/css/crud.css" rel="stylesheet" media="screen">


    </head>

    <body>
    <div class="container">

    <div class="jumbotron">
    <h1>PRODUTO</h1>
    Pág.02

    </div>

    pdo/ui/nav.html
    <div class="navbar">
    <div class="navbar-inner">
    <ul class="nav">
    <li><a href="javascript:void(0);" id="user_list"><i class="icon-th
    icon-black"></i> Listar</a></li>
    <li><a href="javascript:void(0);" id="create_user_form"><i
    class="icon-plus-sign icon-black"></i> Novo</a></li>
    </ul>
    </div>
    </div>

    <div id="indicator" style="display: none; text-align: center;" class="loading_img">


    <img src="ui/img/indicator.gif"/>
    </div>

    pdo/ui/deleteconfirmmodal.html
    <div id="delete_confirm_modal" class="modal hide fade" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
    <h3 id="myModalLabel">Excluir</h3>
    </div>

    <div class="modal-body">
    <p>Tem certeza que deseja excluir?</p>
    </div>
    <div class="modal-footer">
    <input type="hidden" id="user_id" value="" />
    <button class="btn" data-dismiss="modal" aria-hidden="true">Não</button>
    <button class="btn btn-primary delete">Sim</button>
    </div>
    </div>

    pdo/ui/footer.html
    </div>

    <script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.js"></script>
    <script
    src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <script src="ui/js/custom.js"></script>

    </body>
    </html>

    pdo/ui/css/crud.css
    body {
    padding-top: 20px;
    padding-bottom: 60px;
    }

    /* Custom container */
    .container {
    margin: 0 auto;
    max-width: 1000px;
    }
    .container > hr {
    margin: 60px 0;
    Pág.03

    /* Main marketing message and sign up button */


    .jumbotron {
    margin: 20px 0;
    text-align: center;
    background-color: #000;
    color: #f00;
    }
    .jumbotron h1 {
    font-size: 100px;
    line-height: 1;
    }
    .jumbotron .lead {
    font-size: 24px;
    line-height: 1.25;
    }
    .jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
    }

    /* Supporting marketing content */


    .marketing {
    argin: 60px 0;
    }
    .marketing p + h4 {
    margin-top: 28px;
    }

    /* Customize the navbar links to be fill the entire space of the .navbar */
    .navbar .navbar-inner {
    padding: 0;
    }
    .navbar .nav {
    margin: 0;
    display: table;
    width: 100%;
    }
    .navbar .nav li {
    display: table-cell;
    width: 1%;
    float: none;
    }
    .navbar .nav li a {
    font-weight: bold;
    text-align: center;
    border-left: 1px solid rgba(255,255,255,.75);
    border-right: 1px solid rgba(0,0,0,.1);
    }
    .navbar .nav li:first-child a {
    border-left: 0;
    border-radius: 3px 0 0 3px;
    }
    .navbar .nav li:last-child a {
    border-right: 0;
    border-radius: 0 3px 3px 0;
    }

    .form-horizontal .control-label {
    Pág.04

    padding-top: 0px;
    }

    .input-prepend .add-on-area {
    display: inline-block;
    width: auto;
    height: 20px;
    min-width: 16px;
    padding: 22px 5px;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    background-color: #eee;
    border: 1px solid #ccc;
    }

    .input-prepend .add-on {
    width: 90px;
    }

    textarea {
    height: 56px;
    }

    Vous aimerez peut-être aussi