Php Mysql Ajax插入多行

-1

我使用了一个javascript ajax动态html表单，可以添加删除输入字段系列。和我用php插入数据，但是当我想插入多行/数据它插入数据库只有第一行意味着第一个输入字段系列。Php Mysql Ajax插入多行

，请检查什么问题，我的代码

这里是我的html代码：

<form action="invoice.php" id="invoice-form" method="post" class="invoice-form" role="form" novalidate> 
     <div class='row'> 
      <div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'> 
       <h1 class="text-center title">AFOJAL MINI MARKAET</h1> 
      </div> 
     </div> 
     <h2>From,</h2> 
     <div class='row'> 
      <div class='col-xs-12 col-sm-4 col-md-4 col-lg-4'> 
       <div class="form-group"> 
        <input type="email" class="form-control" id="companyName" placeholder="Company Name"> 
       </div> 
       <div class="form-group"> 
        <textarea class="form-control" rows='3' id="companyAddress" placeholder="Your Address"></textarea> 
       </div> 
      </div> 
      <div class='col-xs-12 col-sm-offset-3 col-md-offset-3 col-lg-offset-3 col-sm-4 col-md-4 col-lg-4'> 

      </div> 
     </div> 
     <h2>To,</h2> 
     <div class='row'> 
      <div class='col-xs-12 col-sm-4 col-md-4 col-lg-4'> 

      <input data-loading-text="Saving Invoice..." type="submit" name="invoice_btn" value="Save Invoice" class="btn btn-success submit_btn invoice-save-top form-control"/> 
       <div class="form-group"> 
        <input type="email" class="form-control" id="clientCompanyName" placeholder="Company Name"> 
       </div> 
       <div class="form-group"> 
        <textarea class="form-control" rows='3' id="clientAddress" placeholder="Your Address"></textarea> 
       </div> 

      </div> 
      <div class='col-xs-12 col-sm-offset-3 col-md-offset-3 col-lg-offset-3 col-sm-4 col-md-4 col-lg-4'> 
       <div class="form-group"> 
        <input type="number" class="form-control" id="invoiceNo" placeholder="Invoice No"> 
       </div> 
       <div class="form-group"> 
        <input type="date" class="form-control" id="invoiceDate" placeholder="Invoice Date"> 
       </div> 
       <div class="form-group"> 
        <input type="number" class="form-control amountDue" id="amountDueTop" placeholder="Amount Due"> 
       </div> 
      </div> 
     </div> 
     <h2>&nbsp;</h2> 
     <div class='text-center'> 
      <span>Note: Sample Item No. to Search <b>S1, S2</b></span> 
     </div> 
     <div class='row'> 
      <div class='col-xs-12 col-sm-12 col-md-12 col-lg-12'> 
       <table class="table table-bordered table-hover"> 
        <thead> 
         <tr> 
          <th width="2%"><input id="check_all" class="formcontrol" type="checkbox"/></th> 
            <th width="15%">Product</th> 
            <th width="38%">Description</th> 
            <th width="15%">Price</th> 
            <th width="15%">Quantity</th> 
            <th width="15%">Total</th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <td><input class="case" type="checkbox"/></td> 
             <td><input type="text" data-type="productCode" name="data[Invoice][pro][]" id="ipro_1" class="form-control autocomplete_txt" autocomplete="off"></td> 
             <td><input type="text" data-type="productName" name="data[Invoice][des][]" id="ides_1" class="form-control autocomplete_txt" autocomplete="off"></td> 
             <td><input type="number" name="data[Invoice][price][]" id="price_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td> 
             <td><input type="number" name="data[Invoice][qty][]" id="quantity_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td> 
             <td><input type="number" name="data[Invoice][sub_total][]" id="total_1" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td> 
            </tr> 
        </tbody> 
       </table> 
      </div> 
     </div> 
     <div class='row'> 
      <div class='col-xs-12 col-sm-3 col-md-3 col-lg-3'> 
       <button class="btn btn-danger delete" type="button">- Delete</button> 
       <button class="btn btn-success addmore" type="button">+ Add More</button> 
      </div> 
      <div class='col-xs-12 col-sm-offset-4 col-md-offset-4 col-lg-offset-4 col-sm-5 col-md-5 col-lg-5'> 
       <form class="form-inline"> 
        <div class="form-group"> 
         <label>Subtotal: &nbsp;</label> 
         <div class="input-group"> 
          <div class="input-group-addon">$</div> 
          <input type="number" class="form-control" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label>Tax: &nbsp;</label> 
         <div class="input-group"> 
          <div class="input-group-addon">$</div> 
          <input type="number" class="form-control" id="tax" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label>Tax Amount: &nbsp;</label> 
         <div class="input-group"> 
          <input type="number" class="form-control" id="taxAmount" placeholder="Tax" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
          <div class="input-group-addon">%</div> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label>Total: &nbsp;</label> 
         <div class="input-group"> 
          <div class="input-group-addon">$</div> 
          <input type="number" class="form-control" id="totalAftertax" placeholder="Total" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label>Amount Paid: &nbsp;</label> 
         <div class="input-group"> 
          <div class="input-group-addon">$</div> 
          <input type="number" class="form-control" id="amountPaid" placeholder="Amount Paid" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label>Amount Due: &nbsp;</label> 
         <div class="input-group"> 
          <div class="input-group-addon">$</div> 
          <input type="number" class="form-control amountDue" id="amountDue" placeholder="Amount Due" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"> 
         </div> 
        </div> 
       </form>

这里是我的Ajax代码：

var i=$('table tr').length; 
$(".addmore").on('click',function(){ 
    html = '<tr>'; 
    html += '<td><input class="case" type="checkbox"/></td>'; 
    html += '<td><input type="text" data-type="productCode" name="pro[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
    html += '<td><input type="text" data-type="productName" name="des[]" id="itemName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
    html += '<td><input type="text" name="price[]" id="price_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
    html += '<td><input type="text" name="qty[]" id="quantity_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
    html += '<td><input type="text" name="sub_total[]" id="total_'+i+'" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
    html += '</tr>'; 
    $('table').append(html); 
    i++; 
}); 

//to check all checkboxes 
$(document).on('change','#check_all',function(){ 
    $('input[class=case]:checkbox').prop("checked", $(this).is(':checked')); 
}); 

//deletes the selected table rows 
$(".delete").on('click', function() { 
    $('.case:checkbox:checked').parents("tr").remove(); 
    $('#check_all').prop("checked", false); 
    calculateTotal(); 
}); 


var prices = ["S24_4620|1961 Chevrolet Impala|32.33"]; 

//autocomplete script 
$(document).on('focus','.autocomplete_txt',function(){ 
    type = $(this).data('type'); 

    if(type =='productCode')autoTypeNo=0; 
    if(type =='productName')autoTypeNo=1; 

    $(this).autocomplete({ 
     source: function(request, response) { 
      var array = $.map(prices, function (item) { 
       var code = item.split("|"); 
       return { 
        label: code[autoTypeNo], 
        value: code[autoTypeNo], 
        data : item 
       } 
      }); 
      //call the filter here 
      response($.ui.autocomplete.filter(array, request.term)); 
     }, 
     autoFocus: true,    
     minLength: 2, 
     select: function(event, ui) { 
      var names = ui.item.data.split("|");       
      id_arr = $(this).attr('id'); 
      id = id_arr.split("_"); 
      $('#itemNo_'+id[1]).val(names[0]); 
      $('#itemName_'+id[1]).val(names[1]); 
      $('#quantity_'+id[1]).val(1); 
      $('#price_'+id[1]).val(names[2]); 
      $('#total_'+id[1]).val(1*names[2]); 
      calculateTotal(); 
     }    
    }); 
}); 

//price change 
$(document).on('change keyup blur','.changesNo',function(){ 
    id_arr = $(this).attr('id'); 
    id = id_arr.split("_"); 
    qty = $('#quantity_'+id[1]).val(); 
    price = $('#price_'+id[1]).val(); 
    if(qty!='' && price !='') $('#total_'+id[1]).val((parseFloat(price)*parseFloat(qty)).toFixed(2)); 
    calculateTotal(); 
}); 

$(document).on('change keyup blur','#tax',function(){ 
    calculateTotal(); 
}); 

//total price calculation 
function calculateTotal(){ 
    subTotal = 0 ; sub_total = 0; 
    $('.totalLinePrice').each(function(){ 
     if($(this).val() != '')subTotal += parseFloat($(this).val()); 
    }); 
    $('#subTotal').val(subTotal.toFixed(2)); 
    tax = $('#tax').val(); 
    if(tax != '' && typeof(tax) != "undefined"){ 
     taxAmount = subTotal * (parseFloat(tax) /100); 
     $('#taxAmount').val(taxAmount.toFixed(2)); 
     sub_total = subTotal + taxAmount; 
    }else{ 
     $('#taxAmount').val(0); 
     sub_total = subTotal; 
    } 
    $('#totalAftertax').val(sub_total.toFixed(2)); 
    calculateAmountDue(); 
} 

$(document).on('change keyup blur','#amountPaid',function(){ 
    calculateAmountDue(); 
}); 

//due amount calculation 
function calculateAmountDue(){ 
    amountPaid = $('#amountPaid').val(); 
    sub_total = $('#totalAftertax').val(); 
    if(amountPaid != '' && typeof(amountPaid) != "undefined"){ 
     amountDue = parseFloat(sub_total) - parseFloat(amountPaid); 
     $('.amountDue').val(amountDue.toFixed(2)); 
    }else{ 
     sub_total = parseFloat(sub_total).toFixed(2); 
     $('.amountDue').val(sub_total); 
    } 
} 


//It restrict the non-numbers 
var specialKeys = new Array(); 
specialKeys.push(8,46); //Backspace 
function IsNumeric(e) { 
    var keyCode = e.which ? e.which : e.keyCode; 
    console.log(keyCode); 
    var ret = ((keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1); 
    return ret; 
} 

//datepicker 
$(function() { 
    $.fn.datepicker.defaults.format = "dd-mm-yyyy"; 
    $('#invoiceDate').datepicker({ 
     startDate: '-3d', 
     autoclose: true, 
     clearBtn: true, 
     todayHighlight: true 
    }); 
});

这里是我的php代码：

<?php 

$connect = mysqli_connect("localhost", "root", "", "inv"); 
if(isset($_POST["data"])) 
{ 
$item_name = $_POST["pro"]; 
$item_code = $_POST["des"]; 
$item_des = $_POST["qty"]; 
$item_price = $_POST["price"]; 
$subtotal = $_POST["sub_total"]; 
$query = ''; 
for($count = 0; $count<count($item_name); $count++) 
{ 
    $item_name_clean = mysqli_real_escape_string($connect, $item_name[$count]); 
    $item_code_clean = mysqli_real_escape_string($connect, $item_code[$count]); 
    $item_des_clean = mysqli_real_escape_string($connect, $item_des[$count]); 
    $item_price_clean = mysqli_real_escape_string($connect, $item_price[$count]); 
    $subtotal_clean = mysqli_real_escape_string($connect, $subtotal[$count]); 
    if($item_name_clean != '' && $item_code_clean != '' && $item_des_clean != '' && $item_price_clean != '') 
    { 
    $query .= ' 
    INSERT INTO sell(pro, des, qty, price, sub_total) 
    VALUES("'.$item_name_clean.'", "'.$item_code_clean.'", "'.$item_des_clean.'", "'.$item_price_clean.'", "'.$subtotal_clean.'"); 
    '; 
    } 
} 
if($query != '') 
{ 
    if(mysqli_multi_query($connect, $query)) 
    { 
    echo 'Item Data Inserted'; 
    } 
    else 
    { 
    echo 'Error'; 
    } 
} 

else 
{ 
    echo 'All Fields are Required'; 
} 
} 
?>

来源

2017-07-30 Md.muzahidul islam tanveer

究竟是什么错误/问题？ – garfbradaz

PHP只插入第一行，当我添加另一个输入字段在HTML表单与jQuery和AJAX。我需要插入多行。 –

执行'var_dump（$ _ POST）'并检查它是否包含您所期望的。你也可以像这样插入多行（而不是多查询）：INSERT INTO table（col1，col2）VALUES（'first1'，'first2'），（'second1'，'second2'）'。但是，您应该真正使用[Prepared Statements]（准备好的语句）（http://php.net/manual/en/mysqli.quickstart.prepared-statements.php），而不是连接您的查询。甚至没有'mysqli_real_escape_string（）'是100％SQl注入证明。 –

AJAX

html += '<td><input type="text" data-type="productCode" name="pro[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
html += '<td><input type="text" data-type="productName" name="des[]" id="itemName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';

PHP

$item_name = $_POST["pro"]; 
$item_code = $_POST["des"];

* 在PHP这些分配出现反转，在阿贾克斯产品代码将被命名为 '亲'。尝试在PHP替换此：

$item_name = $_POST["des"]; 
$item_code = $_POST["pro"];

来源

2017-07-30 14:56:06

只是我换成了php，但仍然插入单排 –

你不使用相同的名称追加新行时属性值。然后让关键发票成为一个数组（请参阅第二和第三个代码段），因为您需要在PHP中循环（请参阅第4段）。

html += '<td><input class="case" type="checkbox"/></td>'; 
html += '<td><input type="text" data-type="productCode" name="pro[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
html += '<td><input type="text" data-type="productName" name="des[]" id="itemName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
html += '<td><input type="text" name="price[]" id="price_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
html += '<td><input type="text" name="qty[]" id="quantity_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
html += '<td><input type="text" name="sub_total[]" id="total_'+i+'" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>';

与

<td><input type="text" data-type="productCode" name="data[Invoice][][pro]" id="ipro_1" class="form-control autocomplete_txt" autocomplete="off"></td> 
<td><input type="text" data-type="productName" name="data[Invoice][][des]" id="ides_1" class="form-control autocomplete_txt" autocomplete="off"></td> 
<td><input type="number" name="data[Invoice][][price]" id="price_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td> 
<td><input type="number" name="data[Invoice][][qty]" id="quantity_1" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td> 
<td><input type="number" name="data[Invoice][][sub_total]" id="total_1" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>

追加一个新行时，使用相同的属性名称：

html += '<td><input class="case" type="checkbox"/></td>'; 
html += '<td><input type="text" data-type="productCode" name="data[Invoice][][pro]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
html += '<td><input type="text" data-type="productName" name="data[Invoice][][des]" id="itemName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>'; 
html += '<td><input type="text" name="data[Invoice][][price]" id="price_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
html += '<td><input type="text" name="data[Invoice][][qty]" id="quantity_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>'; 
html += '<td><input type="text" name="data[Invoice][][sub_total]" id="total_'+i+'" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>';

顺便说一句，你也可以用克隆的方法追加一个表行的副本。

PHP脚本.. 在你的PHP部分我看到两件事情出错了（除了缺少SQL注入预防）。您应该循环访问数据发票键，因为那些数据携带行数组。然后，你应该添加一个分号到sql查询来关闭语句。

if (isset($_POST["data"])) { 

    foreach($_POST["data"]["Invoice"] as $item) { 

     $item_name = $item["pro"]; 
     $item_code = $item["des"]; 
     $item_des = $item["qty"]; 
     $item_price = $item["price"]; 
     $subtotal = $item["sub_total"]; 
     $query = ''; 

     $item_name_clean = mysqli_real_escape_string($connect, $item_name); 
     $item_code_clean = mysqli_real_escape_string($connect, $item_code); 
     $item_des_clean = mysqli_real_escape_string($connect, $item_des); 
     $item_price_clean = mysqli_real_escape_string($connect, $item_price); 
     $subtotal_clean = mysqli_real_escape_string($connect, $subtotal); 
     if ($item_name_clean != '' && $item_code_clean != '' && $item_des_clean != '' && $item_price_clean != '') { 
      $query .= ' 
    INSERT INTO sell(pro, des, qty, price, sub_total) 
    VALUES("' . $item_name_clean . '", "' . $item_code_clean . '", "' . $item_des_clean . '", "' . $item_price_clean . '", "' . $subtotal_clean . '";); 
    '; 
     } 
    } 

    if ($query != '') { 
     if (mysqli_multi_query($connect, $query)) { 
      echo 'Item Data Inserted'; 
     } else { 
      echo 'Error'; 
     } 
    } 
}

来源

2017-07-30 15:03:18 Yolo

替换，但仍然插入单排 –

请看我更新的答案。你需要改变你的HTML，JavaScript和PHP的工作。 – Yolo

Php Mysql Ajax插入多行

回答

相关问题