Question

我有一个包含三个字段的表。两个是下拉列表，一个是输入字段。我必须根据下拉字段比较输入字段和库存数量的值。

如何处理ajax？

function compareData() {

    var quantity = document.getElementsByName('quantity[]');
    var stockName = document.getElementsByName('stockName[]');
    var oldQnt = [];

    $.ajax({
        url: 'php_action/fetchStockas.php',
        type: 'post',
        async: true,
        data: { stock: stockName },
        dataType: 'json',
        success: function(data) {
            oldQnt.push(data);

        }

    });
    for (var x = 0; x < quantity.length; x++) {
        alert(quantity[x].value);
        // alert(oldQnt[x].value);

    }
}

PHP代码：

<?php 
    require_once 'core.php'; 

    $stock=$_POST['stockNmame']; 

    $sql = "SELECT st_id, st_item_name, st_price, st_quantity FROM stock WHERE st_item_name='$stock'"; 
    $result = $connect->query($sql); 
    $output = array('data' => array()); 
    if($result->num_rows > 0) { 
        while($row = $result->fetch_array()) { 
            $stockId = $row[0]; 
            $stockName=$row[1]; 
            $stockPrice=$row[2]; 
            $stockQuantity=$row[3]; 
            $output['data'][] = array( $stockName, $stockPrice, $stockQuantity, ); 
        } 
    } 
    $connect->close(); 
    echo json_encode($output);

Answer 1

我试图找出你想要实现的目标，但仍然不清楚你是想从下拉菜单中获取所有选项还是只选择所选项。我创建了一个使用它们的代码片段，并解释了它们之间的区别。在我已经模拟的AJAX请求中获得成功的返回数据，但您需要自己添加。

＆＃13;

var mockData = {
    stockName: null,
    stockPrice: 0,
    stockQuantity: 0
}

function setMockData() {
    mockData = {
        stockName: $('#stockNameMock').val(),
        stockPrice: parseInt($('#stockPriceMock').val(), 10) || 0,
        stockQuantity: parseInt($('#stockQuantityMock').val(), 10) || 0
    }
}

function compareData() {
    var siteName = $('#siteName').val(), // Get the selected site name
        stockName = $('#stockName').val(), // Get the selected stock name
        quantity = parseInt($('#quantity').val(), 10) || 0; // Get the selected quantity
    
    setMockData(); // Set mock data

    $.ajax({
        url: '/echo/json/', // Replaced for mocking
        type: 'post',
        async: true,
        data: {
            json: JSON.stringify(mockData) // Added for mocking
        },
        dataType: 'json',
        success: function(data) {
            if(data.stockName === stockName) {
                if(data.stockQuantity < quantity) {
                    $('#statusMessage').text('Stock quatity to low');
                } else {
                    $('#statusMessage').text('-');
                }
            } else {
                $('#statusMessage').text('Stock name mismatch');
            }
        }

    });
}

$('#submit').on('click', compareData);

setMockData();

＆＃13;

#statusMessage {
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>MOCK DATA</h2>
Stock name: <input id="stockNameMock" type="text" value="stock1" /><br/>
Stock price: <input id="stockPriceMock" type="number" value="10" /><br/>
Stock quantity: <input id="stockQuantityMock" type="number" value="5" /><br/>

<h2>INPUT</h2>
Site Name:
<select name="siteName" id="siteName">
    <option value="site1">site1</option>
    <option value="site2">site2</option>
    <option value="site3">site3</option>
</select><br/>
Stock name:
<select name="stockName" id="stockName">
    <option value="stock1">stock1</option>
    <option value="stock2">stock2</option>
    <option value="stock3">stock3</option>
</select><br/>
Quantity:
<input type="number" name="quantity" id="quantity" value="0" /><br/>
<button type="button" id="submit">Submit</button>
<br/>
<br/>
<div>Status: <span id="statusMessage">-</span></div>

＆＃13;

您可以在此处试用此代码：https://jsfiddle.net/knfnaouy/2/

似乎嘲笑不是在这里工作，所以看看小提琴。

如何基于js变量调用ajax

1 个答案: