Question

对于所有Web开发我都是新手，我正在努力寻找所需的东西。我正在使用springboot。

我的期望： 用户将打开一个页面，填写表单详细信息，单击“提交”按钮，然后重定向到新页面。表单信息将存储在哈希图中，并在我的后端使用。

现实：用户打开页面，填写表单详细信息，单击“提交”按钮，但不会重定向到新页面。尽管如此，信息仍存储在哈希图中。

HTML：

<div class="container" ng-app="app">
        <h1>Configurador de Plugin</h1>
            <div ng-controller = "plugins">
            <form>
                <div class="form-group">
                    <label>Database Details:</label> 
                    <input type="text" class="form-control" id="hostname" placeholder="Informe o Endereço do Servidor" ng-model="hostname">
                    <input type="text" class="form-control" id="port" placeholder="Informe a porta" ng-model="port">
                    <input type="text" class="form-control" id="username" placeholder="Informe o usuário" ng-model="userdb">
                    <input type="text" class="form-control" id="userpass" placeholder="Informe a senha" ng-model="userpass">
                    <input type="text" class="form-control" id="database" placeholder="Informe qual o banco de dados" ng-model="database">
                <button ng-click="validar()" type="submit" class="btn btn-default">Search</button>
                <div ng-show="visivel"> 


                    <p>{{valor}}</p>
                </div>  
            </form>
            <div>Make a choice</h3>
            </div>
            <div class="radio">
                <label><input ng-model="plugin.Name" value="test" type="radio" name="Test">Test</label></div>
            <div class="radio">
                <label><input ng-model="plugin.Name" value="v2" type="radio" name="V2">V2</label></div>
            <div class="radio">
                <label><input ng-model="plugin.Name" value="v1" type="radio" name="V1" >V1</label></div>
            Texto:
            <p>{{plugin.Name}}</p>
            <br>
            <button ng-click="sendForm()" type="submit" class="btn btn-default">Search</button>

        </div>
    </div>

JS：

app.controller('plugins', function($scope, $http, $location) {
    $scope.validar = function(){
        $scope.visivel = true;
        $scope.valor = $scope.hostname,
        console.log($scope.hostname)
    }

    $scope.enviarForm = function(){

        var url = $location.url() + "test";

        var config = 
        {
                headers : 
                {
                    'Content-Type': 'application/json;charset=utf-8;'
                }
        }
        console.log($scope.hostname);
        var data = 
        {
                hostname: $scope.hostname,
                port: $scope.port,
                username: $scope.username,
                userpass: $scope.userpass,
                database: $scope.database
        };


        $http.post(url, data, config).then(function (response) 
                {
            $scope.postResultMessage = "Sucess!";
        }, 
        function (response) {
            $scope.postResultMessage = "Fail!";
        });

    }
});

控制器：

@RequestMapping("/test")
    public ModelAndView CadastroEnotas(@RequestBody HashMap<String, Object> data) {
        ModelAndView modelAndView = new ModelAndView("newPage");
        modelAndView.addAllObjects(data);
        return modelAndView;
    }

所以，我的期望是，上面的Controller会将用户发送到newPage，但是不会。

我正在谷歌搜索，但是我可能会误解ModelAndView的概念，或者可能是如何在我的js上执行该函数...

我认为最接近我要查找的内容描述如下：angular event success when submit form it opens popup，但我无法使其正常工作。有人可以指出我在做什么吗？

Answer 1

可能使用redirect。

ModelAndView modelAndView =  new ModelAndView("redirect:/newPage.htm");
modelAndView.addAllObjects(data);
return modelAndView;

或在发布请求后尝试重定向：$location.path('/newPage')。

请检查以下内容：Redirects

Spring Boot：传递哈希图并打开新页面

1 个答案: