0

こんにちは、電話ギャップ アプリを開発していて、JSON 応答を返す WCF サービスからデータを取得しています。コンボ ボックスに DesignName を表示し、関連付けられた designId を渡す必要があります...どうすればよいでしょうか?

これはjson応答です..

{
    "DesignResult":
    "{\"DesignId\":\"1\",\"DesignName\":\"Bedroom\"}     
     {\"DesignId\":\"2\",\"DesignName\":\"Dining\"}
     {\"DesignId\":\"5\",\"DesignName\":\"Entertainment\"}
     {\"DesignId\":\"4\",\"DesignName\":\"Occasional Tables\"}
     {\"DesignId\":\"6\",\"DesignName\":\"Office\"}
     {\"DesignId\":\"3\",\"DesignName\":\"Upholstery\"}"
}

これは、選択した位置でテキストを取得できる関数です

var combo1 = document.getElementById("designBox");
var val = combo1.options[combo1.selectedIndex].text;

ボックスにDesignNameを表示する必要があるため、これによりDesignNameが得られますが、関連するDesignIdを取得する必要があります..

次のコードでは、オプションを動的に追加しています

for (var i = 0; i < jsonData.Design.length; i++) 
{
opt = document.createElement("option");  
opt.text= jsonData.Design[i].DesignName;
sel = document.getElementById("designBox");  
sel.add(opt); 
}

次のようにコードを変更しましたが、DesignId の「Null」を取得します

var optElement = document.createElement("option");
optElement.setAttribute('value',jsonData.Design[i].DesignId);
optElement.innerHTML = jsonData.Design[i].DesignName;

取得するには:

var combo1 = document.getElementById("designBox");
var test = combo1.getAttribute('value');
alert("test value is...."+test);
4

1 に答える 1

0

問題はJSONにあります。その構文的に正しくありません。私はあなたのためにそれを修正しました。

ここでJSONについて読み、徹底的に研究してください。

var jsonData = '{
    "DesignResult": [
        {
            "DesignId": "1",
            "DesignName": "Bedroom"
        },
        {
            "DesignId": "2",
            "DesignName": "Dining"
        },
        {
            "DesignId": "5",
            "DesignName": "Entertainment"
        },
        {
            "DesignId": "4",
            "DesignName": "OccasionalTables"
        },
        {
            "DesignId": "6",
            "DesignName": "Office"
        },
        {
            "DesignId": "3",
            "DesignName": "Upholstery"
        }
    ]
}';

これはサーバーから返される文字列です。次に、関数を使用してjavascriptJSONオブジェクトにキャストしeval()ます。お気に入り、

jsonData = eval('(' + jsonData + ')');

これで、ループなどを使用してこのJSONオブジェクトを反復処理できるようになりました。必要なデータにアクセスするには、次のように実装する必要があります。

これを試して

var len = jsonData.DesignResult.length;

for(var i=0;i<len;i++){
alert("Name - "+jsonData.DesignResult[i].DesignName+" || ID - "+jsonData.DesignResult.DesignId);
}

コードを修正するには、

var len = jsonData.DesignResult.length;
    for (var i = 0; i < len; i++) 
        {
        opt = document.createElement("option");  
        opt.text= jsonData.DesignResult[i].DesignName;
        opt.value = jsonData.DesignResult[i].DesignId;
        //better way is
        //opt.setAttribute('value',jsonData.DesignResult[i].DesignId);
        sel = document.getElementById("designBox");  
        sel.add(opt); 
        }

私は次のようなjQueryでそれを行うことをお勧めします

その"ComboBox"をID="myCombo"のDivにアタッチするとします（必要に応じて更新します）

var selectElement = jQuery("<select />",{id:"mySel"});

for(var i=0;i<len;i++){
var optElement = jQuery("<option />",{value:jsonData.DesignResult[i].DesignId,text:jsonData.DesignResult[i].DesignName);
selectElement.append(optElement);
}

$("#myCombo").append(selectElement);

選択した要素の名前とIDにアクセスするには、次を使用します。

var Name = $("#mySel").html();
var ID = $("#mySel").attr('value');

古いコードを削除しました

コンボボックスとは、HTMLのSELECTタグを意味しますか？

あなたが何をしたいのか正確に理解するのは難しいと思いますか？

ドロップダウンメニューを動的に生成しますか？または、他の何か ？

あなたが正確に何をしたいのかについて、より多くの洞察を教えてください。:)

于 2012-07-26T10:04:08.930 に答える