0

我有个问题。我想实现一些目标,但是,我从来没有这样做过,所以不幸的是我不知道如何处理这个问题。

在我的屏幕中,我用来自 sql db 的名称填充了一个下拉框。现在我想,一旦从该下拉列表中选择了一个名称,就可以加载其他数据,例如最小值和最大值。例如,我想使用这些值来限制输入字段。因此,一旦输入字段超出加载的值,输入字段就会变为红色。但是,我想在不按下表单的提交按钮的情况下使用它。

这可能吗 ?如果是这样,有人可以帮我吗?

我用来填充我的选择框的代码是这样的:

<td>
    <div class="controls">
        <select name="prod" id="employee" onclick="updateBottomValue(this.value);" onchange="mys1()" style="width: 245px;">
            <option value="" disabled selected="selected[]" multiple="multiple">Selecteer Product</option>
            <?php
            $pdo = Database::connect();
            $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
            $sql = "SELECT * FROM specsv1 where RActive = 'y' order by RNaam";
            $q = $pdo->prepare($sql);
            $q->execute(array($Id,$RNaam));
            Database::disconnect();
            while ($row = $q->fetch(PDO::FETCH_ASSOC)) {
                echo "<option value='" . $row['Id'] . "'>" . $row['RNaam'] . "</option>";
            } 
            ?>
        </select>

        <?php if (!empty($ProductError)): ?>
            <span class="help-inline"><?php echo $ProductError;?></span>
        <?php endif; ?>
    </div>

    <span id="selectedValue"></span>
    <input STYLE="width: 6em" name="rrss" type="text"  id='rrss'>
</td>

我必须获得所选名称的代码是这样的:

<script>
    function updateBottomValue(selectedvalue) {
        document.getElementById("selectedValue").innerHTML=selectedvalue;
        document.getElementById('rrss').value = selectedvalue;
    }
</script>
4

2 回答 2

1

是的,这是可能的。

也许这个示例 ajax 可以满足您的需求,请随时修改以满足您的要求。

function viewMinMax(value){

    if (value == 'a'){
        tempurl = "https://api.myjson.com/bins/dv40y";
    }else if (value == 'b'){
        tempurl = "https://api.myjson.com/bins/egjmq";
    }

    $.ajax({
        url: tempurl,
        type: "get", 
        dataType: "JSON",
        data: {}, //this is data you send to your server
        success: function(res)
        {   
            $('#info').show();
            document.getElementById("info").innerHTML = 'Your min value: ' + res.min + ', Your max value: ' + res.max;

            $('#min').val(res.min);
            $('#max').val(res.max);
        }
    })
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" method="post">
    <select name="product_select" id="product_select" onchange="viewMinMax(this.value)">
        <option value="">Select Product</option>
        <option value="a">Product A</option>
        <option value="b">Product B</option>
    </select>

    <p id="info" style="display:none;"></p>

    <h3>Load the min & Max</h3>
    <label for="min">Min</label>
    <input type="text" name="min" id="min" value="">
    <br>

    <label for="max">Max</label>
    <input type="text" name="max" id="max" value="">
</form>

忽略tempurl它可以随着您的操作而改变,以根据您的数据库的价值选择数据。

于 2019-03-12T08:03:22.360 回答
0

可能吗?绝对地。有几种方法可以解决它。一种简单的方法是使用jQuery在下拉值更改时立即触发所谓的AJAX 调用。AJAX 调用您的 PHP 脚本并取回一些 HTML,它将放置在屏幕上您想要的任何位置。

这是一个很大的话题,很难给你确切的答案,但是谷歌jquery ajax dropdown onchange和你应该能够获得足够的信息来帮助你前进。其中之一如下(有很多): jQuery Load form elements through ajax, from onchange event of dropdown box

于 2019-03-12T07:21:54.253 回答