js中区分大小写;
model类
public class Student
{
public string name { get; set; }
public int id { get; set; }
public string gender { get; set; }
public int age { get; set; }
public List<Play> ListPlay { get; set; }
}
public class Play
{
public string ID { get; set; }
public string Name { get; set; }
}
public HttpResponseMessage PostStudent(Student student)
{
student = studentRepository.Add(student);
var response = Request.CreateResponse<Student>(HttpStatusCode.Created, student);
string uri = Url.Link("DefaultApi", new { id = student.id });
response.Headers.Location = new Uri(uri);
return response;
}
// [HttpPost] HttpResponseMessage IEnumerable<Student>
// [HttpPost]
//返回复杂对象
public HttpResponseMessage PostStudentsByReq(StudentReq studentReq, string criteria)
{
var students= studentRepository.GetAll().Where(
s => string.Equals(s.age.ToString(), studentReq.age.ToString(), StringComparison.OrdinalIgnoreCase));
Student stu = new Student();
stu.age = 1;
stu.gender = "aa";
stu.id = 112;
stu.name = "aaa";
stu.ListPlay = new List<Play>();
Play play = new Play();
play.ID = "11";
play.Name = "张三";
stu.ListPlay.Add(play);
play = new Play();
play.ID = "12";
play.Name = "name2";
stu.ListPlay.Add(play);
List<Student> list = new List<Student>();
list.Add(stu);
var response = Request.CreateResponse(HttpStatusCode.OK, list);
return response;
//return students;
}
html页
add方法js方法 jquery
//Adds a Student to the List
function AddStudent() {
debugger;
var Play = {
ID: '1',
Name: "张三"
};
var Play2 = {
ID: '2',
Name: "李四"
};
var PlayList = new Array();
PlayList.push(Play);
PlayList.push(Play2);
var student = {
name: document.getElementById('newStudentName').value,
id: document.getElementById('newStudentId').value,
gender: document.getElementById('newStudentGender').value,
age: document.getElementById('newStudentAge').value,
ListPlay: PlayList
};
$.ajax({
url: 'http://localhost:60792/api/student/',
type: 'POST',
data: JSON.stringify(student),
contentType: "application/json;charset=utf-8",
success: function (data) {
alert('Student added Successfully');
GetAllStudents();
},
error: function () {
alert('Student not Added');
}
});
}
html部分代码
<div>
<h1 style="color: #f00">Add or Update a Student </h1>
<table style="margin-left: 15px">
<tr>
<td><span>Name</span></td>
<td>
<input id="newStudentName" type="text" /></td>
</tr>
<tr>
<td><span>ID</span></td>
<td>
<input id="newStudentId" type="number" /></td>
</tr>
<tr>
<td><span>Gender</span></td>
<td>
<select id="newStudentGender">
<option value="Male">Male</option>
<option value="Female">Female</option>
</select></td>
</tr>
<tr>
<td><span>Age</span></td>
<td>
<input id="newStudentAge" type="number" /></td>
</tr>
<tr>
<td>
<button id="postStudent" onclick="AddStudent()">Add New Student</button></td>
<td>
<button id="putStudent" onclick="PutStudent()">Update Student</button></td>
</tr>
</table>
</div>
前台jquery 解析复杂对象 对象中包含对象集合 js代码
function GetStudentByReq_Post() {
alert("开始");
debugger;
var studentReq = {
name: 'ab',
id: '1',
gender: 'man',
age: '15'
};
var age = 22;
// jQuery.support.cors = true;
$.ajax({
url: 'api/student?criteria=full',
type: 'POST',
contentType: "application/json;charset=utf-8",
data: JSON.stringify(studentReq),
success: function (data) {
alert(data);
// WriteResponse(data);
WriteResponses(data);
},
error: function (x, y, z) {
alert('The Student not found in the List for the given ID');
}
});
//Displays in a Table
function WriteResponses(students) {
var strResult = "<table><th>Name</th><th>Student ID</th><th>Gender</th><th>Age</th>";
$.each(students, function (index, student) {
strResult += "<tr><td>" + student.name + "</td><td> " + student.id + "</td><td>" + student.gender + "</td><td>" + student.age + "</td></tr>";
strResult += "<ul>";
$.each(student.ListPlay, function (index1, play) {
strResult += "<li>" + play.ID + " " + play.Name + "</li>"
});
strResult += "</ul>";
});
strResult += "</table>";
$("#divResult").html(strResult);
}
}
Html部分代码
<div>
<button id="getStudentByReq2" onclick="GetStudentByReq_Post()">获取列表2</button>
</div>
<div id="divResult" style="margin-left: 15px"></div>