Question

我有一个TextBox和Add Button。当我点击添加按钮。应在网格中添加值，并在行中添加删除图标。

只想使用Simple Jquery Grid。请帮助。

Answer 1

如果Grid是一个表，

看看这个：http://jsfiddle.net/hamidlab/C8TT4/

非常简单的jquery来添加和删除表中的行。 .remove()删除tr和.append()以添加新tr。

Answer 2

如果你想使用任何jquery插件，那么你可以使用jQGrid.js

[http://trirand.com/blog/jqgrid/jqgrid.html] [1]

要根据您的要求使用此网格，您可以修改它，因为它会从您的表单或任何输入字段中获取数据。

或者，如果您想使用表创建简单的客户网格，那么您可以使用代码

HTML：

<input type="text" id="inputText" />
<button id="addNew">Add New Row</button>
<table border=1 >
    <thead>
        <tr>
            <td>First Name</td>

            <td></td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>A</td>

            <td><button>Delete</button></td>
        </tr>
    </tbody>
</table>

Javascript：

function createRow(data){
    var newRow = "<tr>"+
                    "<td>"+data+"</td>"+
                    "<td><button>Delete</button></td>"+
                "/tr>";    
    return newRow;
}

$(document).ready(function(){    
    $("#addNew").on("click", function(){
        var data = $("#inputText").val();
        if(data != ""){
            var row = createRow(data);
        }
        $("table tbody").append(row);
        $("#inputText").val("");
    });
    $("table").on("click", "button", function(){
        var row = $(this).parents("tr");
        if(row){
            row.remove();
        }

    });
});

从TextBox插入Jquery简单网格

2 个答案: