無法通過jquery從控制器獲得響應jsp

Question

我正在從下拉列表中向控制器發送一個id（oncgange函數）。它工作正常。現在在控制器中查詢數據庫結果後存儲在arrylist中。我已經給了returntype arrylist。是好的還是有任何錯誤。請幫忙。我只想顯示第一個下拉列表中另一個基於下拉列表的選定值。 假設我選擇了水果，所以我想在jsp中填充它。

<option value="mango">Mango</option> 
<option value="pineapple">Pineapple</option> 

JSP

  <script> 
      function getScode() 
      { 
       var code = document.getElementById('code'), 
        code = code.value; 
       jQuery.ajax({ 
        type: 'POST', 
        url: 'scode.htm', 
        data: { 
         code: code 
        }, 
        success: function (html) { 
         $('#scode_data').html(html).show(); 
        } 
       }); 
       return false; 
      } 
     </script> 

      Select Genre 
      <select name="code" id="code" onchange="getScode();">   
      <option value="1">Fruit</option> 
      <option value="2">Game</option>    
      </select> 
      Under that 
     <div id="scode_data"></div> 

控制器

@RequestMapping(value="/scode", method = RequestMethod.POST) 
    public @ResponseBody ArrayList getScode(ModelMap modelMap, @RequestParam(value = "code", required = false) String code_val, HttpServletRequest request, HttpServletResponse response) 
throws ClassNotFoundException { 

     SimpleDriverDataSource dataSource = new SimpleDriverDataSource(); 
     dataSource = new dbconnection.connection().getConnection(dataSource); 
     JdbcTemplate jt = new JdbcTemplate(dataSource); 

     String sql = "SELECT * FROM cat WHERE fcode='"+code_val+"'"; 
     srs = jt.queryForRowSet(sql); 
     while (srs.next()) { 
      pojo obj2 = new pojo(); 
      obj2.setScode(srs.getString("fcode")); 
      obj2.setSname(srs.getString("fname")); 
      arraylist.add(obj2); 
     } 

     return arraylist; 
    } 

Image link of what i am getting