контроллер не вызывается из jquery / ajax для создания динамического выпадающего - PullRequest
Новая
       1

контроллер не вызывается из jquery / ajax для создания динамического выпадающего

0 голосов
/ 21 мая 2018

Это мой контроллер:

Я пытаюсь создать динамический выпадающий список. В моем коде я пытаюсь вызвать метод моего контроллера, но он не вызывается. 

    @Controller
    @RequestMapping("/data")
    public class DataController {


        @Autowired
        private DataServiceInterface service;

        public DataController() {
            System.out.println("Inside Data Controller");
        }

        @GetMapping("/index")
        public String homePage(Data data,Model map)
        {
            System.out.println("in home");
            List<String> states = service.getStatesType();
            Collections.sort(states);
            map.addAttribute("states", states);
            return "data/home";
        }



        @RequestMapping(value = "/districts", method = RequestMethod.GET)
        public @ResponseBody List<String> districtList(@RequestParam(value = "statesId", required = true) String state,Model map)
        {
            System.out.println("In district list");
            List<District> district=service.getDisticts(state);
            List<String> newDistrict=new ArrayList<String>();
            for (District dist: district) {
                System.out.println(dist.toString());
                newDistrict.add(dist.toString());
            }

            Collections.sort(newDistrict);
            map.addAttribute("districtsName", newDistrict);
            return newDistrict;
        }



    }

Это мой взгляд:

Здесь я написал js для перехода к методу контроллера, но он не работает.Вы можете сослаться на этот javascript, с которого я ссылался http://www.rockhoppertech.com/blog/spring-mvc-3-cascading-selects-using-jquery/ 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
     <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %>
    <%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href='<spring:url value="/bootstrap/css/bootstrap.min.css"></spring:url>'>
<link rel="stylesheet" href='<spring:url value="/jquery/jquery-ui.css"></spring:url>'>
<script type="text/javascript" src='<spring:url value="/assets/js/jquery-1.10.2.min.js"></spring:url>'></script>
<script type="text/javascript" src='<spring:url value="/jquery/jquery-ui.js"></spring:url>'></script>
<script type="text/javascript" src='<spring:url value="/resources/jquery.js"></spring:url>'></script>
<script>
$(function() {
      $( "#datepicker" ).datepicker({  maxDate: -1 });
     });
</script>

<spring:url var="findStateCitiesURL" value="/data/districts" />
<script>
$(document).ready(function() { 
    $('#states').change(
        function() {
            $.getJSON('${findStateCitiesURL}', {
                stateName : $(this).val(),
                ajax : 'true'
            }, function(data) {
                var html = '<option value="">Select District</option>';
                var len = data.length;
                for ( var i = 0; i < len; i++) {
                    html += '<option value="' + data[i].name + '">'
                            + data[i].name + '</option>';
                }
                html += '</option>';

                $('#district').html(html);
            });
        });
});
</script>


</head>


<style>

#success_message{ display: none;}

</style>
<body>
<div class="jumbotron text-center">
  <h1>AWS Utility</h1>      
</div>
<div class="container">



    <form:form modelAttribute="data" cssClass="well form-horizontal" method="post" >
<fieldset>

<!-- Form Name -->

<!-- Text input-->

 <div class="form-group"> 
  <label class="col-md-4 control-label">State</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
        <form:select path="states.name"  class="form-control selectpicker" id="states" name="states"   title="Select State">
        <form:option  value="Select State" />
         <form:options  items="${states}"/> 
         </form:select>

  </div>
</div>
</div>



 <%--  <div class="form-group"> 
  <label class="col-md-4 control-label">State</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
        <form:select path="states.name"  class="form-control selectpicker" id="states"  title="Select State">
        <form:option value="Select State" />
         <form:options items="${states}"/> 
         </form:select>
  </div>
</div>
</div> --%>
<!-- Text input-->

<div class="form-group"> 
  <label class="col-md-4 control-label">District</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
        <form:select path="states.name"  class="form-control selectpicker" id="district" name="district"  >
        <form:option value="Select District" />
         </form:select>
  </div>
</div>
</div>

<div class="form-group"> 
  <label class="col-md-4 control-label">Station</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
    <select name="District" class="form-control selectpicker">
      <option value="">Select Station</option>
    </select>
  </div>
</div>
</div>


<div class="form-group">
  <label class="col-md-4 control-label">Date</label>  
  <div class="col-md-4 inputGroupContainer">
  <div class="input-group">
  <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
  <input  id="datepicker" placeholder="Select date" class="form-control"  type="text">
    </div>
  </div>
</div>

<!-- Text input-->

<div class="form-group"> 
  <label class="col-md-4 control-label">Hours</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
    <select name="Hour" class="form-control selectpicker">
      <option value="">Select Hours</option>
    </select>
  </div>
</div>
</div>


<div class="form-group"> 
  <label class="col-md-4 control-label">Minutes</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
    <select name="Minutes" class="form-control selectpicker">
      <option value="">Select Minutes</option>
    </select>
  </div>
</div>
</div>


<!-- Select Basic -->

<!-- Success message -->
<div class="alert alert-success" role="alert" id="success_message">Success <i class="glyphicon glyphicon-thumbs-up"></i> Success!.</div>

<!-- Button -->
<div class="form-group">
  <label class="col-md-4 control-label"></label>
  <div class="col-md-4"><br>
    &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button type="submit" class="btn btn-warning" >&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbspVIEW <span class="glyphicon glyphicon-send"></span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</button>
  <button type="submit" class="btn btn-success" >&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbspDownload <span class="glyphicon glyphicon-download"></span>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</button>
  </div>
</div>


</fieldset>
</form:form>
</div>
    </div><!-- /.container -->
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...