前臺jquery+ajax+json傳值,後臺處理完後返回json字符串,如何取裏面的屬性值?(不用springmvc註解)

前臺jquery+ajax+json傳值,後臺處理完後返回json字符串,如何取裏面的屬性值?(不用springmvc註解)

一.取屬性值

前臺頁面:

function select(id){
alert(“hfdfhdfh”+id);
.ajax({<br>     url:"selectByid.jsp",<br>        <span style="background-color: #ffff00;">datatype:'json',</span><br>        data:{id:id}, // 發送數據   <br>        error:function(data){  <br>            alert("出錯了,沒有這個學生!!");  <br>       },  <br>       success:function(data){<br>        alert(data);<br>        <span style="background-color: #ffff00;">var json = eval("("+data+")");//將json類型字符串轉換爲json對象</span><br>        alert("hjf"+json.name);<br> ("#id").val(<span style="background-color: #ffff00;">json.id</span>),<br> ("#name").val(<span style="background-color: #ffff00;">json.name</span>),<br> ("#age").val(<span style="background-color: #ffff00;">json.age</span>);<br> if(<span style="background-color: #ffff00;">json.sex</span>=='男'){<br> ("input:radio[name=sex]").eq(0).attr("checked",true);<br>// ("input[name=sex]").attr("checked","checked");<br> // ("#sex").attr("checked",'checked');<br>      // ("#sex").removeAttr("checked");<br> }else{<br> ("input:radio[name=sex]").eq(1).attr("checked",true);<br>// ("input[name=sex]").attr("checked","checked");<br> //("#sex").attr("checked",'checked');<br>     // (“#sex”).removeAttr(“checked”);
}
}

後臺代碼:

<%@ page language=”java” import=”java.util.*,com.dao.*,com.bean.*,com.fasterxml.jackson.databind.ObjectMapper” pageEncoding=”utf-8”%>
<%
int id = Integer.parseInt(request.getParameter(“id”));
StudentDao dao = new StudentDao();
StudentBean bean = dao.selectByid(id);
if(bean!=null){
ObjectMapper x = new ObjectMapper();
String str = x.writeValueAsString(bean);    //將java類對象轉換爲json字符串
System.out.print(str);
response.getWriter().print(str);    //將數據返回前臺ajax
}
%>

二.前端ajax接不到json值怎麼回事?

前臺頁面:

function ajaxPost(){
.ajax({  <br>        data:{"name": ("#name").val(),<br> "age":("#age").val(),<br>     "sex": (“input[name=’sex’]:checked”).val()},
type:”Post”,
async:false,                //加上這個屬性就好了
dataType: ‘json’,
url:”addStudent.jsp”,
error:function(data){
alert(‘添加失敗!’);
},
success:function(data){
alert(‘添加成功!’);
window.location.href = ‘list.jsp’
}
});
}

後臺代碼:

<%@ page language=”java” import=”java.util.*,com.dao.*,com.bean.*” pageEncoding=”utf-8”%>
<%
String name = request.getParameter(“name”);
int age = Integer.parseInt(request.getParameter(“age”));
String sex = request.getParameter(“sex”);
StudentBean student = new StudentBean();
student.setName(name);
student.setAge(age);
student.setSex(sex);
StudentDao dao = new StudentDao();
int rows = dao.addStudent(student);
if(rows>0){
response.getWriter().print(“{}”);
}
%>

三.後臺查詢數據庫返回集合,前臺顯示在表格中。

前臺頁面:

(document).ready(function(){<br> (“#list4”).jqGrid({                //jqGrid 表格控件
url:”selectStudent.jsp”,
datatype:”json”,
mtype:”POST”,
height:600,
postData:”{SearchSql:”}”,
autowidth:true,
colNames:[‘ID’,’姓名’,’年齡’,’性別’],
colModel:[
{name:’id’,index:’id’,hidden:true},
{name:’name’,index:’name’},
{name:’age’,index:’age’},
{name:’sex’,index:’sex’},

],
rownumbers:true,
viewrecords: true,
jsonReader:{
id: “blackId”,
repeatitems : false
},
pager:$(‘#gridPager’)
});
});

後臺代碼:

<%@ page language=”java” import=”java.util.*,com.dao.*,com.bean.*,com.fasterxml.jackson.databind.ObjectMapper” pageEncoding=”utf-8”%>
<%
StudentDao dao = new StudentDao();
List<StudentBean> list = dao.selectAll();
if(list!=null){
ObjectMapper x = new ObjectMapper();
String str1 = x.writeValueAsString(list);      //集合轉json類型字符串
response.getWriter().print(str1);    //返回前端ajax
}
%>

 

分類: 前端
2
0

« 上一篇:爲大型網站提速—redis
» 下一篇:解決ora-00054 Oracle鎖表問題
    </div>
    <div class="postDesc">posted @ <span id="post-date">2016-09-08 17:06</span> <a href="http://www.cnblogs.com/yuxiaona/">小娜與明羽</a> 閱讀(<span id="post_view_count">6623</span>) 評論(<span id="post_comment_count">0</span>)  <a href="https://i.cnblogs.com/EditPosts.aspx?postid=5853732" rel="nofollow">編輯</a> <a href="#" onclick="AddToWz(5853732);return false;">收藏</a></div>
</div>
<script type="text/javascript">var allowComments=true,cb_blogId=299785,cb_entryId=5853732,cb_blogApp=currentBlogApp,cb_blogUserGuid='3f18992d-aa62-e611-9fc1-ac853d9f53cc',cb_entryCreatedDate='2016/9/8 17:06:00';loadViewCount(cb_entryId);</script>


</div><!--end: forFlow -->
</div>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章