jQuery，AJAX：弹出 jQuery 对话框，将参数传递给 html 表单答案

【问题标题】：jQuery, AJAX: Pop up jQuery dialog with passed parameter to html formjQuery，AJAX：弹出 jQuery 对话框，将参数传递给 html 表单
【发布时间】：2014-08-05 13:29:14
【问题描述】：

我可以弹出一个带有空 html 表单的 jQuery 对话框。

但是现在，我想弹出一个带有已传递参数的 html 表单的 jQuery 对话框。

代码：

触发 jQuery 对话框的按钮（JSP 代码）：

<input id="update_button" type="button" value="Edit" onclick="UpdateFunction('<%=category.getTag()%>');" />

对话框脚本：

<head>
    <script>
        function UpdateFunction(tag) {
            alert(tag); // I can get this parameter correctly
            $( "#update_category" ).dialog( "open" );
        }

        $(document).ready(function(){
            $( "#update_category" ).dialog({
                autoOpen: false,
                width: 600
            });
        });
    </script>
</head>

HTML 表单代码（它最初在“表单操作”中涉及 GAE 代码，我已将其删除以明确此问题）：

<body>
    <%
        String categoryTag = request.getParameter("categoryTag");
        // curCategory will be derived from categoryTag
    %>
    <div id="update_category">
        <form id="categoryForm" name="categoryForm">
            <table>
                <tr>
                    <td>Tag : </td>
                    <td><input type="text" name="categoryTag" style="color:#888;" value="<%= curCategory.getTag() %>" readonly /></td>
                </tr>

                <tr>
                    <td>Title : </td>
                    <td><input type="text" name="categoryTitle" value="<%=  curCategory.getTitle() %>" /></td>
                </tr>
            </table>
        </form>
    </div>
</body>

问题是：

目前body中的代码会先执行，所以后面的“String categoryTag”会为null

<%
    String categoryTag = request.getParameter("categoryTag");
    // curCategory will be derived from categoryTag
%>

而且后面会导致 NullPointerException。

那么我怎样才能弹出一个带有传递参数表单的 jQuery 对话框呢？

提前致谢。

埃里克

【问题讨论】：

如果我理解正确，您需要将动态值传递给对话框吗？
@san krish 是的，我需要将动态值传递给对话框
为什么不触发点击功能，让表单加载动态值
@san krish 如何在对话框打开时动态加载表单？
我的意思是打开对话框，只有当您在表单中有值时。所以点击触发它

标签： jquery ajax jsp parameter-passing jquery-dialog

【解决方案1】：

而不是调用单独的.dialog( "open" ) 函数。你可以写成，

<script>
        function UpdateFunction(tag) {
            alert(tag); // I can get this parameter correctly
            var dialog_text=tag;
            $("#update_category").empty();
            $("#update_category").append(dialog_text);
            $( "#update_category" ).dialog({
                autoOpen: false,
                width: 600 
                //Handle your button events for the dialog.
            });
        }
    </script>

【讨论】：