使用repeater实现gridview的功能

<asp:Repeater ID="rptfindData" runat="server">
                    <HeaderTemplate>
                        <tr>
                            <td>repeater中的自增</td>
                            <td>ID</td>
                            <td>Name</td>
                            <td>Sex</td>
                            <td>operation</td>
                        </tr>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <tr>
                            <td><%# Container.ItemIndex+1 %></td>
                            <td><%#Eval("ID") %></td>
                            <td>
                                <label id="lbl-Name-<%# Container.ItemIndex+1 %>" style="display: block"><%#Eval("Name") %></label>
                                <input id="txt-Name-<%# Container.ItemIndex+1 %>" type="text" value='<%#Eval("Name") %>' style="display: none;"/>
                            </td>
                            <td>
                                <label id="lbl-Sex-<%# Container.ItemIndex+1 %>" style="display: block"> <%#Eval("Sex").ToString() == "1" ? "男" : "女" %></label>
                                <div id="div-sex-<%# Container.ItemIndex+1 %>" style="display: none">
                                    <%--<asp:RadioButton ID="male" Checked="True" GroupName="Gender" runat="server" Text="男" />
                                    <asp:RadioButton ID="female" GroupName="Gender" runat="server" Text="女" />--%>
                                    <input id="male-<%# Container.ItemIndex+1 %>" type="radio" value="1" name="gender-<%# Container.ItemIndex+1 %>" <%#Eval("Sex").ToString() == "1" ? "checked='checked'" : "" %> />男
                                    <input id="female-<%# Container.ItemIndex+1 %>" type="radio" value="2" name="gender-<%# Container.ItemIndex+1 %>" <%#Eval("Sex").ToString() == "2" ? "checked='checked'" : "" %> />女
                                </div>
                                <%--<input id="txt-Sex-<%# Container.ItemIndex+1 %>" type="text" value='<%#Eval("Sex") %>' style="display: none"/>--%>
                            </td>
                            <td>
                                <label id="lbl-update-<%# Container.ItemIndex+1 %>" style="display: block" onclick="displayText(<%# Container.ItemIndex+1 %>)">update</label>
                                <label id="lbl-save-<%# Container.ItemIndex+1 %>" style="display: none" onclick="displayLabel(<%# Container.ItemIndex+1 %>,<%#Eval("ID") %>)">save</label>
                            </td>
                        </tr>
                    </ItemTemplate>
                </asp:Repeater>
            </table>
        </div>
    </form>
</body>
</html>
<script type="text/javascript">
    function displayText(id) {
        $("#lbl-Name-" + id).css("display", "none");
        $("#txt-Name-" + id).css("display", "block");
        $("#lbl-Sex-" + id).css("display", "none");
        $("#txt-Sex-" + id).css("display", "block");
        $("#div-sex-" + id).css("display", "block");
        $("#lbl-update-" + id).css("display", "none");
        $("#lbl-save-" + id).css("display", "block");
    }
    function displayLabel(id, dataId) {
        debugger;
        $("#lbl-Name-" + id).css("display", "block");
        $("#txt-Name-" + id).css("display", "none");
        $("#lbl-Sex-" + id).css("display", "block");
        $("#txt-Sex-" + id).css("display", "none");
        $("#div-sex-" + id).css("display", "none");
        $("#lbl-update-" + id).css("display", "block");
        $("#lbl-save-" + id).css("display", "none");
        var name = $("#txt-Name-" + id).val();
//        var sexPD = $('').checked;
        //var sex;
        //if (sexPD) {
        //    sex = 1;
        //} else {
        //    sex = 2;
        //}
        var sex = $("input:radio[name='gender-" + id + "']:checked").val();
        //var sex = $("#txt-Sex-" + id).val();
        //保存数据
        $.ajax({
            url: "/GridViewDataASHX.ashx",
            type: "post",
            async: false,
            cache:false,
            data: {
                "name": name,
                "sex": sex,
                "id":dataId
            },
            success: function (data) {
                if (data > 0) {
                    alert("成功!");
                    window.location.href = window.location.href;
                } else {
                    alert("失败!");
                }
            }
        });
    }

 是否还有更好的实现方式呢?

posted @ 2015-04-15 22:19  临冰听雪丶  阅读(176)  评论(0编辑  收藏  举报