2015-09-25 126 views
-2

我有這個的index.php代碼:刪除與模態確認PHP中選定的項目

<form role="form" id="submit_form" class="form-horizontal"> 

       <div class="panel-body"> 
        <div class="form-group has-feedback"> 
        <div class="col-sm-2"> 
         <label class="control-label">País</label> 
        </div> 
        <div class="col-sm-9"> 
         <? 
         $array_pais = array('Selecione...', 'Alemanha', 'Angola', 'Argentina', 'Bolívia', 'Brasil', 'Camarões', 'Canadá', 'Chile', 'China', 'Colombia', 
          'Costa Rica', 'Cuba', 'Dinamarca', 'Equador', 'Espanha', 'Estados Unidos', 'França', 'Holanda', 'Inglaterra', 'Itália', 'Japão', 
          'México', 'Nigéria', 'Panamá', 'Paraguai', 'Peru', 'Porto Rico', 'Portugal', 'Rússia', 'Senegal', 'Taiwan', 'Uruguai', 'Venezuela' 
         ); 
         echo '<select class="form-control" name="pais" id="pais">'; 
         foreach ($array_pais as $valor) { 
          echo '<option>' . $valor . '</option>'; 
         } 
         echo '</select>'; 
         ?> 
        </div> 
        </div> 
        <div class="form-group has-feedback"> 
        <div class="col-sm-2"> 
         <label class="control-label">Nome:</label> 
        </div> 
        <div class="col-sm-10"> 
         <input id="nome" name="nome" class="form-control" type="text" placeholder="Digite o nome"> 
        </div> 
        </div> 
        <div class="form-group has-feedback"> 
        <div class="col-sm-2"> 
         <label class="control-label">Empresa</label> 
        </div> 
        <div class="col-sm-10">     
         <input id="empresa" name="empresa" class="form-control" type="text" placeholder="Digite a empresa"> 
        </div> 
        </div> 
        <div class="form-group"> 
        <div class="col-sm-12 col-sm-offset"> 

         <div style="float:left; padding-right:30px"> 
          <button type="submit" class="btn btn-lg btn-primary" aria-label="Left Align"> 
           <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>&nbsp; Adicionar 
          </button> 
         </div> 

         <div style="float:right;"> 
          <button class="btn btn-lg btn-warning" onClick="parent.location='exibir.php'"> 
         </div>     
        </div> 
        </div> 
       </div> 

       </form> 
      </div> 
      </div> 
      <div class="col-md-2"></div> 
     </div> 
     </div> 
    </div> 
    <div class="section"> 
     <div class="container"> 
     <div class="row"> 
      <div class="col-md-12"> 
      <div class="jumbotron"> 
       <table data-toggle="table" data-cache="false" class="table" id="list"> 
       <thead align="center"> 
        <tr bgcolor="#FFFFFF"> 
        <th>PAÍS</th> 
        <th>NOME</th> 
        <th>EMPRESA</th> 
        <th>AÇÕES</th> 
        </tr> 
       </thead> 
       <tbody></tbody> 
       </table> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 


    <div class="modal fade" id="inserir_modal" role="dialog"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal">&times;</button> 
        <h3 class="modal-title"> 
        <span class="glyphicon glyphicon-file"></span>&nbsp; Inserir 
        </h3> 
       </div> 
       <div class="modal-body"></div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button> 
       </div> 
      </div> 
     </div> 
    </div> 


    <div class="modal fade" id="editar_modal" role="dialog"> 
     <div class="modal-dialog"> 
      <form id="edit_form" class="form"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal">&times;</button> 
         <h3 class="modal-title"> 
         <span class="glyphicon glyphicon-pencil"></span>&nbsp; Editar 
         </h3>    
        </div> 
        <div class="modal-body"> 
         <div class="form-group"> 
          <label class="control-label">País:</label> 
          <input id="pais_input" name="nome" class="form-control" type="text" placeholder="Digite o pais"> 
         </div>   
         <div class="form-group"> 
          <label class="control-label">Nome:</label> 
          <input id="nome_input" name="nome" class="form-control" type="text" placeholder="Digite a empresa"> 
         </div> 
         <div class="form-group"> 
          <label class="control-label">Empresa:</label> 
          <input id="empresa_input" name="empresa" class="form-control" type="text" placeholder="Digite a empresa"> 
         </div> 
         <input id="id_input" type="hidden" name="id"> 
        </div> 
        <div class="modal-footer"> 
         <button type="submit" class="btn btn-success" aria-label="Left Align"> 
          <span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>&nbsp; Gravar 
         </button> 

         <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button> 

        </div> 
       </div> 
      </form> 
     </div> 
    </div> 


    <div class="modal fade" id="deletar_modal" role="dialog"> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal">&times;</button> 
        <h3 class="modal-title"> 
        <span class="glyphicon glyphicon-trash"></span>&nbsp; Exclusão 
        </h3> 
       </div> 
       <div class="modal-body"></div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button> 
       </div> 
      </div> 
     </div> 
    </div> 



<script> 

    function update_list() { 
     $.getJSON("get_list.php", function (data) { 
      if (data.response) { 
       $("#list").find("tbody").empty(); 
       data.results.forEach(function (i) { 
        $("#list").find("tbody").append(
         "<tr>" + 
         "<td>" + i.pais + "</td>" + 
         "<td>" + i.nome + "</td>" + 
         "<td>" + i.empresa + "</td>" + 
         "<td align='center'><a class='btn btn-primary glyphicon glyphicon-pencil' title='Editar' id='edit_link' href='" + JSON.stringify(i) + "'></a> | <a class='btn btn-danger glyphicon glyphicon-trash' title='Deletar' id='delete_link' href='" + JSON.stringify(i) + "'></a></td>" + 
         "</tr>" 
        ); 
       }); 
      } 
     }); 
    } 

    $("#list").delegate('#edit_link', 'click', function (e) { 
     e.preventDefault(); 
     var info = JSON.parse($(this).attr("href")); 
     var $modal = $("#editar_modal"); 
     $modal.find("#pais_input").val(info.pais); 
     $modal.find("#nome_input").val(info.nome); 
     $modal.find("#empresa_input").val(info.empresa); 
     $modal.find("#id_input").val(info.id); 
     $modal.modal('show'); 
    }); 

    update_list(); 
    $('#submit_form').submit(function() { 
     $.ajax({ 
      url: "inserir.php", 
      type: "POST", 
      data: $(this).serialize(), 
      dataType: "json", 
      success: function (data) { 
       if (data.response) { 
        var $modal = $('#inserir_modal'); 
        $modal.find(".modal-body").html(data.message); 
        $modal.modal('show'); 
        update_list(); 
       } else { 
        alert(data.message); 
       } 
      } 
     }); 
     return false; 
    }); 

    $('#edit_form').submit(function() { 
     $.ajax({ 
      url: "editar.php", 
      type: "POST", 
      data: $(this).serialize(), 
      dataType: "json", 
      success: function (data) { 
       if (data.response) { 
        var $modal = $('#inserir_modal'); 
        $("#editar_modal").modal('hide'); 
        $modal.find(".modal-body").html(data.message); 
        $modal.modal('show'); 
        update_list(); 
       } else { 
        alert(data.message); 
       } 
      } 
     }); 
     return false; 
    }); 

</script> 

edit.php

<?php 
require('conexao.php'); 

    $id = $_POST['id']; 
    $pais = $_POST['pais']; 
    $nome = $_POST['nome']; 
    $empresa = $_POST['empresa']; 

    $query = "UPDATE tb_visitas SET nome = '$nome', empresa = '$empresa', pais= '$pais' WHERE id = $id "; 
    $update = mysql_query($query); 

     if ($update) { 
      $res['response'] = true; 
      $res['message'] = "Registro atualizado com sucesso!"; 
     } else { 
      $res['response'] = false; 
      $res['message'] = "Erro: " . $query . "<br>" . mysql_error(); 
     } 

    echo json_encode($res); 

    ?> 

get_list.php

<?php 

require('conexao.php'); 

    $sql = "SELECT id, pais, nome, empresa FROM tb_visitas"; 

    $table = mysql_query($sql) or die(mysql_error()); 

    if (mysql_num_rows($table) > 0) { 
     $res['response'] = true; 
     while($row = mysql_fetch_assoc($table)) { 
      $res['results'][] = $row; 
     } 
    } else { 
     $res['response'] = false; 
     $res['message'] = "Erro: " . $sql . "<br>" . mysql_error($con); 
    } 

    echo json_encode($res); 

    ?> 

deletar.php

<?php 

require('conexao.php'); 

$id = $_POST['id']; 

$query = "DELETE FROM tb_visitas WHERE id = $id "; 

if (mysql_query($query)) { 
    $res['response'] = true; 
    $res['message'] = "Registro deletado com sucesso!"; 
} else { 
    $res['response'] = false; 
    $res['message'] = "Erro: " . $query . "<br>" . mysql_error($con); 
} 

echo json_encode($res); 

?> 

conexao.php

<?php 

error_reporting(E_ALL^E_DEPRECATED); 

$hostname = 'localhost'; 
$username = 'root'; 
$senha = ''; 
$banco = 'visitas'; 

$db = mysql_connect($hostname, $username, $senha); 
mysql_set_charset('latin1',$db); 
mysql_select_db($banco, $db) or die ("Não foi possível conectar ao banco MySQL"); 

?> 

所以,現在我想提出一個複選框中的每個項目爲能夠選擇幾個記錄,並同時將它們刪除。另一個問題,當我編輯一個記錄,如果我把一個文本的字段填充,但如果我把一個選擇它不起作用。這個想法是選擇字段有國家的所有選項,並讓該項目從記錄中選擇。我希望你明白我需要什麼。謝謝。

+0

最好在同一時間提出一個客觀的問題......說明什麼是工作,並顯示你卡在哪裏 –

+0

其實整個代碼工作,我想ju用這些問題來改善它。 Thks – Neto

+1

我們瞭解您的需求。現在是時候瞭解[要問什麼](http://stackoverflow.com/help/on-topic)和[不要問什麼](http://stackoverflow.com/help/dont-ask)在StackOverflow中,以及如何繼續[參觀](http://stackoverflow.com/tour)。祝你好運! –

回答

0

據我瞭解,你有兩個問題:

  1. 如何把複選框您的CRUD清單,以便在一次刪除所有項目。

    看來您正在使用update_list()來加載您的表上的所有項目。既然如此,你需要在該行中添加一個額外的<td>到複選框元素。

     data.results.forEach(function (i) { 
          $("#list").find("tbody").append(
           "<tr>" + 
           "<td><input class='item_checkbox' type='checkbox'/></td>" + 
           "<td>" + i.pais + "</td>" + 
           "<td>" + i.nome + "</td>" + 
           "<td>" + i.empresa + "</td>" + 
           "<td align='center'><a class='btn btn-primary glyphicon glyphicon-pencil' title='Editar' id='edit_link' href='" + JSON.stringify(i) + "'></a> | <a class='btn btn-danger glyphicon glyphicon-trash' title='Deletar' id='delete_link' href='" + JSON.stringify(i) + "'></a></td>" + 
           "</tr>" 
          ); 
         }); 
    

    一旦你的設置,你就可以使用jquery通過.item_checkbox類,收集所有的複選框,然後運行刪除功能。

  2. 如何確保在選擇國家字段是預先選定的,當你編輯項目

    由於您使用的引導模態,當你編輯項目,該模式會彈出顯示出的信息。你需要做的就是發送該項目的國家ID,以情態的形式,使得它可以被預選,所以做了以下變化:

    首先在#editar_modal

    <div class="form-group"> 
        <label class="control-label">País:</label> 
        <select id="pais_input" name="pais"> 
        <?php foreach ($array_pais as $pais) { ?> 
         <option value="<?php echo $pais ?>"><?php echo $pais ?></option> 
        <?php } ?> 
    </div> 
    

    然後在'#edit_link', 'click', function (e)加:

    $modal.find("#pais_input").val(info.pais); 
    
+0

嗨...選擇完美工作。並刪除我已經嘗試了一些這樣的:'$(本)。點擊(函數(){ \t \t VAR ID = $( 'item_checkbox:複選框:選中')地圖(函數(){ \t \t \t return this.id; \t \t})。get(); \t \t alert(id); \t}); ''我已經把它''​​」+'它創建一個數組,但我沒有得到用ajax發送並刪除記錄。該死的。 – Neto

+0

可以幫助我嗎? Thk – Neto

+0

謝謝你,你能弄清楚嗎? – CodeGodie