如何將變量發布到php並在同一頁面上運行該php？

Question

我正在為本地服裝店進行庫存搜索，由於他們網站的設置方式，我需要運行php以提取數據並將其組織成與搜索表單相同的頁面。 （我認為這需要使用AJAX來完成。我對AJAX：P還是很陌生）這是當前文件。

Search.php

<?php
    include(dirname(__FILE__) . '/../inc/init.php');
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf- 8" />
    <title>Inventory | The Loft Ames</title>
    <!--[if IE]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="popup.css"> 
    <link rel="stylesheet" type="text/css" href="../css/loft_fonts.css" />
    <link rel="stylesheet" type="text/css" href="../css/loft_style.css" />
    <link href="../admin/themes/css/bootstrap.min.css" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
a:link {
    color: #FFF;
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #FFF;
}
a:hover {
    text-decoration: none;
    color: #FFF;
}
a:active {
    text-decoration: none;
    color: #FFF;
}
.form-search{
    text-align:left;
}
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
background-color: black;
}
html, body { margin: 0; padding: 0; }
div#DP01 {
    position:relative;
    width:575px;
    /*margin: 0 auto;*/
}th{
    cursor:pointer;
}
</style>
</script>
</head>
<body>
<div id="layout">
<div id="DP01">
    <br><h27><center>Search Our Inventory at The Loft</center></h27><br>
<form action="/test/results.php" method="post">
Search here: <input type="text" name="search"><br>
<input type="submit"><br>
<script type="text/javascript" src="jquery.min.js"></script>

<!--<a href="#" onclick="doSomething();">Click Me!</a>-->
</form>
<br><br>
<!-- <h27><center>View Our Current Inventory</center></h27>
<center>
<a href="#" onclick="getTableRecordsSearch('latest');">Show Latest Inventory</a>
</center> -->

<br><br>
<h31><center>Please contact us if you have any additional questions <a class="popup" href="/popups/contact.html"><strong>here.</strong></a><br>or call us 515-232-9053.</center></h31>
<br><br>
</div>

    </div>
    <?php
include('footer.php');
?>
</body>
</html>

results.php

<?php

$search = $_GET['search'];
if ($search == "") {
    echo "Please enter a query. <a href='/search.php'>Click Here</a> to go back";
  break;
}
else {
$data = array('key' => $API_KEY,
              /*'consignorId' => '1',*/
              'query' => $search,
              'includeItemsWithQuantityZero' => 'false');

$data_string = json_encode($data);

$context = stream_context_create(array(
  'http' => array(
    'method' => "POST",
    'header' => "Accept: application/json\r\n".
          "Content-Type: application/json\r\n",
    'content' => $data_string
  )
));

$result = file_get_contents('https://user.traxia.com/app/api/inventory', false, $context);


$jsonData = $result;
$phpArray = json_decode($jsonData, true);
$phpArray = $phpArray['results'];
$activeonly = array_filter($phpArray, function($active) { return $status['status']=="ACTIVE"; });
$mykeys = array('name','sku','category','color','size','currentPrice');
}
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="/test/css/search-results.css">
<script type="text/javascript" src="/test/js/tablesorter/jquery-latest.js"></script> 
<script type="text/javascript" src="/test/js/tablesorter/jquery.tablesorter.js"></script>
<script>
$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
); 
</script> 
</head>
<div class="CSSTableGenerator"> 
<table id="myTable" class="tablesorter">
     <thead>
        <tr>
           <?php
        foreach($mykeys as $k) {
            if ($k == "name") {
              $k = "Name";
            }
            if ($k == "sku") {
              $k = "SKU";
            }
            if ($k == "category") {
              $k = "Category";
            }
            if ($k == "color") {
              $k = "Color";
            }
            if ($k == "size") {
              $k = "Size";
            }
            if ($k == "currentPrice") {
              $k = "Price";
            }
            echo "<th style='cursor:pointer'>$k<img src='/test/images/UpDown.png' width='8px' height='auto' style='margin: 0px 20px'></th>";
        }
        ?>
        </tr>
        </thead>
        <tbody>
        <?php
        foreach($phpArray as $key => $values) {
            echo '<tr>';
            foreach($mykeys as $k) {
                if ($values['category'] == 'UNCATEGORIZED') continue;
                $value = $k == "currentPrice" ? '$' . number_format($values[$k]/100,'2') : $values[$k];
                echo "<td>" . $value . "</td>";
            }
            echo '</tr>';
        }
        ?>
     </tbody>
  </table>
  </div>
</html>

因此，基本上，我需要合並這兩個文件，同時在提交搜索表單之前不運行第二個文件。 謝謝！

Answer 1

是的..您可以將Javscript加載到帶有搜索變量的頁面上的DIV中。 這個例子有一個登錄表單，但是想法是一樣的。 表單字段，提交的表單等。我還包括“請稍候”加載消息。 之所以這樣設計，是因為我在同一頁面上有多個表單，並且我調用該函數以使用函數的“ formName”和“ message”變量分別提交它們。

function loader(message) {
    if (message == "" || message == null) {
        message = "Please wait ...";
    }
    $('#DivWhereYouWantData').html('<div style="width:100%;text-align:center;margin-top:150px;"><div style="font-size:20px;"><b>' + message + '</b></div></div>');
}
function submitForm(formName,message) {
    $.ajax({
        data: $("#" + formName).serialize(),
        type: $("#" + formName).attr('method'),
        url: $("#" + formName).attr('action'),
        beforeSend: function() {
            loader(message);
        },
        success: function(response) {
            $('#DivWhereYouWantData').html(response);
        }
    });
    return false;
}

和標題中的jQuery-

<script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

和HTML與腳本一起使用-

<form id="login" name="login" method="post" action="processLogin.php" onsubmit="return submitForm('login','Logging you in ...');">
    Logn: <input type="text" style="text-input" name="login" id="login" />
    Password: <input type="password" style="text-input" id="password" name="password" />                        
    <input style="background:none; border:none; padding:0; height:auto; width:auto;" type="image" src="img/signIn.png" />
</form>

<div id="DivWhereYouWantData">
    <!-- Dynamic content loads here -->
</div>

Answer 2

$("button").click(function(){
  $.ajax({
        url:"results.php",
        success:function(result){
              $("#div1").html(result);
     }
  });
});`

只是使用Jquery Ajax是更好的方法，並檢查此鏈接，嘗試第二個答案，它太簡單了，PHP的jQuery Ajax POST示例

如何將變量發布到php並在同一頁面上運行該php？

問題描述

2 個解決方案

解決方案1
0 2014-06-11 16:23:04

解決方案2
0 2014-06-11 16:24:36

如何將變量發布到php並在同一頁面上運行該php？

問題描述

2 個解決方案

解決方案1 0 2014-06-11 16:23:04

解決方案2 0 2014-06-11 16:24:36

解決方案1
0 2014-06-11 16:23:04

解決方案2
0 2014-06-11 16:24:36