jquery + grails,如何将对话框中的输入数据传递给控制器

时间:2012-11-16 17:33:56

标签: java javascript html grails groovy

我是grails和jquery的新手。

我创建了一个类似于此示例的jquery对话框:http://jqueryui.com/dialog/#modal-form

打开一个对话框,输入数据,并在主页面的表格中显示数据。

在将所有条目添加到表中之后,表是动态的 我想创建一个保存按钮,它将所有数据保存到db中, 我的问题是如何将表中的所有数据传递给控制器​​,以便控制器可以持久保存数据?

这是我的gsp:

            

        <fieldset class="form">
            <h2>ReportInstance</h2>
            <table id="reportInstances" class="ui-widget ui-widget-content">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Template</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
            <button id="create_new_reportInstance">Create new Report
                Instance</button>
        </fieldset>

        <fieldset class="buttons">
            <g:submitToRemote controller="NewReport" action="saveReport"
                update="page-body" value="save" />
        </fieldset>
    </g:form>


 javascript:

           $("#dialog-form").dialog(
               {
                autoOpen : false,
                    height : 300,
                    width : 350,
                    modal : true,
                buttons : {
                 "Create an account" : function() {
                          var bValid = true;
                           allFields.removeClass("ui-state-error");
                                if (bValid) {
                                    $("#reportInstances    tbody").append(
                                    "<tr>" + "/<td>" + name.val() + "/</td>"
                                            + "/<td>" + template.val()
                                            + "/</td>" + "/<td>" + "/</tr>");

                            $(this).dialog("close");
                        }
                    },
                    Cancel : function() {
                        $(this).dialog("close");
                    }
                },
                close : function() {
                    allFields.val("").removeClass("ui-state-error");
                }
            });

    $("#create_new_reportInstance").button().click(function() {
        $("#dialog-form").dialog("open");
    });

我只想将name.val()和template.val()传递给controller

1 个答案:

答案 0 :(得分:1)

我根本不会使用submitToRemote。由于您已经在使用jQuery,因此可以通过Ajax发布:

if(bValid) {
    $.ajax({
        url: "/yourApp/newReport/saveReport",
        type: "POST",
        data: {"name": name.val(), "template": template.val()},
        success: function(data) {
            $("#reportInstances tbody").append( "" + "/" + name.val() + "/" + "/" + template.val() + "/" + "/" + "/");
            $(this).dialog("close");
        },
        error: function(xhr, textStatus, error){
           //whatever you need to do here - output errors etc.
           console.log(xhr.statusText);
           console.log(textStatus);
           console.log(error);
        }

    });
}

在您的控制器中,您将获得params.nameparams.template

另请注意控制器名称上的小写首字母 - 在Grails中,NewReportController被访问为newReport