时间戳

首页 > 解决方案 > 用下拉RestAPI Sharepoint Online的相应数据填充文本框

javascript - 用下拉RestAPI Sharepoint Online的相应数据填充文本框

问题描述

下面的工作代码加载从 RestAPI 调用返回的下拉 id REG 的选项值。

我想获取 Title 的值并将其相应的家庭值（在相同的 RestAPI 调用中返回）填充到带有 on change javascript 事件的文本框 id Family 中。请指教。

<script>
SP.SOD.executeFunc('sp.js', 'SP.ClientContext', getAR);
var jresult;
function getAR() {
    $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('List_Name')/items?$Select=Title,Family",
        type: "GET",
        headers: {"accept": "application / json;odata = verbose",},
        success: function(data) {
            jresult = data.d.jresult;
            var options = "";
            for(var i = 0; i < jresult.length; i++){
                options = options + "<option value='" + jresult[i].Title + "'>" + jresult[i].Title + "</option>";
            }
            $("#REG").append(options);
        },
        error: function(error) {alert(JSON.stringify(error));}
    });
}
function fillFamily() {
  var x = document.getElementById("REG").value;
  $( "Family" ).val( x.Family );
}
</script>

<select id="REG" name="REG" class="custom-select" required="required" onchange="fillFamily()"></select>
<input type="text" id="Family" name="Family">

标签： javascripthtmljquerysharepoint-onlinerest

解决方案

我已经更新了你的代码，你可以试试。更正了代码中的错误。

 <script>
        $(function(){
            getAR() 
        })
        var jresult;
        function getAR() {
            $.ajax({
                url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('2/23')/items?$Select=Title",
                type: "GET",
                headers: {"accept": "application / json;odata = verbose",},
                success: function(data) {
                    jresult = data.d.results;
                    var options = "";
                    for(var i = 0; i < jresult.length; i++){
                        options = options + "<option value='" + jresult[i].Title + "'>" + jresult[i].Title + "</option>";
                    }
                    $("#REG").append(options);
                },
                error: function(error) {alert(JSON.stringify(error));}
            });
        }
        function fillFamily() {
           
          var x = document.getElementById("REG").value;
          $( "#Family" ).val( x );
        }
        </script>
        
        <select id="REG" name="REG" class="custom-select" required="required" onchange="fillFamily()"></select>
        <input type="text" id="Family" name="Family">

在此处输入图像描述

更新：

<script>
    $(function(){
        getAR() 
    })
    var jresult;
    function getAR() {
        $.ajax({
            url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('2/23')/items?$Select=Title,Family",
            type: "GET",
            headers: {"accept": "application / json;odata = verbose",},
            success: function(data) {
                jresult = data.d.results;
                var options = "";
                for(var i = 0; i < jresult.length; i++){
                    options = options + "<option value='" + jresult[i].Title + "'Family="+jresult[i].Family+">" + jresult[i].Title + "</option>";
                }
                $("#REG").append(options);
            },
            error: function(error) {alert(JSON.stringify(error));}
        });
    }
    function fillFamily() {
        var val=$("#REG").find("option:selected").attr("Family");
      $( "#Family" ).val( val );
    }
    </script>
    
    <select id="REG" name="REG" class="custom-select" required="required" onchange="fillFamily()"></select>
    <input type="text" id="Family" name="Family">

推荐阅读