根据输入值分配PHP值

时间:2019-04-23 13:07:51

标签: javascript php ajax

我正在尝试获取输入值并将其分配给PHP数组。我相信我需要使用AJAX,但是由于需要使用PHP来调用API,所以我一直被赶上。

以防万一:我需要用户能够输入区号和下拉列表,该数组将使用正确的区号(不是904)调出Twilio API,以便获取可供购买的电话号码。

<?php
    $sid    = "AC655555555555555";
    $token  = "554353535355555435345";
    $twilio = new Client($sid, $token);                                                                                                                                                      
?>


<label>DID Area Code</label>
<input class="form-control" type="number" id="did_area_code" required="" />                     

<label>DID Number</label>
<select class="form-control" name="did_number" id="company_source">
    <option value="">--Select One--</option>
    <?php
        $numbers = $twilio->availablePhoneNumbers('US')->local->read(array("areaCode" => "904"));
        foreach ($numbers as $record) {
            echo "<option value='" . $record->friendlyName . "'>" . $record->friendlyName . "</option>";
        }
    ?>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          
</select>


<script type="text/javascript">
    $("#did_area_code").on('change', function(){
        var area_code = $('#did_area_code').val();
        alert(area_code);
});

下面的代码是我现在正在使用并且可以工作的代码。如果您试图从Twilio创建API调用以获取可用的购买清单,请随时使用它。

add_number.php

<label>DID Number</label>
<select class="form-control" name="did_number" id="did_number">
    <option value="">--Select One--</option>
</select>

<script type="text/javascript">                                                                         
    $("#did_area_code").on('change', function(){                                            
        var area_code = $('#did_area_code').val().trim();

        if (area_code.length == 3) {
            $.get("../get_phone_nums.php", {area_code: area_code}, function (result) {                                                  
                var select = document.getElementById('did_number');
                var phone_numbers = JSON.parse(result);

                // Clear the select field in case area code is changed
                for(var i = select.options.length - 1; i >=1; i--) {
                    select.remove(i);
                }                                               
                for(var i = 0; i < phone_numbers.length; i++) {
                    var opt = document.createElement('option');
                    opt.innerHTML = formatPhoneNumber(phone_numbers[i]);
                    opt.value = phone_numbers[i];
                    select.appendChild(opt);
                }
            });

            function formatPhoneNumber(phoneNumberString) {
                phoneNumberString = phoneNumberString.replace(/[^\d]/g, "");
                if(phoneNumberString.length == 11) {
                    return phoneNumberString.replace(/^1?(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
                } else {
                    return null;
                }
            }
        }
    });
</script>

get_phone_nums.php

<?php
    require_once 'twilio/autoload.php';
    use Twilio\Rest\Client;

    $sid    = "AC5345353535353535435";
    $token  = "355343553535353535345";
    $twilio = new Client($sid, $token);
    $area_code = $_GET['area_code'];

    $numbers = $twilio->availablePhoneNumbers('US')->local->read(array("areaCode" => $area_code));

    $numberArray = array();

    foreach ($numbers as $record) {
        $numberArray[] = $record->phoneNumber;

    }
    echo json_encode($numberArray);
?> 

1 个答案:

答案 0 :(得分:0)

听起来您想要做的是让JS函数对单独的PHP脚本进行AJAX调用,这将返回可用的电话号码,然后使用JS将这些数字填充回您的HTML表单中。

下面是您需要做的基本工作。我将把它留给您,以确定在PHP和AJAX调用之间如何来回传递数据。我建议您将数据编码为JSON,因为PHP可以轻松地将数组编码为JSON,而JS可以将其解码回数组,然后JS可以继续遍历该数组。如果我正确理解了您的意图,则需要让JS删除您的<option>的所有<select id="company_source">子代,并使用AJAX响应插入新的<option>子代。

以下是您原始脚本中JS的粗略扩展,以进行AJAX调用:

<script type="text/javascript">
    $("#did_area_code").on('change', function(){
        var area_code = $('#did_area_code').val().trim();
        if (area_code.length == 3)
        {
            $.get(  "get_phone_nums.php", 
                    {area_code: area_code}, 
                    function (result) {
                        /*
                        Here is where you read the results from the script (perhaps
                        return the phone numbers as json), and loop through them and
                        use javascript to populate your <select> with new <option>
                        tags containing the returned numbers.
                        */
            });
        }
});

这是您的 get_phone_nums.php 文件的外观:

<?php
    $sid    = "AC655555555555555";
    $token  = "554353535355555435345";
    $twilio = new Client($sid, $token);                                                                                                                                                      

    $numbers = $twilio->availablePhoneNumbers('US')->local->read(array("areaCode" => "904"));

    // Output $numbers for the AJAX call to pick up. Again, perhaps convert it to JSON.
    echo json_encode($numbers);
?>