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

Question

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

我使用 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编码，所以如果有任何愚蠢的错误请见谅，提前感谢您的帮助。

Answer 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>