JSON 객체 배열을 반복하여 반복합니다.

Question

이 질문은 여러 번 답변되었지만 작동하지는 못합니다. 제 질문은 one과 같으며이 one과 third example입니다.

내가하고 싶은 것은 this 및 this 개의 질문과 같은 JSON 객체의 옵션 상자를 채우는 것입니다. 그들은 모두 약간 다르지만 유사하지만 작동하도록 할 수는 없습니다. ;

function Test() { 
    $.ajax({ 
    type: "POST", 
    url: "Service.asmx/HelloWorld", 
    data: "{'p_productCategoryId' : 1 }", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success:function(msg){ 
     alert(msg.d) 
     }, 
    error: function() { 
     alert("An error has occurred during processing your request."); 
         } 
    }); 

} :

<System.Web.Script.Services.ScriptService()> _ 
<WebService(Namespace:="http://tempuri.org/")> _ 
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _ 
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _ 
Public Class Service 
Inherits System.Web.Services.WebService 

<WebMethod()> _ 
<ScriptMethod(ResponseFormat:=ResponseFormat.Json)> _ 
Public Function HelloWorld(ByVal p_productCategoryId As Integer) As String 
    Dim productCategory = ProductService.GetProductCategory(p_productCategoryId) 

    'Dim productList = ProductService.GetProducts(productCategory) 
    Dim productList = New List(Of Product) 
    For cnt = 1 To 3 
     Dim product = New Product(cnt) 
     product.Productname = cnt.ToString & "|" & cnt.ToString 
     productList.Add(product) 
    Next 

    Return productList.ToJSON 

End Function 

End Class 

<System.Runtime.CompilerServices.Extension()> _ 
Public Function ToJSON(Of T)(p_items As List(Of T)) As String 
    Dim jSearializer As System.Web.Script.Serialization.JavaScriptSerializer = New System.Web.Script.Serialization.JavaScriptSerializer() 
    Return jSearializer.Serialize(p_items) 
End Function 

나는 다음과 같은 코드를 사용하는 경우 다음은 웹 서비스에서 내 코드는 OK 보인다

[{"Id":1,"IsActive":false,"Category":null,"Productname":"1|1","Price":0}, 
{"Id":2,"IsActive":false,"Category":null,"Productname":"2|2","Price":0}, 
{"Id":3,"IsActive":false,"Category":null,"Productname":"3|3","Price":0}] 

:

나는이 결과를 얻는다.

msg에서 'd'를 삭제하면 경고의 결과는 다음과 같습니다

[object Object] 

옵션 상자를 채우기 위해 '업무 진행'코드가 순간 :)에 (이것이다 :

function Test() { 
$.ajax({ 
    type: "POST", 
    url: "Service.asmx/HelloWorld", 
    data: "{'p_productCategoryId' : 1 }", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (msg) { 
     $("#prd_id").empty().append($("<option></option>").val("[-]").html("Please select")); 
     $.each(msg.d, function() { 
          $("#prd_id").append($("<option></option>").val(this['Id']).html(this['Productname'])); 
     }); 
    }, 
    error: function() { 
     alert("An error has occurred during processing your request."); 
    } 
}); 

};

나는 이전에 언급 한 예제에서 작동하도록 여러 가지 방법을 시도했지만 아무 소용이 없습니다. msg.d를 사용하면 문자열의 문자 수와 함께 옵션 상자가 채워집니다. 내가 명시 적으로 'getJSON'와 'msg'에서 JSON 개체를 만들려고했습니다. ('데이터 유형'과 같은 것이 아닌가요?) 예제 데이터에서 볼 수 있듯이 명명 된 객체를 사용할 수 없기 때문에 사용할 수 없습니다. 내가 뭘 놓치고 있니?

배열을보기 위해 코드를 가져올 수없는 방법에는 3 가지 항목이 있습니다.

Answer 1

. msg.d 가정

정말 배열 (즉 .d 속성은 ASP.Net 것입니다) :

success: function (msg) { 
    var options = $("#prd_id")[0].options; 
    options.length = 0; 
    options.add(new Option("Please select", "[-]")); 
    $.each(msg.d, function() { 
     options.add(new Option(this.Productname, this.Id)); 
    }); 
}, 

Live Example | Source

Option 생성자는 텍스트를 첫 번째 인수로, 값을 두 번째 인수로 취합니다. select 요소의 options 목록은 배열과 비슷하지만 이전 브라우저와의 호환성을 위해 push 대신 add을 사용합니다 (또는 options[options.length] 중 하나가 작동 함).

또는 msg 배열 (NO .d를) 인 경우, 단지 제거 .d :

success: function (msg) { 
    var options = $("#prd_id")[0].options; 
    options.length = 0; 
    options.add(new Option("Please select", "[-]")); 
    $.each(msg, function() { 
     options.add(new Option(this.Productname, this.Id)); 
    }); 
}, 

Live Example | Source

응답이 올바른 MIME 유형으로 반송되지 않는 경우 msg은 실제로 텍스트가 될 수 있으며 배열이 아닐 수 있습니다.

msg = $.parseJSON(msg); 

을 ... 그리고 위의 사용 : 그렇다면, 당신은 당신이 수동으로 분석 할 수 있지만, 올바른 MIME 타입 (application/json)를 반환하여 서버에 그 문제를 해결하고자합니다. 또는 물론 (즉, 정말 아닌 것 같습니다 있지만)이 msg.d로 돌아오고 경우 :

msg.d = $.parseJSON(msg.d): 

Answer 2

이 작업을 수행 할 수 있습니다 아마 HTML보다는 Option 생성자를 사용하는 것이

$.each(msg.d, function (key, value) { 
    $("#prd_id").append($("<option/>").val(value.Id).html(value.Productname)); 
}); 

Fiddle Demo

Answer 3

나는 동일한 JSON 데이터를 반환 내 REST WCF와 문제에 따라 복제를 시도하고, 아래 샘플,

일

<script type="text/javascript"> 
$(document).ready(function() { 
}); 
var GetRawList = function() { 
    $.ajax({ 
     type: "GET", 
     url: "RestService/HelloWorld", 
     contentType: "application/json;charset=utf-8", 
     dataType: "json", 
     success: function(data) { 
    //Change this "data.d" According to your returned JSON output header. 
      var result = data.d; 
    $("#prd_id").empty().append($("<option></option>").val("[-]").html("Please select")); 
      $.each(result, function(key, value) { 
      $("#prd_id").append($("<option/>").val(value.Id).html(value.Productname)); 
      }); 
     }, 
     error: function(xhr) { 
      alert(xhr.responseText); 
     } 
    }); 
}