如何从gridview C#

时间:2017-04-26 12:01:55

标签: javascript c# jquery asp.net gridview

我很难弄清楚如何从静态ID中获取值。当我点击它时,我有一些jquery将标签转换为文本框。它使用标签的(静态)id并将其转换为TextBox。 所以对于ex:Label1 => TextBox1中

我想知道我是如何仅从特定单元格中获取TextBox1的值的,因为当我尝试更新所有文本框时,它们的值来自列(ID:Label1(afspraken))比在TextBox1中。因此,当我更新时,整个列中的所有值都在单元格中。(如果不清楚,请查看代码下方的图像)

任何帮助都是受欢迎的,因为我明天需要提交这个项目,并且非常高兴能让这个工作变得有效!

代码:

C#

        protected void Button3_Click(object sender, EventArgs e)
    {
        _controller = new Controller();

        //Variablen
        string afspraak ="";
        string uitleg ="";
        string id="";
        string id1 = "";

        //Values uit uit gridview halen halen
        foreach (GridViewRow row in GridView1.Rows)
        {
            string tekst = Request.Form["TextBox1"];
            /afspraak = ((TextBox)row.FindControl("txtEditTabel")).Text;

            //Don't look at this
            uitleg = ((Label)row.FindControl("Label2")).Text;
            id = ((Label)row.FindControl("Label3")).Text;
            id1 = ((Label)row.FindControl("Label4")).Text; 
        }

        //Methode om record te bewerken
        _controller.RecordUpdatenTblAfspraken(afspraak, uitleg, Convert.ToInt32(id), Convert.ToInt32(id1));

        //Pagina refreshen
        Response.Redirect(Request.RawUrl);

    }

ASP.NET GRIDVIEW

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333" GridLines="None" Width="1000px" HorizontalAlign="Center" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" OnRowDeleting="GridView1_RowDeleting" DataKeyNames="IDAfspraken" ClientIDMode="Static">
        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        <Columns>
            <asp:TemplateField HeaderText="IDAfspraken">
                <ItemTemplate>
                    <asp:Label ID="Label4" runat="server" Text='<%# Eval("IDAfspraken") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Afspraak">
                <ItemTemplate>
                    <asp:Label ID="Label1" CssClass="editable" runat="server" Text='<%# Eval("Afspraak") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Uitleg">
                <ItemTemplate>
                    <asp:Label ID="Label2" CssClass="editable" runat="server" Text='<%# Eval("Uitleg") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Categorie">
                <ItemTemplate>
                    <asp:Label ID="Label3" CssClass="editable" runat="server" Text='<%# Eval("IDCategorieën") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Bewerken">
                <ItemTemplate>
                    <asp:Button ID="Button3" runat="server" Text="Bewerken" ForeColor="DeepSkyBlue" Font-Bold="true" OnClick="Button3_Click"/>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:CommandField ButtonType="Button" ShowDeleteButton="True" />
        </Columns>
        <EditRowStyle BackColor="#999999" />
        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
        <SortedAscendingCellStyle BackColor="#E9E7E2" />
        <SortedAscendingHeaderStyle BackColor="#506C8C" />
        <SortedDescendingCellStyle BackColor="#FFFDF8" />
        <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    </asp:GridView>

JAVASCRIPT

$(function () {
//Loop through all Labels with class 'editable'.
$(".editable").each(function () {
    //Reference the Label.
    var label = $(this);

    //Add a TextBox next to the Label.
    label.after("<input type = 'text' style = 'display:none' />");

    //Reference the TextBox.
    var textbox = $(this).next();

    //Set the name attribute of the TextBox.
    var id = this.id.split('_')[this.id.split('_').length - 1];
    textbox[0].name = id.replace("Label","Textbox"); 

    //Assign the value of Label to TextBox.
    textbox.val(label.html());

    //When Label is clicked, hide Label and show TextBox.
    label.click(function () {
        $(this).hide();
        $(this).next().show();
    });

    //When focus is lost from TextBox, hide TextBox and show Label.
    textbox.focusout(function () {
        $(this).hide();
        $(this).prev().html($(this).val());
        $(this).prev().show();
    });
});

enter image description here

1 个答案:

答案 0 :(得分:1)

而不是使用Jquery你应该使用gridview的内置编辑属性。 这是一个示例代码 Aspx页面

<asp:GridView ID="gridmeta" runat="server" AutoGenerateColumns="False" OnRowEditing="gridmeta_RowEditing" OnRowCancelingEdit="gridmeta_RowCancelingEdit" OnRowUpdating="gridmeta_RowUpdating"  DataKeyNames="metaid">
      <asp:TemplateField HeaderText="Content">
           <ItemTemplate>
              <label><%#Eval("metacontent") %></label>
                </ItemTemplate>
                <EditItemTemplate>
                    <asp:TextBox TextMode="MultiLine" Rows="3" Columns="60" runat="server" ID="txtcontent" Text='<%#Eval("metacontent") %>'></asp:TextBox>
                </EditItemTemplate>
            </asp:TemplateField>
            <asp:CommandField ShowEditButton="true" />
        </Columns>
    </asp:GridView>

CS文件

protected void gridmeta_RowEditing(object sender, GridViewEditEventArgs e)
{
    gridmeta.EditIndex = e.NewEditIndex;
    fillGrid();
}


protected void gridmeta_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{
    gridmeta.EditIndex = -1;
    fillGrid();
}


protected void gridmeta_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
    int index;
    index = e.RowIndex;
    int metaid = Convert.ToInt32(gridmeta.DataKeys[index].Value.ToString());
    string content = ((TextBox)gridmeta.Rows[index].FindControl("txtcontent")).Text;
    //Your Code to update an entry based on id in this case metaid
}

如果您想要更改多个列值,只需将edititemtemplate放入其中,然后在gridmeta_RowUpdating函数中访问它们。