使用ajax json將表單數據存儲到數據庫php

我試圖在數據庫中存儲表單數據，但是我的代碼反映了任何內容。這裏是我的代碼使用ajax json將表單數據存儲到數據庫php

add.php

<form name='reg' > 
<fieldset> 
    <legend>Student information:-</legend> 
    <ul> 
     <li> 
      <label> FirstName: </label><input type="text" id="name" name="name" required> 
      <span id='error' style="display:none;color:red;"> Only alphabets </span> 
     </li> 

     <li> 
      <label> LastName: </label><input type="text" id="lname" name="lname" required> 
      <span id='error1' style="display:none;color:red;"> Only alphabets </span> 

     </li> 
     <li> 
      <label>Username:</label> 
      <input type="text" id="username" name="username"/> 
     </li> 
     <li> 
      <label>Password:</label> 
      <input type="password" id="password" name="password"/> 
     </li> 

     <label> 
      Gender: </label> 
     <input type="radio" id='gender' name="gender" value="male" required> Male 
     <input type="radio" name="gender" id='gender' value="female" required> Female 
     <input type="radio" name="gender" id='gender' value="other" required> Other 

     <li> 
      <label> 
       Email: </label> 
      <input id="email" type="text" name="email" required> 
      <span id='error2' style="display:none;color:red;"> Invalid email </span> 
     </li> 
     <li> 
      <label> Mobile:</label> 
      <input id="mobile" type="text" maxlength="10" name="mobile" required > 
      <span id='error3' style="display:none;color:red;"> only digits </span> 
     </li> 
     <li> 
      address: <textarea name="address" id="address" type="text" rows="3" cols="40"></textarea></textarea> 

     </li> 

    </ul> 
    <p><a href="" class="btn btn-info" id="btnBooking">Register</a></p> 
</fieldset> 
</form>

和JavaScript文件是

serve.js

$(document).ready(function() { 
    $("#btnBooking").on("click", function (e) { 

     // as you have used hyperlink(a tag), this prevent to redirect to another/same page 
     e.preventDefault(); 

     // get values from textboxs 
     var name = $('#name').val(); 
     // alert('name'); 
     var lname = $('#lname').val(); 
     var username = $('#username').val(); 
     var password = $('#password').val(); 
     var gender = $('#gender').val(); 
     var mail = $('#email').val(); 
     var mobNum = $('#mobile').val(); 
     var address = $('#address').val(); 

     $.ajax({ 
      url: "http://localhost/project_cloud/fun.php", 
      type: "post", 
      dataType: "json", 
      data: {type: "add", Name: name, Lname: lname, User: username, Pass: password, Gen: gender, Email: mail, Mob_Num: mobNum, Addr: address}, 
      //type: should be same in server code, otherwise code will not run 
      ContentType: "application/json", 
      success: function (response) { 
       alert(JSON.stringify(response)); 
      }, 
      error: function (err) { 
       alert(JSON.stringify(err)); 
      } 
     }) 
    }); 
});

和存儲結果另一個PHP文件在數據庫中

fun.php

<?php 
header('Access-Control-Allow-Origin: *'); 
mysql_connect("localhost", "root", ""); 
mysql_select_db("ocean"); 

if (isset($_GET['type'])) { 
    $res = []; 

    if ($_GET['type'] == "add") { 
     $name = $_GET ['Name']; 
     $lname = $_GET['Lname']; 
     $userN = $_GET['User']; 
     $passW = $_GET['Pass']; 
     $gen = $_GET['Gen']; 
     $mail = $_GET ['Email']; 
     $mobile = $_GET ['Mob_Num']; 
     $address = $_GET['Addr']; 
     $query1 = "insert into oops(username, password, firstname, lastname, gender, email, mobile, address) values('$userN','$passW','$name','$lname','$gen','$mail','$mobile','$address')"; 
     $result1 = mysql_query($query1); 

     if ($result1) { 
      $res["flag"] = true; 
      $res["message"] = "Data Inserted Successfully"; 
     } else { 
      $res["flag"] = false; 
      $res["message"] = "Oppes Errors"; 
     } 
    } 
} else { 
    $res["flag"] = false; 
    $res["message"] = "Invalid format"; 
} 

echo json_encode($res, $result1); 
?>

當我寫在add.php文件我serve.js文件代碼它給我造成存儲在數據庫中。但是，當我試圖分開它的JS文件就說明什麼。它有什麼不對或者我錯過了什麼。

來源

2016-07-16 oceanier

在您的Ajax請求您發佈的數據，但在你的PHP文件（fun.php）嘗試檢索數據GET（$ _GET）。 –

你有

type:"post",

在您的AJAX請求，但服務器端處理$ _GET參數：

$lname = $_GET['Lname'];

變化$_GET到$_POST，你會看到你的價值觀。

但是你所有的代碼都很糟糕。你不能在互聯網上發佈這個。你有糟糕的JavaScript和許多服務器端的問題，包括MySQL注入。需要改寫這一切與預處理語句和JS來：

$(function() { 
    $("#btnBooking").on("click", function(e){ 
     e.preventDefault(); 
     var data = $(this).parents('form').serializeArray(); 
     data.type = 'add' 
     $.post('/project_cloud/fun.php',data) 
     .done(function(response){ 
      alert(JSON.stringify(response)); 
     }) 
     .fail(function(err){ 
      alert(JSON.stringify(err)); 
     }) 
    }); 
})

來源

2016-07-16 07:56:19 BaBL86

使用ajax json將表單數據存儲到數據庫php

回答

相關問題