홈>2020-02-26 11:56

javascript - 선택 상자를 선택한 후 SQL 데이터를로드 하시겠습니까?

질문이 있습니다. 나는 무언가를 달성하고 싶지만, 불행히도 이것을 처리하는 방법을 모르겠습니다.

내 화면에서 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>

javascriptphphtmlmysqlsql

답변 # 1

그렇습니다.

아마도이 예제는 당신이 원하는 것에 대한 아약스, 당신의 요구에 맞게 자유롭게 수정해라.

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 를 무시 DB의 가치에 따라 데이터를 선택하는 작업으로 변경 될 수 있습니다.

답변 # 2
가능한가요? 물론. 그것에 대해 몇 가지 방법이 있습니다. 한 가지 쉬운 방법은 드롭 다운 값이 변경되는 즉시 jQuery를 사용하여 AJAX 호출을 시작하는 것입니다. AJAX는 PHP 스크립트를 호출하여 원하는 위치에 배치 할 HTML을 화면에서 다시 가져옵니다.

큰 주제이므로 정확한 답변을하기가 어렵지만 Google jquery ajax dropdown onchange 그리고 당신은 당신이 갈 수 있도록 충분한 정보를 얻을 수 있어야합니다. 그들 중 하나는 다음과 같습니다 (많은 것들이 있습니다) : jQuery 드롭 다운 상자의 onchange 이벤트에서 아약스를 통해 양식 요소를로드합니다.

Python2.net

javascript - 선택 상자를 선택한 후 SQL 데이터를로드 하시겠습니까?

관련 자료