Question

这是我需要转换为“JSON”格式的代码.. 我想将数据发送到JSON格式并接收并在表格中显示... 任何人都可以帮我改变它的方式我认为..更好的代码是 index.php

  <html>  
  <head>  
       <title>Register</title>  
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>  
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
  </head>  
  <body>  
       <div class="container">  
            <br />  
            <br />  
            <br />  
            <div class="table-responsive">  
                 <h3 align="center">Live Table Add Edit Delete </h3><br />  
                 <div id="live_data"></div>                 
            </div>  
       </div>  
  </body>  
 </html>  
 <script>  
 $(document).ready(function(){  
  function fetch_data()  
  {  
       $.ajax({  
            url:"select.php",  
            method:"POST",  
            success:function(data){  
                 $('#live_data').html(data);  
            }  
       });  
  }  
  fetch_data();  
  $(document).on('click', '#btn_add', function(){  
       var name = $('#name').text();  
       var lastname = $('#lastname').text();  
       var email = $('#email').text();  
       var duser = $('#duser').text();  
       var mob = $('#mob').text();  
       var pass= $('#pass').text();  
       var website = $('#website').text();  

       if(name == '' || lastname == ''|| email == ''|| duser == ''|| mob == ''|| pass == ''|| website == '')  
       {  
            alert("Enter the Blank field");  
            return false;  
       }  

  //--------------------------------------------------------------------------------------------------------           
        $.ajax({  
            url:"insert.php",  
            method:"POST",  
            data:{name:name, lastname:lastname,email:email, duser:duser,mob:mob, pass:pass,website:website},  
            dataType:"text",  
            success:function(data)  
            {  
                 alert(data);  
                 fetch_data();  
            }  
       })  
  });   

     //---------------------------------------------------------------------------------------------------------      
  function edit_data(id, text, column_name)  
  {  
       $.ajax({  
            url:"edit.php",  
            method:"POST",  
            data:{id:id, text:text, column_name:column_name},  
            dataType:"text",  
            success:function(data){  
                 alert(data);  
            }  
       });  
  }  
  $(document).on('blur', '.name', function(){  
       var id = $(this).data("id1");  
       var name = $(this).text();  
       edit_data(id, name, "name");  
  });  
  $(document).on('blur', '.lastname', function(){  
       var id = $(this).data("id2");  
       var lastname = $(this).text();  
       edit_data(id,lastname, "lastname");  
  });
 $(document).on('blur', '.email', function(){  
       var id = $(this).data("id3");  
       var email = $(this).text();  
       edit_data(id, email, "email");  
  });  
  $(document).on('blur', '.duser', function(){  
       var id = $(this).data("id4");  
       var duser = $(this).text();  
       edit_data(id,duser, "duser");  
  });  


  $(document).on('blur', '.mob', function(){  
       var id = $(this).data("id5");  
       var mob = $(this).text();  
       edit_data(id, mob, "mob");  
  });  
  $(document).on('blur', '.pass', function(){  
       var id = $(this).data("id6");  
       var pass = $(this).text();  
       edit_data(id,pass, "pass");  
  }); 
  $(document).on('blur', '.website', function(){  
       var id = $(this).data("id7");  
       var website = $(this).text();  
       edit_data(id,website, "website");  
  });  

    //--------------------------------------------------------------------------------------------------------  
  $(document).on('click', '.btn_delete', function(){  
       var id=$(this).data("id8");  
       if(confirm("Are you sure you want to delete this?"))  
       {  
            $.ajax({  
                 url:"delete.php",  
                 method:"POST",  
                 data:{id:id},  
                 dataType:"text",  
                 success:function(data){  
                      alert(data);  
                      fetch_data();  
                 }  
            });  
       }  
     });  
     });  
     </script>

select.php

   <?php  
 $connect = mysqli_connect("localhost", "root", "", "cellar");  
 $output = '';  
 $sql = "SELECT * FROM user";  
 $result = mysqli_query($connect, $sql);

  $output .= '  
  <div >  
       <table class="table  table-bordered">  
            <tr>  
                 <th width="5%">ID</th>  
                 <th width="10%">name</th>  
                 <th width="10%">lastname</th>  
                 <th width="10%">email</th>  
                 <th width="10%">duser</th>  
                 <th width="10%">mob</th>  
                 <th width="10%">pass</th>  
                 <th width="10%">website</th>  
                 <th width="5%">Delete</th>  
            </tr>';  
  if(mysqli_num_rows($result) > 0)  
   {  
  while($row = mysqli_fetch_array($result))  
  {  
       $output .= '  
            <tr>  
                 <td>'.$row["id"].'</td>  
                 <td class="name" data-id1="'.$row["id"].'" contenteditable>'.$row["name"].'</td>  
                 <td class="lastname" data-id2="'.$row["id"].'" contenteditable>'.$row["lastname"].'</td>  
                 <td class="email" data-id3="'.$row["id"].'" contenteditable>'.$row["email"].'</td>  
                 <td class="duser" data-id4="'.$row["id"].'" contenteditable>'.$row["duser"].'</td>  
                 <td class="mob" data-id5="'.$row["id"].'" contenteditable>'.$row["mob"].'</td>  
                 <td class="pass" data-id6="'.$row["id"].'" contenteditable>'.$row["pass"].'</td>  
                 <td class="website" data-id7="'.$row["id"].'" contenteditable>'.$row["website"].'</td>                
                 <td><button type="button" name="delete_btn" data-id8="'.$row["id"].'" class="btn btn-xs btn-danger btn_delete">x</button></td>  
            </tr>  
       ';  
  }  
  $output .= '  
       <tr>  
            <td></td>  
            <td id="name" contenteditable></td>  
            <td id="lastname" contenteditable></td>  
            <td id="email" contenteditable></td>  
            <td id="duser" contenteditable></td>  
            <td id="mob" contenteditable></td>  
            <td id="pass" contenteditable></td>  
            <td id="website" contenteditable></td>              
            <td><button type="button" name="btn_add" id="btn_add" class="btn btn-xs btn-success" >+</button></td>  
       </tr>  
  ';  
 }  
 else  
 {  
  $output .= '<tr>  
                      <td colspan="4">Data not Found</td>  
                 </tr>';  
     }  
    $output .= '</table>  
     </div>';  
 echo $output;  
   ?>

insert.php

 <?php  
 $connect = mysqli_connect("localhost", "root", "", "cellar");  
  $sql = "INSERT INTO user(name, lastname,email,duser,mob,pass,website)    VALUES('".$_POST["name"]."','".$_POST["lastname"]."','".$_POST["email"]."','".$_POST["duser"]."','".$_POST["mob"]."','".$_POST["pass"]."', '".$_POST["website"]."')";  
  if(mysqli_query($connect, $sql))  
 {  
  echo 'Data Inserted';  
 }  
  ?>

edit.php

<?php  
  $connect = mysqli_connect("localhost", "root", "", "cellar");  
  $id = $_POST["id"];  
  $text = $_POST["text"];  
   $column_name = $_POST["column_name"];  
   $sql = "UPDATE user SET ".$column_name."='".$text."' WHERE id='".$id."'";  
  if(mysqli_query($connect, $sql))  
 {  
  echo 'Data Updated';  
 }  
 ?>

delete.php

  <?php  
  $connect = mysqli_connect("localhost", "root", "", "cellar");  
  $sql = "DELETE FROM user WHERE id = '".$_POST["id"]."'";  
  if(mysqli_query($connect, $sql))  
  {  
  echo 'Data Deleted';  
 }  
  ?>

此代码完全有助于那些想要使用Ajax实时添加，编辑，删除表值的人，php中的jquery

Answer 1

你的select.php中的

必须用json_encode（）

转换你的数组

在$ .ajax中，你必须说它是json格式并解析json结果才能使用该列..

$.ajax({  
        url:"select.php",  
        method:"POST", 
        dataType: "json",
        success: function(results) {
            $.each(results, function(k, v){
                        $('#start_date').val(v.start_date);
           });
        } 
   });

您的select.php必须如下所示：

<?php
header('Content-Type: text/html; charset=UTF-8'); 
$connect = mysqli_connect("localhost", "root", "", "cellar");  
$output = '';  
$sql = "SELECT * FROM user";  
$result = mysqli_query($connect, $sql);

$return_array = array();   
if(mysqli_num_rows($result) > 0)  {  
  while($row = mysqli_fetch_array($result)) {
       $output['id']    = $row["id"];
       $output['name']  = $row["name"]; 
       $output['lastname'] = $row["lastname"];  
       $output['email'] = $row["email"];  
       $output['duser'] = $row["duser"];  
       $output['mob'] = $row["mob"];  
       $output['pass'] = $row["pass"];  
       $output['website'] = $row["website"];   

       array_push($return_arr,$output);            
  } 
}
echo json_encode($return_arr, JSON_UNESCAPED_UNICODE);
?>

在你的jquery中，你将拥有一个数组，你可以将值放在表中。

如何以JSON格式更改此代码

1 个答案: