2016-04-05 21 views
0

我有一个名为soapService.aspx的c#(托管在本地主机上)创建的SOAP webservice。它有一个名为displayClass(String id,String theDate)的方法返回 。这返回以下jsonSOAP webservice调用使用jQuery ajax发送2个参数的方法,如何在循环中捕获响应

 

[{"lesson_id":2,"customer_id":4,"instructor_id":8,"dance_style_id":2,"hourly_rate":20,"lesson_time":"Afternoon","lesson_date":"03/12/2015","start_time":"11:22","end_time":"14:22 ","notes":"test test","payment_status":0,"status":0,"lesson_slot":null,"duration":3},{"lesson_id":3,"customer_id":4,"instructor_id":8,"dance_style_id":2,"hourly_rate":20,"lesson_time":"Afternoon","lesson_date":"03/12/2015","start_time":null,"end_time":null,"notes":null,"payment_status":0,"status":0,"lesson_slot":null,"duration":3},{"lesson_id":4,"customer_id":4,"instructor_id":8,"dance_style_id":2,"hourly_rate":20,"lesson_time":"Afternoon","lesson_date":"03/12/2015","start_time":null,"end_time":null,"notes":null,"payment_status":0,"status":0,"lesson_slot":null,"duration":3}] 

我发现这使用Web服务描述页上给出的Web服务调用方法。

我想用ajax来捕捉响应。

到目前为止,我写了这个

 
$(document).ready(function() { 

    function displayClass() { 
     var instructorInputID = $('#instructorIdText').val(); 
     var instructorInputDate = $('#instructordateText').val(); 
     //send this id to web service 

     $.ajax({ 

      url: "http://localhost/soapService.asmx/displayClasses", 
      type: POST, 
      dataType:"json", 
      data:instructorInput, 
      contentType:"application/json; charset:utf-8", 

      success:function(msg){ 

       //process the msg 

      } 


     }); 

    } 

}); 

1)如何通过传递参数 2)如何显示表中的所有这些JSON数据调用Web服务的方法?请帮助

编辑:尝试后

 
data: "{'id': '" + instructorInputID + "','theDate': '" + instructorInputDate + "'}", 

这是响应我从控制台得到

 
XMLHttpRequest cannot load http://localhost:18324/soapService.asmx/displayClasses. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:17182' is therefore not allowed access.
EDIT Two : 
complete code : Still Error.. msg not defined 
<pre> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 

$("#findClassBtn").click(function() { 

displayClass(); 
}); 

function onSuccess(msg) { 
$.each(msg, function(i, item) { 
var tds = ""; 
$.each(item, function(i, item) { 
tds += "<td>" + item + "</td>"; 
}); 
$('#table').append("<tr>" + tds + "</tr>"); 
}); 
} 

function displayClass() { 
var instructorInputID = $('#instructorIdText').val(); 
var instructorInputDate = $('#instructordateText').val(); 
//send this id to web service 
$.ajax({ 
url: "soapService.asmx/displayClasses", 
type: "POST", 
dataType:"json", 
data: { 
'id': instructorInputID, 
'theDate': instructorInputDate 
}, 
contentType: "application/json; charset:utf-8", 
success: onSuccess(msg) 
}); 
} 

</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
</div> 
<asp:Label ID="Label1" runat="server" Text="Add Your Id"></asp:Label> 
<p> 
<asp:TextBox ID="instructorIdText" runat="server"></asp:TextBox> 
</p> 
<asp:Label ID="Label2" runat="server" Text="Add date (dd/mm/yyyy)"></asp:Label> 
<p> 
<asp:TextBox ID="instructordateText" runat="server"></asp:TextBox> 
</p> 
<asp:Button ID="findClassBtn" runat="server" OnClick="findClassBtn_Click" Text="Find Classes" /> 
<p> 
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label> 
</p> 
</form> 
<table id="table"> 
</table> 
<pre> 

Error: msg is not defined. 
+0

在_data_你试图发布字符串,而不是json对象 – Romario

+0

我已更正我的答案。 – Romario

回答

0

$(document).ready(function() { 
 

 
    function displayClass() { 
 
     var instructorInputID = $('#instructorIdText').val(); 
 
     var instructorInputDate = $('#instructordateText').val(); 
 
     //send this id to web service 
 

 
     $.ajax({ 
 

 
      url: "http://localhost/soapService.asmx/displayClasses", 
 
      type: POST, 
 
      dataType:"json", 
 
      data: { 
 
       'id': instructorInputID, 
 
       'theDate': instructorInputDate 
 
      }, 
 
      contentType: "application/json; charset:utf-8", 
 

 
      success: function (msg) { 
 
       $.each(msg, function(i, item) { 
 
       var tds = ""; 
 
       $.each(item, function(i, item) { 
 
        tds += "<td>" + item + "</td>"; 
 
       }); 
 
       $('#table').append("<tr>" + tds + "</tr>"); 
 
       }); 
 
      } 
 
     }); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="table"> 
 
</table>

+0

添加了代码。它给内部500错误。 web服务ASPX的位置在本地主机上,客户端代码也在本地主机上。这是否导致问题? –

+0

@NurulAlamAnik这个错误? 'XMLHttpRequest无法加载http:// localhost:18324/soapService.asmx/displayClasses。对预检请求的响应不会通过访问控制检查:请求的资源上不存在“访问控制 - 允许来源”标头。 Origin'http:// localhost:17182'因此不被允许访问' – Romario

+0

@你似乎试图从http:// localhost:17182''向http:// localhost:18324 /发送请求。 ..'。这是跨域请求。看看这个http://stackoverflow.com/questions/20035101/no-access-control-allow-origin-header-is-present-on-the-requested-resource。 – Romario

相关问题