0

基本上我有一个 html 表，其中包含来自数据库（MySQL）的一堆数据。

我希望能够按下链接并让给定的表格行向下滑动以扩展到编辑区域。

我将使用 Ajax 使用数据库中的详细数据填充该编辑空间。

所以这将是我的桌子：

<table> 
    <tr> 
        <th>ID</th> 
        <th>Name</th> 
        <th>Value</th> 
        <th>Edit</th> 
    </tr> 
    <tr> 
        <td>1</td> 
        <td>House</td> 
        <td>5000</td> 
        <td><a href="">Edit</a></td> 
    </tr> 
    <tr> 
        <td>2</td> 
        <td>Dog</td> 
        <td>2000</td> 
        <td><a href="">Edit</a></td> 
    </tr> 
    <tr> 
        <td>3</td> 
        <td>Cat</td> 
        <td>1000</td> 
        <td><a href="">Edit</a></td> 
    </tr> 
</table>

如果我想使用 Ajax 更改表格的一整行，我不能只在 tr 标记周围放置一个 div，因为那是行不通的。我只需要一个 div 围绕我的所有 td 标签。我真的只是想要一个正常的 for 出现在没有行分隔的表格行中，有点像这种风格：

<table> 
    <tr> 
        <th>ID</th> 
        <th>Name</th> 
        <th>Value</th> 
        <th>Edit</th> 
    </tr> 
    <tr> 
        <td colspan="4"> 
            <div id="row_1"> 
                <form method="post" action="" > 
                <input type="hidden" name="ID" value="1"> 
                    <table> 
                        <tr> 
                            <td>Name</td> 
                            <td>
                                <input type="text" name="Name" value="House" />
                            </td> 
                        </tr> 
                        <tr> 
                            <td>Value</td> 
                            <td>
                                <input type="text" name="Value" value="5000" />
                            </td> 
                        </tr> 
                        <tr> 
                            <td colspan="2">
                                <input type="submit" />
                            </td> 
                        </tr> 
                    </table> 
                </form> 
            </div> 
        </td>
    </tr>
    <tr> 
        <td><div id="row_2_id">2</div></td> 
        <td><div id="row_2_name">Dog</div></td> 
        <td><div id="row_2_value">2000</div></td> 
        <td><div id="row_2_edit"><a href="">Edit</a></div></td> 
    </tr> 
    <tr> 
        <td><div id="row_3_id">3</div></td> 
        <td><div id="row_3_name">Cat</div></td> 
        <td><div id="row_3_value">1000</div></td> 
        <td><div id="row_3_edit"><a href="">Edit</a></div></td> 
    </tr> 
</table>

我已经对如何做整个滑动的事情有了一个想法。但我遇到的困难是使用 ajax 替换整行表格。任何人都知道要做什么，在哪里放置 div 以处理整个业务。

4

1 回答 1

1

不要使用表格。使用 Divs。使用 jQuery。

$("#myButton").click(function(){

            var dataString = "yourparameters"

            $.ajax({
            type: "GET",
            dataType: "html",
            cache: false,
            url: "yourServlet", 
            data: dataString, 
            success: function(data) {
                $("#yourDiv").html(data);   
                $("#yourDiv").show(); //assumes it was hidden before
                }
            });
        }

});
于 2010-07-14T15:27:45.023 回答