2016-02-12 56 views
1

我是新来的ajax有人帮助我我想创建一个包含输入字段的表单。通过ajax获取输入字段的值,然后将其传递给php

enter image description here

每当我按一下按钮,我会得到输入字段的值,并将它宣布它在AJAX数据,并从阿贾克斯将它传递给PHP脚本的价值。它会显示一个表格。

enter image description here

我的问题是如何让输入字段的值,并宣布它为AJAX数据。点击表后将在AJAX脚本中声明成功,该表将显示一个表。

预先感谢您

UPDATE:

@J_D,这是我为我的表单的html代码:

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>"> 
      <table cellpadding="15px"> 
       <tr> 
        <td>Transmittal #</td> 
        <td><input type="text" class="form-control" style="padding-left:5px;" name="transmittal_number_inquiry" id="transmittal_number_inquiry" class="transmittal_number_inquiry" onKeyPress="return isNumberKey(event)" required></td> 
       </tr> 
      </table> 
      <div style="float:right; padding-right:110px; padding-top:10px;"> 
       <a href="#modalTransmittalInquiry" class="btn btn-info" data-toggle="modal" id="btn-inquire-transmittal-number" data-backdrop="false" name="inquire-transmittal-number">Inquire</a> 
       <?php /*?><input type="submit" class="btn btn-info" data-toggle="modal" id="btn-inquire-transmittal-number" name="btn-inquire-transmittal-number" data-backdrop="false" value="Inquire"><?php */?> 
       <?php /*?><button type="submit" class="btn btn-info" data-toggle="modal" id="btn-inquire-transmittal-number" name="btn-inquire-transmittal-number" data-backdrop="false">Inquire</button><?php */?> 
      </div> 
     </form> 

这里是我的AJAX代码:

$(document).ready(function(){ 
    $('.btn-inquire-traensmittal-number').click(function(){ 
    $inputtextval = $('#transmittal_number_inquiry').val(); 
    $.ajax({ 
     type: 'POST', 
     url: getTransmittalNum.php, 
     data: {'transmittal_number_inquiry' : $inputtextval}, 
     success: function(res){ 
     } 
    }); 
    }); 
}); 

这里的getTransmittalNum.php代码

<?php 
    $servername = "localhost"; 
    $username = "root"; 
    $password = ""; 
    $dbname = "etransmittal"; 

    $selectedTransmittal = $_GET['q']; 
    $con = mysqli_connect($servername,$username,$password,$dbname); 

    if(!$con){ 
     die("Connection failed: " . mysqli_connect_error()); 
    } 

    if(isset($_POST['inquire-transmittal-number'])){ 
     $query = "SELECT en.transid, en.transdate, CONCAT(userlist.lname, ', ', userlist.fname, ' ', userlist.mname) AS sender_name, 
        userlist.`department`, en.document_number, doctype.document_type, doctype.document_description, vendor.`vendor_name`, en.`remarks`, 
        en.status_id, stat.status_name, en.total_amount 
        FROM tbl_encode_transmittal en 
        LEFT JOIN tbl_vendor vendor ON vendor.`vendor_id` = en.vendor_id 
        LEFT JOIN tbl_doctype doctype ON doctype.`doc_id` = en.doctype_id 
        LEFT JOIN tbl_userlist userlist ON userlist.userid = en.sender_id 
        LEFT JOIN tbl_userlist userlist1 ON userlist1.userid = en.`receiver_id` 
        LEFT JOIN tbl_status stat ON stat.status_id = en.status_id 
        WHERE en.`transid` = '{$_POST['transmittal_number_inquiry']}'"; 

     $result = mysqli_query($con, $query); 
     $rows = array(); 

     if($result){ 
      while($row = mysqli_fetch_assoc($result)){ 
       $rows[] = $row; 
      } 
     } 
     else{ 
      echo 'MYSQL Error: ' . mysqli_error(); 
     } 

     $json = json_encode($rows); 
     echo $json; 
     mysqli_close($con); 
    } 
?> 
+2

请发表你使用,让您的AJAX调用的代码,并为您的形式 –

+0

什么是你尝试的HTML? –

+0

@NorlihazmeyGhazali,将值传递给PHP,然后显示包含Mysql的提取数据的表。 – pvegetah

回答

0

尝试下面的代码:

$(document).ready(function(){ 
    $('#btn-inquire-transmittal-number').click(function(){ 
    $inputtextval = $('#transmittal_number_inquiry').val(); 
    $.ajax({ 
     type: 'POST', 
     url: 'getTransmittalNum.php', // wrap code with quote 
     data: {'transmittal_number_inquiry' : $inputtextval}, 
     dataType : 'json', // expecting result type json 
     success: function(res){ 
     // once you got result, 
     // populate table here 
     } 
    }); 
    }); 
}); 

PHP

<?php 
$servername = "localhost"; 
$username = "root"; 
$password = ""; 
$dbname = "etransmittal"; 

//$selectedTransmittal = $_GET['q']; //<---- u need this????? 
$con = mysqli_connect($servername,$username,$password,$dbname); 

if(!$con){ 
    die("Connection failed: " . mysqli_connect_error()); 
} 

if(isset($_POST['transmittal_number_inquiry'])){ // <-- check for existence 
    $query = "SELECT en.transid, en.transdate, CONCAT(userlist.lname, ', ', userlist.fname, ' ', userlist.mname) AS sender_name, 
       userlist.`department`, en.document_number, doctype.document_type, doctype.document_description, vendor.`vendor_name`, en.`remarks`, 
       en.status_id, stat.status_name, en.total_amount 
       FROM tbl_encode_transmittal en 
       LEFT JOIN tbl_vendor vendor ON vendor.`vendor_id` = en.vendor_id 
       LEFT JOIN tbl_doctype doctype ON doctype.`doc_id` = en.doctype_id 
       LEFT JOIN tbl_userlist userlist ON userlist.userid = en.sender_id 
       LEFT JOIN tbl_userlist userlist1 ON userlist1.userid = en.`receiver_id` 
       LEFT JOIN tbl_status stat ON stat.status_id = en.status_id 
       WHERE en.`transid` = '{$_POST['transmittal_number_inquiry']}'"; 

    $result = mysqli_query($con, $query); 
    $rows = array(); 

    if($result){ 
     while($row = mysqli_fetch_assoc($result)){ 
      $rows[] = $row; 
     } 
    } 
    else{ 
     echo 'MYSQL Error: ' . mysqli_error(); 
    } 

    $json = json_encode($rows); 
    echo $json; 
    mysqli_close($con); 
} 
?> 
+0

我不知道如何填充AJAX @NorlihazmeyGhazali成功下面的代码, – pvegetah

+0

你可以'console.log(res)'里面的成功回调,并在这里共享输出 –

+0

这里是我的输出:http://i.stack.imgur .com/gCZqw.jpg 它将得到输入文本字段的值。 – pvegetah

相关问题