用ajax传前端的数据进数据库

img

img

img


用ajax传前端的数据进数据库，传不进去怎么办，变量具体怎么改呢，js方法没有错单独可以运行出来，找不到解决办法呀，

img


这里改成data:{sum:sum}
你的请求方式应该是get 因为你的服务端写的是get

以下内容部分参考ChatGPT模型：

首先，需要确定传入数据库的数据格式是否正确。可以在前端使用console.log()方法打印出传入后台的数据，确认传入的数据格式是否正确。如果传入的数据格式正确，可以考虑以下几点：

  1. 确认后台代码是否正确，是否能够正确解析前端传入的数据。可以使用后台调试工具进行调试。

  2. 确认后台接口是否开启了跨域访问权限。如果没有开启，需要在后台代码中添加相关配置。

  3. 确认前端代码中ajax请求的url是否正确，是否能够正确调用后台接口。可以在前端使用console.log()方法打印出请求的url，确认url是否正确。

下面是一个简单的例子，展示了如何使用ajax将前端数据传入后台数据库：

前端代码：

$.ajax({
    url: '/api/saveData',
    type: 'POST',
    data: {
        name: 'John',
        age: 25
    },
    success: function(response) {
        console.log(response);
    },
    error: function(error) {
        console.log(error);
    }
});

后台代码：

@RequestMapping("/api/saveData")
@ResponseBody
public String saveData(@RequestBody Map<String, Object> data) {
    String name = data.get("name").toString();
    int age = Integer.parseInt(data.get("age").toString());
    // 将数据存入数据库
    return "success";
}

在这个例子中，前端使用ajax向后台发送了一个POST请求，请求的url是/api/saveData。数据为{name: 'John', age: 25}。后台使用@RequestMapping注解对请求进行处理，@RequestBody注解表示接收前端传入的数据。后台将接收到的数据解析后，将数据存入数据库，并返回字符串“success”。如果数据存入数据库成功，前端代码中的success方法就会被调用，否则就会调用error方法。

如果我的建议对您有帮助、请点击采纳、祝您生活愉快

  • 这有个类似的问题, 你可以参考下: https://ask.csdn.net/questions/7711731
  • 我还给你找了一篇非常好的博客，你可以看看是否有帮助，链接：简单通俗的让你了解什么是ajax，即使你是小白，菜鸟也能看懂！
  • 除此之外, 这篇博客: 搜索关键字：ajax实现；点击搜索到的会添加到搜索框内，点击搜索跳转页面；中的 搜索关键字的js 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  • $(function(){
    	$("#search-window").keyup(function(){
	    	$("#search-words").html("");	
    	    var word=$(this).val();
    	    if(word!=""){
    	    	$.ajax({
        			method:"POST",
        			url:"KeyServlet",
        			data:{
        				"word":word
        			},
        			dataType:"JSON",
        			success:function(data){
        				$("#search-words").show();
	        			$(data).each(function(index){
	        				
	        				var str = '<p class="searchs" onclick="selValue(\''+this.ptitle+'\',\''+this.pid+'\')">'+this.ptitle+'</p>';
	        				
	        				$("#search-words").append(str);	
	        			});
        			}
        		})
    	    }else{
    	    	$("#search-words").hide();
    	    }
    	})
    })
    
    function selValue(obj,pid) {
    	console.log(obj);
    	$("#search-window").val(obj);
    	$("#search-pid").val(pid);
    	$("#search-words").hide();
    }

    注意：str要注意格式：如果不是数字一定要加上'' 所以要注意转义符；

    selValue（obj,pid）{}是用来点击查询到的信息直接填入搜索框内

    steptwo：后台的servlet层：KeyServlet

    package cn.trade.servlet;

import java.io.IOException;
import java.util.List;

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 cn.trade.daoimp.KeywordDaoImp;
import cn.trade.model.Keyword;
import net.sf.json.JSONArray;

/**
 * Servlet implementation class KeyServlet
 */
@WebServlet("/KeyServlet")
public class KeyServlet extends HttpServlet {
	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doPost(request, response);
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		String word = request.getParameter("word");
		
		List<Keyword> list = new KeywordDaoImp().findAll(word);
		
		/*request.setAttribute("list", list);
		request.getRequestDispatcher("keylist.jsp").forward(request, response);*/
		
		JSONArray jArray = JSONArray.fromObject(list);
		String j = jArray.toString();
		response.getWriter().write(j);
	}

}

    stepthree：进入Dao层找与输入框内文字有关的商品名

    package cn.trade.daoimp;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

import cn.trade.dao.KeywordDao;
import cn.trade.model.Keyword;
import cn.trade.util.DBUtil;

public class KeywordDaoImp implements KeywordDao {

	@Override
	public List<Keyword> findAll(String word) {
		// TODO Auto-generated method stub
		List<Keyword> list = new ArrayList<>();
		Connection conn = DBUtil.getConn();
		String sql = "SELECT pid,ptitle FROM tb_product"
				+ " WHERE ptitle like ? limit 5";
		try {
			PreparedStatement pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, "%"+word+"%");
			ResultSet rs = pstmt.executeQuery();
			while(rs.next()){
				Keyword k = new Keyword();
				k.setPid(rs.getInt("pid"));
				k.setPtitle(rs.getString("ptitle"));
				list.add(k);
			}
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		return list;
	}

}