package com.itheima.web;
import com.alibaba.fastjson.JSON;
import com.itheima.pojo.Brand;
import com.itheima.service.BrandService;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
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);*/
//1. 获取请求体（接受数据）
BufferedReader br = request.getReader();
String params = br.readLine();
//2. 将JSON字符串转为Java对象
Brand brand = JSON.parseObject(params, Brand.class);
//3. 调用service添加
brandService.add(brand);
//4. 响应成功标识
response.getWriter().write("success");
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>添加品牌</title>
</head>
<body>
<h3>添加品牌</h3>
<form action="" method="post">
品牌名称：<input id="brandName" name="brandName"><br>
企业名称：<input id="companyName" name="companyName"><br>
排序：<input id="ordered" name="ordered"><br>
描述信息：<textarea rows="5" cols="20" id="description" name="description"></textarea><br>
状态：
<input type="radio" name="status" value="0">禁用
<input type="radio" name="status" value="1">启用<br>
<input type="button" id="btn" value="提交">
</form>
<script src="js/axios-0.18.0.js"></script>
<script>
//1. 因为要用异步响应所以没用提交按钮，提交按钮是同步的
// 给按钮绑定单击事件
document.getElementById("btn").onclick = function () {
// 将表单数据转为json
let formData = {
brandName:"",
companyName:"",
ordered:"",
description:"",
status:"",
};
// 获取表单数据
let brandName = document.getElementById("brandName").value;
//设置数据
formData.brandName = brandName;
// 获取表单数据
let companyName = document.getElementById("companyName").value;
//设置数据
formData.companyName = companyName;
// 获取表单数据
let ordered = document.getElementById("ordered").value;
//设置数据
formData.ordered = ordered;
// 获取表单数据
let description = document.getElementById("description").value;
//设置数据
formData.description = description;
// 获取表单数据
let status = document.getElementsByName("status");
//遍历status里的数据 1 0
//使用checked那个被选中checked就为true
//然后进入if把数据再设置给formData.status
for (let i = 0; i < status.length; i++) {
if (status[i].checked){
formData.status = status[i].value;
}
}
//然后把所有设置过的数据输出
console.log(formData);//console.log:它可以接受一个或多个参数，将它们连接起来输出
//2. 发送ajax请求
axios({
method:"post",
url:"http://localhost:8080/brand-demo/addServlet",
data:formData
}).then(function (resp) {
//判断响应数据是否为success
if (resp.data == "success"){
// 重新查询
location.href = "http://localhost:8080/brand-demo/brand.html";
}
})
}
</script>
</body>
</html>
标签：status,formData,新增,品牌,案例,brandName,let,import,数据 From： https://www.cnblogs.com/Karl-hut/p/17523776.html