ajax 中的错误“未捕获的 ReferenceError：未定义 responseParsedJSON”？

Posted 2023-02-19

【中文标题】ajax 中的错误“未捕获的 ReferenceError：未定义 responseParsedJSON”？

【英文标题】：Error in ajax "Uncaught ReferenceError: responseParsedJSON is not defined"?

【发布时间】：2021-07-25 01:48:28

【问题描述】：

我正在做一个项目，在这个项目中，我遇到了一个问题，即我想获得可用床位，同时检查所选病房是否已经占用床位，如果占用则仅显示可用床位，否则显示所有床位。

我使用 ajax 作为解决方案，但是我似乎收到了一个错误。

代码是：

床位和病房的FORM代码选择标签：

 <div class="form-group">
                           
                                    <div class="form-select">
                                        <select name="Ward" id="Ward" onChange="fetchAvailableBeds();">
                                    <option value="0">--Select Ward No---</option>
                                    <option value="ward1">1</option>
                                    <option value="ward2">2</option>
                                    <option value="ward3">3</option>
                                    <option value="ward4">4</option>
                                    <option value="ward5">5</option>
                                    <option value="ward6">6</option>
                                    <option value="ward7">7</option>
                                    <option value="ward8">8</option>
                                    <option value="ward9">9</option>
                                    <option value="ward10">10</option>
                                    <option value="ward11">11</option>
                                    <option value="ward12">12</option>
                                </select>
                                <span class="select-icon"><i class="zmdi zmdi-chevron-down"></i></span>
                            </div>
                                 </div>
                                 <div class="form-group">
                            
                                    <div class="form-select">
                                        <select name="bed" id="bed">     
                                    <option value="0">--Select Bed No---</option>
                                   
                                </select>

AJAX 代码：

 <script type="text/javascript">
    function fetchAvailableBeds()

    var wardNo = $("#Ward").val();
    $.ajax(
    url     : "<%=request.getContextPath()%>/FilterBeds",//Servlet Name
    data    : Ward:wardNo,
    type    : "GET",
    success : function(data, textStatus, jqXHR)
    
        var bedDetails = responseParsedJSON.bedDetails;
        if(bedDetails.length > 0)
        
            $('#bed').empty().append('<option>--Select Bed--</option>');
            for(var i=0;i<bedDetails.length;i++)
            
                $('#bed').append('<option value="'+bedDetails[i].name+'">'+bedDetails[i].id+'</option>' );
            
        
        else
        
            $('#bed').empty().append( '<option>--No Beds Available--</option>');
        

     
  );


        </script>

Servlet 代码：

@WebServlet(name = "FilterBeds", urlPatterns = "/FilterBeds")
public class FilterBeds extends HttpServlet 
 @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException 
        try (PrintWriter out = response.getWriter()) 
            BedFiltering fl= new BedFiltering();
            int wardNo = Integer.parseInt(request.getParameter("Ward"));
            List<Beds> bedlist = fl.filterBeds(wardNo);
            Gson json = new Gson();
            String BedList = json.toJson(bedlist);
            response.setContentType("text/html");
            response.getWriter().write(BedList);
            
        
    

   

DAO 类：

public List<Beds> filterBeds(int wardno) 

    //Getting all the wardnos
List<Integer> WardList = getSavedWardNumbers(wardno);

//List to hold data 
List<Beds> beddetails = new ArrayList<Beds>();
    for (int i = 1; i < 12; i++) 
        if (!WardList.contains(i)) 
            Beds bed = new Beds();
            bed.setBedNo(i);
            beddetails.add(bed);
        
    
return beddetails;


/*The method for getting ward nos*/
private List<Integer> getSavedWardNumbers(int wardno) 
 List ward = new ArrayList<>();
    
    try
       Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/hms", "root", "");
        PreparedStatement s = conn.prepareStatement("SELECT BedNo FROM bedmanagement WHERE Ward_no=? ");
        s.setInt(1, wardno);
        ResultSet rs = s.executeQuery();
        while (rs.next()) 
            Beds beds = new Beds();
            beds.setWardNo(rs.getInt("BedNo"));
            ward.add(beds);
             
    catch(SQLException e) 
    e.printStackTrace();
    
    
    return ward;

这是我的第一个ajax编码，所以如果有任何愚蠢的错误请见谅，提前感谢您的帮助。

【问题讨论】：

嗨，在success : function(data, textStatus, jqXHR) 里面做console.log(data) 看看它给了你什么。此外，您需要在访问它们之前解析 json。

console.log(data) 提供 并在使用 $.parseJSON(data) 解析它后给出错误消息“JSON 数据的第 1 行第 1 列的数据意外结束”

@Swati 在我添加 dataType: 'json' 后，每个错误都消失了，但仍然无法正常工作

而不是response.setContentType("text/html") 使用response.setContentType("application/json"); 看看它是否有效并检查console.log(data) 并检查您的服务器端以及BedList 是否具有所需的值

添加此“var respons = data var bedDetails = respons;”后对于响应而不是解析，我能够正确实现它，但是该方法似乎有一点错误，非常感谢@Swati 的帮助，非常感谢。

【参考方案1】：

感谢 swati 的帮助，我能够解决它。那么希望下面的代码可以帮助某人：

 <script type="text/javascript">
    function fetchAvailableBeds()

    var wardNo = $("#Ward").val();
    $.ajax(
    url     : "<%=request.getContextPath()%>/FilterBeds",//Servlet Name
    data    : Ward:wardNo,
    dataType: 'json',
    type    : "GET",
     success : function(data, textStatus, jqXHR)
    
        console.log(data);
        var respons = data;
        var bedDetails = respons;
        if(bedDetails.length > 0)
        
            $('#bed').empty().append('<option>--Select Bed--</option>');
            for(var i=0;i<bedDetails.length;i++)
            
                $('#bed').append('<option value="'+bedDetails[i]+'">'+bedDetails[i]+'</option>' );
            
        
        else
        
            $('#bed').empty().append( '<option>--No Beds Available--</option>');
        

     
  );



        </script>