问题遇到的现象和发生背景
vue或ajax发送不了数据
问题相关代码,请勿粘贴截图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>添加品牌</title>
</head>
<body>
<h3>添加品牌</h3>
<div id="app">
<form action="brand-demo/addServlet" method="post">
品牌名称:<input id="brandName" v-model="brand.brandName" name="brandName"><br>
企业名称:<input id="companyName" v-model="brand.companyName" name="companyName"><br>
排序:<input id="ordered" v-model="brand.ordered" name="ordered"><br>
描述信息:<textarea rows="5" cols="20" id="description" v-model="brand.description"
name="description"></textarea><br>
状态:
<input type="radio" name="status" v-model="brand.status" value="0">禁用
<input type="radio" name="status" v-model="brand.status" value="1">启用<br>
<input id="btn" type="button" @click="submitForm()" value="提交">
</form>
</div>
<script src="js/axios-0.18.0.js"></script>
<script src="/js/vue.js"></script>
<script>
new Vue({
el: "#app",
data() {
return {
brand: {}
}
},
methods: {
submitForm() {
//发送ajax请求
var _this = this;
axios({
method: "post",
url: "http://localhost:8080/brand-demo/addServlet",
data: _this.brand
}).then(function (resp) {
// 判断响应数据是否为 success
if (resp.data == "success") {
location.href = "http://localhost:8080/brand-demo/brand.html";
}
})
}
}
})
</script>
</body>
</html>
package com.itheima.web;
import com.alibaba.fastjson.JSON;
import com.itheima.pojo.Brand;
import com.itheima.service.BrandService;
import javax.servlet.*;
import javax.servlet.http.*;
import javax.servlet.annotation.*;
import java.io.BufferedReader;
import java.io.IOException;
@WebServlet("/addServlet")
public class AddServlet extends HttpServlet {
private BrandService brandService = new BrandService();
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1. 接收数据,request.getParameter 不能接收json的数据
/* String brandName = request.getParameter("brandName");
System.out.println(brandName);*/
// 获取请求体数据
BufferedReader br = request.getReader();
String params = br.readLine();
// 将JSON字符串转为Java对象
Brand brand = JSON.parseObject(params, Brand.class);
//2. 调用service 添加
brandService.add(brand);
//3. 响应成功标识
response.getWriter().write("success");
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
运行结果及报错内容
能访问这个网页,输入数据,点提交怎么也没反应
我的解答思路和尝试过的方法
搞不懂
我想要达到的结果
把数据提交到http://localhost:8080/brand-demo/addServlet,并且成功跳转到http://localhost:8080/brand-demo/brand.html