3

document.getElementById意図した結果: javascript のみを使用して、読み込み時にフォームに自動的に入力します。

次の関数に渡す配列があり、html スクリプトに正しく追加されます。 

 function showResults(results) {
     var s = "";
     for (var i=0, il=results.features.length; i<il; i++) {
         var featureAttributes = results.features[i].attributes;

         for (att in featureAttributes) {
             s = s + "<b>" + att + ":</b>  " + featureAttributes[att] + "<br />";
             // var subshed = feature[0].attributes["SubWS"];

         }
     }
     dojo.byId("info").innerHTML = s;
 }

結果は次のようになります

オブジェクトID: 190
ProjectTyp: ストームウォーター レトロフィット
単位：下
SubWS: 悲しい

ただし、スクリプトを変更して既存のフォームに入力する必要があります 

document.getElementById(att).value = featureAttributes[att];

私は常に最終出力を上書きしているように見えるので、単一のフォーム値のみを入力します。複数の値を入力するにはどうすればよいですか?

更新: Polywhirl 氏は正しく理解しました。また、null 属性値を処理するために if ステートメントを追加する必要がありました。最終的なコードは次のとおりです。

 function showResults(results) {
            var subshed = results.features[0].attributes["SubWS"];
            //OBJECTID = results.features[0].attributes["OBJECTID"];
document.getElementById("searchString").value = subshed;
                console.log("feature", results.features[0].attributes["SubWS"])
console.log(document.getElementById("Map_ID"));
        var s = "";
    for (var i = 0, il = results.features.length; i < il; i++) {
          var featureAttributes = results.features[i].attributes;
          for (att in featureAttributes) {
        // s = s + "<b>" + att + ":</b>  " + featureAttributes[att] + "<br />";
  //         var subshed = feature[0].attributes["SubWS"];

                //    document.getElementById(att).value = featureAttributes[att];
  if(!!featureAttributes[att]&&!!document.getElementById(att)){
                    document.getElementById(att).value = featureAttributes[att];


}else{

//alert(att + "this is null")

}
          }

        }

     //   dojo.byId("info").innerHTML = s;
      }
4

1 に答える 1

0

したがって、フォームに高度にネストされたデータソースがあるようです。

JSオブジェクトを解析するための2つの例を作成しました。これは、最近のすべてのブラウザーでサポートされているJSON.parse（jsonString）メソッドを使用して実現できますが、古いブラウザーでは、オンラインで無料で入手できるJSON2.jsポリフィルを使用できます。

最初のケースでは、angularJSと呼ばれるMVxフレームワークを使用して、そのような使用法を説明しました。

私はそれをかなり非エレガントにしました、しかしそれは初心者にとってはかなり理解できます。

コントローラ：

function FormData($scope) {
    $scope.data = {
        OBJECTID: 190,
        ProjectTyp: "Stormwater Retrofit",
        Unit: "Lower",
        SubWS: "sadd"
    };
}

ビューの一部

<form action="path/to/your/action/svc" method="post" ng-controller="FormData">
    <div>
        <label>OBJECTID:</label>
        <input type="text" value="{{data.OBJECTID}}" />
    </div>

同じフィドルの2番目の例では、plain（vanilla）JSを使用してフォームにデータを入力し、JSON.parse（d）オブジェクトを配列に変換してフォームにマッピングします。

配列へのオブジェクト：

function objectToArray(obj) {
    var arr =[];
    for(x in obj) {
        arr.push(obj[x]);
    }
      return arr;
}

var dataArr = objectToArray(data);

人口：

var form = document.getElementById("myForm");
var formItems = form.getElementsByTagName("input");
for(x in formItems) {
    if(formItems[x].type == "text") {
         formItems[x].value = dataArr[x];
    }
}

フィドルはここで見つけることができます

それが役に立てば幸い、

マイク。

于 2013-03-20T14:46:27.840 に答える