Question

我想实现一个对话框，一旦我点击一个表格行就会打开。基本上想要通过表格行编辑数据库。表内容存储在数据库中并从那里获取。如果我要编辑该行，那么数据库也应该自动更新。当我点击该行然后对话框将从行中获取一些特定的单元格，我将修改它或删除该行，结果应立即在表格中可见。我想通过jquery，ajax来做。打开对话框后，ajax应该调用servlet并修改数据库。请同样给出代码。

<fieldset id ="allTweets">

                    <table cellspacing="20" class ="tweetTable"  >
                    <caption>Tweets</caption>
            <%
                while(rs.next()){
            %>
                    <tr id="ForChangingTweet">
                        <td><%=rs.getString(1)%></td>
                        <td><%=rs.getString(2)%></td>
                        <td><%=rs.getString(3)%></td>
                    </tr>

            <%
                }
            %>
                </table>
                </fieldset>
    Here is my jquery
    $('#ForChangingTweet').click(function ()
                    {
                        $("#dialog").dialog({
                            autoOpen: true,
                            modal: true,
                            width: 600,
                            height: 300,
                                            resizable: false,
                            buttons: {
                                "Yeah!": function() {
                                    $(this).dialog("close");
                                },
                                "Sure, Why Not": function() {
                                    $(this).dialog("close");
                                }
                                            }
                        });

                        $.ajax({

                            type: "post",
                            url: "ChangeTweets", 
                            data: {
                                notifyidd: $(this).attr("id")


                            },
                            error : function(){ 
                                alert('Error'); 
                            },
                            success: function(msg){      

                                    alert('Success'); 

                            }

                        });
                    });

我还添加了一些js文件

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>

每行最后两个是我的目标

Answer 1

首先你应该改变

<tr id="ForChangingTweet">

到

<tr class="ForChangingTweet">

并使用$（'。ForChangingTweet'）获取tr。因为$（'＃ForChangingTweet'）只能在dom中获得一个id。

Answer 2

要使用jquery对话框将数据发送到servlet，您可以使用ajax尝试这样的事情，

var $dialog = $('#ForChangingTweet'),
    width = 500, 
    height = 350;

$dialog.dialog({
    autoOpen: false,
    resizable: false,
    width: width,
    height: height      
});

设置对话框属性如上

// handles submit
    $dialog.on('submit', 'form', function(e){
        e.preventDefault();
        $.ajax({
            type: "POST",
            url:  "url here",
            data: $(this).serialize(),
            success: function(res) {
                $dialog.dialog('close');
            }
        });
    });

使用您的servlet获取数据并将其插入数据库。你可以在这里找到一个密切相关的问题，

how to change data at DB from jquery-ui dialog?

希望这会有所帮助!!

单击表格行并编辑后如何打开对话框

2 个答案: