获取表单以读取数据并在提交时保存到数据库

时间：2017-01-06 18:29:11

标签： javascript php ajax database forms

我有一个包含多个输入字段的表单。使用AJAX，我希望在提交时将输入保存到数据库中。有三个不同的表需要插入信息，每个表都会在我的insert.php代码中看到一些输入。我有很多代码，并且不确定我需要添加什么才能获取输入的信息，并在提交时保存到数据库中。

需要添加/更改哪些内容，以便在我单击提交时，数据将保存到我的数据库中的相关表中？

HTML / PHP：

<body>

<form name="form1" action="confirmation.php" method="POST" onSubmit="return validate();">

<!-- Vendor -->

<section class="desc-block-left0">
<div>
<div id="vendor">
<strong>Vendor:</strong>
</div> 

<div class="align">
<select name="vendor_dropdown" id="ven" onChange="updateinput();">
    <option value="">Choose a Vendor</option>
        <?php foreach($users->fetchAll() as $user): ?>
            <option
                    data-name="<?php echo $user['MR_POC_N'];?>"
                    data-email="<?php echo $user['MR_POC_E'];?>"
                    data-phone="<?php echo $user['MR_POC_P'];?>"
            >
                <?php echo $user['MR_Name'];?>
            </option>
        <?php endforeach; ?>
</select>
</div>

</div>
</section>

<!-- Program Name -->

<section class="desc-block-right0">
<div>
<div id="program_name">
<strong>Program Name:</strong><br>
</div>

<div class="align1">
<input class="textbox" type="text" id="program_name1" name="program_name" style="width: 50%">
</div>

</div>
</section>

<!-- Program Period -->

<section class="desc-block-left1">
<div>
<div id="program_period">
<strong>Program Period:</strong>
</div>

<div class="align">
<input type="text" name="program_period_dropdown" id="period" value="<?php echo date("Y");?>" readonly style="width: 50px">
</div>

</div>
</section>

<!-- Terms -->

<section class="desc-block-right1">
<div>
<div id="terms">
<strong>Terms:</strong><br>
</div>

<div class="align1">
<input type="text" id="year" name="term" style="width: 50px">
<label for="percent">%</label>
<input type="text" id="year" name="term1" style="width: 50px">
<label for="percent">Net</label>
<input type="text" id="year" name="term2" style="width: 50px">
</div>

</div>
</section>

<!-- Vendor Type -->

<section class="desc-block-left2">
<div>
<div id="vendor_type">
<strong>Vendor Type:</strong><br>
</div>

<div class="align">
<table align="left">
    <tr align="center">
        <td><input type="radio" name="ven_type" value="Coded" id="type" checked="true"></td>
        <td align="left">Coded</td>
    </tr>
    <tr align="center">
        <td><input type="radio" name="ven_type" value="Non-Coded" id="type"></td>
        <td>Non-Coded</td>
    </tr>
</table>
</div>

</div>
</section>

<!-- Contact Information -->

<section class="desc-block-right2" align="center">
<div>
<div id="contact_info">
<strong>Contact Information:</strong><br>
</div>

<div class="align1">
<table align="left" id="contact">
    <tr>
        <td align="left">Name:</td>
        <td><input type="text" id="name" class="name" name="name" style="margin-left: 5px"></td>
        <td><input type="button" class="edit" name="edit" value="Edit"></td>
    </tr>
    <tr>
        <td align="left">Email:</td>
        <td><input type="email" id="email" class="email" name="email" style="margin-left: 5px"></td>
        <td><input type="button" class="edit" name="edit" value="Edit"></td>
    </tr>
    <tr>
        <td align="left">Phone Number:</td>
        <td><input type="tel" id="tel" class="tel" name="number" style="margin-left: 5px"></td>
        <td><input type="button" class="edit" name="edit" value="Edit"></td>
    </tr>
</table>
</div>

</div>
</section>

<!-- 400 Rebate Tables -->
<!-- 400P -->

<div align="center" id="border">
<div id="rebate_400p">
<strong>400P</strong><br>
</div>

<table id="tables" cellspacing="5">
    <tr align="center" class="table_titles">
        <td>Tier</td>
        <td>Purchase Minimum</td>
        <td>Multiplier</td>
        <td>UOM</td>
        <td>Retro</td>
        <td>Guaranteed</td>
        <td>Paid</td>
        <td>Delete?</td>
        <td>Add Row</td>
    </tr>
    <tr>
            <td align="center" name="tier" id="tier">1</td>
            <td><input type="text" class="rebate_tables" id="purchase_min" data-name="purchase_minimum" name="rows[0][0][purchase_minimum]"></td>
            <td><input type="text" class="rebate_tables" id="multiplier" data-name="multiplier" name="rows[0][0][multiplier]"></td>
            <td><input type="text" class="rebate_tables" id ="uom" data-name="uom" name="rows[0][0][uom]"></td>
            <td><input type="text" class="rebate_tables" id="retro" data-name="retro"  name="rows[0][0][retro]"></td>
            <td><input type="text" class="rebate_tables" id="guaranteed" data-name="guaranteed" name="rows[0][0][guaranteed]"></td>
            <td><input type="text" class="rebate_tables" id="paid" data-name="paid" name="rows[0][0][paid]"></td>
            <td><input type="button" class="delRow" value="Delete" onclick="deleteRow(this)"></td>
            <td><input type="button" class="addmoreRowsbutton" value="Add row" onclick="insRow()"></td>
        </tr>
</table>

<!-- 400M -->
<div id="rebate_400m">
<strong>400M</strong><br>
</div>

<table cellspacing="5" id="tables1" style="display: none;">
    <tr align="center" class="table_titles">
        <td>Tier</td>
        <td>Purchase Minimum</td>
        <td>Multiplier</td>
        <td>UOM</td>
        <td>Retro</td>
        <td>Guaranteed</td>
        <td>Paid</td>
        <td>Delete?</td>
        <td>Add Rows</td>
    </tr>
    <tr>
            <td align="center" name="tier" id="tier1">1</td>
            <td><input type="text" class="rebate_tables" id="purchase_min1" data-name="purchase_minimum" name="rows[1][0][purchase_minimum]"></td>
            <td><input type="text" class="rebate_tables" id="multiplier1" data-name="multiplier" name="rows[1][0][multiplier]"></td>
            <td><input type="text" class="rebate_tables" id ="uom1" data-name="uom" name="rows[1][0][uom]"></td>
            <td><input type="text" class="rebate_tables" id="retro1" data-name="retro"  name="rows[1][0][retro]"></td>
            <td><input type="text" class="rebate_tables" id="guaranteed1" data-name="guaranteed" name="rows[1][0][guaranteed]"></td>
            <td><input type="text" class="rebate_tables" id="paid1" data-name="paid" name="rows[1][0][paid]"></td>
            <td><input type="button" class="delRow" value="Delete" onclick="deleteRow(this)"></td>
            <td><input type="button" class="addmoreRowsbutton" value="Add row" onclick="insRow1()"></td>
        </tr>
</table>
<!-- Button to display table for 400M -->
<input type="button" name="row" value="+" onclick="show2();"/>

<!-- 400D -->

<div id="rebate_400d">
<strong>400D</strong><br>
</div>

<table cellspacing="5" id="tables2" style="display: none;">
    <tr align="center" class="table_titles">
        <td>Tier</td>
        <td>Purchase Minimum</td>
        <td>Multiplier</td>
        <td>UOM</td>
        <td>Retro</td>
        <td>Guaranteed</td>
        <td>Paid</td>
        <td>Delete?</td>
        <td>Add Rows</td>
    </tr>
    <tr>
            <td align="center" name="tier" id="tier2">1</td>
            <td><input type="text" class="rebate_tables" id="purchase_min2" data-name="purchase_minimum" name="rows[2][0][purchase_minimum]"></td>
            <td><input type="text" class="rebate_tables" id="multiplier2" data-name="multiplier" name="rows[2][0][multiplier]"></td>
            <td><input type="text" class="rebate_tables" id ="uom2" data-name="uom" name="rows[2][0][uom]"></td>
            <td><input type="text" class="rebate_tables" id="retro2" data-name="retro"  name="rows[2][0][retro]"></td>
            <td><input type="text" class="rebate_tables" id="guaranteed2" data-name="guaranteed" name="rows[2][0][guaranteed]"></td>
            <td><input type="text" class="rebate_tables" id="paid2" data-name="paid" name="rows[2][0][paid]"></td>
            <td><input type="button" class="delRow" value="Delete" onclick="deleteRow(this)"></td>
            <td><input type="button" class="addmoreRowsbutton" value="Add row" onclick="insRow2()"></td>
        </tr>
</table>
<!-- Button to adisplay table for 400D -->
<input type="button" name="row" value="+" id="plus-button" onclick="show3();"/>
</div>

<!-- Products -->

<div align="center">
<p>
<div id="products">
<strong>Products:</strong><br>
</div>

<input type="radio" name="product" value="All" onclick="hide();"/ checked> All 
<input type="radio" name="product" value="Category" onclick="show();"/> Category 
<input type="radio" name="product" value="Sku" onclick="hide();"/> Sku
    <select multiple id="area" name="category" style="display: none;">
        <option value="Example A" align ="center">Example A</option>
        <option value="Example B" align ="center">Example B</option>
        <option value="Example C" align ="center">Example C</option>
        <option value="Example D" align ="center">Example D</option>
        <option value="Example E" align ="center">Example E</option>
        <option value="Example F" align ="center">Example F</option>
    </select>
</p>

<!-- Submit Button -->

<br>
<input type="submit" value="Submit" id="btn" name="submit" onsubmit="submitInfo()">
</div>

</form>

</body>

JavaScript的：

$( function() {

      var emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/,
      phoneRegex = /^(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:\(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*\)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)?([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})(?:\s*(?:#|x\.?|ext\.?|extension)\s*(\d+))?$/,
      vendor = $( "#ven" ),
      prog_name = $( "#program_name1" ),
      prog_period = $( "#period" ),
      terms = $( "#year" ),
      type = $( "#type" ),
      name = $( "#name" ),
      email = $( "#email" ),
      phone = $( "#tel" ),
      tier = $( "#tier" ),
      purchase = $( "#purchase_min" ),
      multiplier = $( "#multiplier" ),
      uom = $( "#uom" ),
      retro = $( "#retro" ),
      guaranteed = $( "#guarenteed" ),
      paid = $( "#paid" ),
      allFields = $( [] ).add( vendor ).add( prog_name ).add( prog_period ).add( terms ).add( type ).add( name ).add( email ).add( phone ).add( tier ).add( purchase ).add( multiplier ).add( uom ).add( retro ).add( guaranteed ).add( paid );
  console.log(allFields);

    function checkRegexp( o, regexp, n ) {
      if ( !( regexp.test( o.val() ) ) ) {
        o.addClass( "ui-state-error" );
        return false;
      } else {
        return true;
      }
    }

   function submitInfo() {
      var valid = true;
      allFields.removeClass( "ui-state-error" );
// ----- Validation for each input in add row dialog box -----
      valid = valid && checkRegexp( vendor, /^[a-z]([0-9a-z_\s])+$/i, "Please enter a valid vendor name" );
      valid = valid && checkRegexp( prog_name, /^[a-z]([0-9a-z_\s])+$/i, "Please enter a valid program name" );
      valid = valid && checkRegexp( terms, /^(0|[1-9][0-9]*)$/, "Please enter valid terms" );
      valid = valid && checkRegexp( name, /^[a-zA-Z ]*$/, "Please enter a valid name" );
      valid = valid && checkRegexp( email, emailRegex, "Please enter a valid email" );
      valid = valid && checkRegexp( phone, phoneRegex, "Please enter a valid phone number" );
      valid = valid && checkRegexp( purchase, /^(0|[1-9][0-9]*)$/, "Please enter a valid purchase minimum" );
      valid = valid && checkRegexp( multiplier, /^\d*\.?\d*$/, "Please enter a valid multiplier" );
      valid = valid && checkRegexp( uom, /[-!$%^&*()_+|~=`{}\[\]:";'<>?,.\/]/, "Please enter a valid uom" );
      valid = valid && checkRegexp( retro, /^[0]{1}$/, "Please enter a valid entry for retro" );
      valid = valid && checkRegexp( guaranteed, /^[0-1]{1}$/, "Please enter a valid entry for guaranteed" );
      valid = valid && checkRegexp( paid, /^[a-z]([0-9a-z_\s])+$/i, "Please enter a valid entry for paid" );
      console.log(allFields);
      if ( valid ) {
        var dict = {};
        var errors = "";
        $.each(allFields, function(){
          var type = $(this).attr('id');
          var value = $(this).val();
          console.log(type + " : " + value);
          // ----- Switch statement that provides validation for each table cell -----
          switch (type) {
            case "ven":
                dict["MR_Name"] = value;
              break;
            case "program_name1":
                dict["Program_Name"] = value;
              break;
            case "period":
                dict["Program_Year"] = value;
              break;
            case "year":
                dict["Terms"] = value;
                break;
            case "type":
                dict["Coded"] = value;
                break;
            case "name":
                dict["MR_POC_N"] = value;
                break;
            case "email":
                dict["MR_POC_E"] = value;
                break;
            case "tel":
                dict["MR_POC_P"] = value;
                break;
            case "tier":
                dict["Tier"] = value;
              break;
            case "purchase_min":
                dict["Tier Minimum"] = value;
              break;
            case "mulitplier":
                dict["Multiplier"] = value;
                break;
            case "uom":
                dict["UOM"] = value;
                break;
            case "retro":
                dict["Retro"] = value;
                break;
            case "guaranteed":
                dict["Guaranteed"] = value;
                break;
            case "paid":
                dict["Pay"] = value;
                break;
            }
        });
        console.log(dict);

        var request = $.ajax({
          type: "POST",
          url: "insert.php",
          data: dict
        });

      }
      return valid;
    }
});

Insert.php：

<?php

  $MR_Name = $_POST['MR_Name'];
  $Program_Name = $_POST['Program_Name'];
  $Program_Year = $_POST['Program_Year'];
  $Terms = $_POST['Terms'];
  $Coded = $_POST['Coded'];
  $MR_POC_N = $_POST['MR_POC_N'];
  $MR_POC_E = $_POST['MR_POC_E'];
  $MR_POC_P = $_POST['MR_POC_P'];
  $Tier = $_POST['Tier'];
  $Tier_Minimum = $_POST['Tier Minimum'];
  $Multiplier = $_POST['Multiplier'];
  $UOM = $_POST['UOM'];
  $Retro = $_POST['Retro'];
  $Guaranteed = $_POST['Guaranteed'];
  $Pay = $_POST['Pay'];

  $host="xxxxxxxxx"; 
  $dbName="xxxx"; 
  $dbUser="xxxxxxxxxx"; 
  $dbPass="xxxxxxxx";

  $pdo = new PDO("sqlsrv:server=".$host.";Database=".$dbName, $dbUser, $dbPass);

  $sql = "INSERT INTO Stage_Rebate_Master (MR_Name, MR_POC_N, MR_POC_E, MR_POC_P) VALUES (?, ?, ?, ?)";
  $sql1 = "INSERT INTO Stage_Rebate_Programs (Program_Name, Program_Year) VALUES (?, ?)";
  $sql2 = "INSERT INTO Stage_Rebate_Agreements (Terms, Tier, Tier Minimum, Multiplier, UOM, Retro, Guaranteed, Pay) VALUES (?, ?, ?, ?, ?, ?, ?, ?)";

  $stmt = $pdo->prepare($sql);
  $stmt1 = $pdo->prepare($sql1);
  $stmt2 = $pdo->prepare($sql2);
  $result = $stmt->execute(array($MR_Name, $MR_POC_N, $MR_POC_E, $MR_POC_P));
  $result1 = $stmt1->execute(array($Program_Name, $Program_Year));
  $result2 = $stmt2->execute(array($Terms, $Tier, $Tier_Minimum, $Multiplier, $UOM, $Retro, $Guaranteed, $Pay));
  echo json_encode($result);
  echo json_encode($result1);
  echo json_encode($result2);

?>

0 个答案:

没有答案
相关问题
最新问题