ASP.NET如何將javascript添加到動態gridview文本框（ItemTemplate）

我有一個帶有動態文本框和DDL創建的gridview。ASP.NET如何將javascript添加到動態gridview文本框（ItemTemplate）

在文本框出來的網格我已成功地應用於我想的JavaScript的，它工作正常（記住我是一個總的javascript小白：S）

所以生病後我的代碼用一個簡單的例子只有一個文本框，但它的罰款，因爲我們只需要一個:)

HTML代碼：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication4.WebForm1" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div style="height: 337px"> 
      <asp:GridView ID="Gridview1" runat="server" ShowFooter="true" AutoGenerateColumns="false" OnSelectedIndexChanged="Gridview1_SelectedIndexChanged"> 
       <Columns> 
        <asp:BoundField DataField="RowNumber" HeaderText="Row Number" /> 
        <asp:TemplateField HeaderText="Header 1"> 
         <ItemTemplate> 
          <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
         </ItemTemplate> 
        </asp:TemplateField> 

        <asp:TemplateField > 

         <FooterStyle HorizontalAlign="Right" /> 
         <FooterTemplate> 
          <asp:Button ID="ButtonAdd" runat="server" Text="Add New Row" 
           OnClick="ButtonAdd_Click" /> 
         </FooterTemplate> 
        </asp:TemplateField> 
       </Columns> 
      </asp:GridView> 


      <br /> 

      <asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" AutoPostBack="True"> 
       <asp:ListItem>opt1</asp:ListItem> 
       <asp:ListItem>opt2</asp:ListItem> 
      </asp:DropDownList> 

      <br /> 
      <br /> 


      <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 



     </div> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/> 
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <style type="text/css"> 
     body { 
      font-size: 12px; 
     } 
    </style> 
    <script type="text/javascript"> 
     $(function() { 
      $("#<%=TextBox2.ClientID %>").datepicker({ 
       showButtonPanel: true 
      }); 
     }); 
    </script> 
    </form> 
</body> 
</html>

C＃代碼

namespace WebApplication4 
{ 
public partial class WebForm1 : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     if (!Page.IsPostBack) 
     { 
      setInitialRow(); 
     } 
    } 




    protected void Gridview1_SelectedIndexChanged(object sender, EventArgs e) 
    { 

    } 





    protected void ButtonAdd_Click(object sender, EventArgs e) 
    { 
     AddNewRowToGrid(); 
    } 





    private void setInitialRow() 
    { 
     DataTable dt = new DataTable(); 
     DataRow dr = null; 

     dt.Columns.Add(new DataColumn("RowNumber", typeof(string))); 
     dt.Columns.Add(new DataColumn("Column1", typeof(string))); 


     dr = dt.NewRow(); 
     dr["RowNumber"] = 1; 
     dr["Column1"] = string.Empty; 

     dt.Rows.Add(dr); 


     ViewState["CurrentTable"] = dt; 
     Gridview1.DataSource = dt; 
     Gridview1.DataBind(); 
    } 







    private void AddNewRowToGrid() 
    { 
     int rowIndex = 0; 

     if (ViewState["CurrentTable"] != null) 
     { 
      DataTable dtCurrentTable = (DataTable)ViewState["CurrentTable"]; 
      DataRow drCurrentRow = null; 
      if (dtCurrentTable.Rows.Count > 0) 
      { 
       for (int i = 1; i <= dtCurrentTable.Rows.Count; i++) 
       { 

        TextBox box1 = (TextBox)Gridview1.Rows[rowIndex].Cells[1].FindControl("TextBox1"); 


        drCurrentRow = dtCurrentTable.NewRow(); 
        drCurrentRow["RowNumber"] = i + 1; 


        dtCurrentTable.Rows[i - 1]["Column1"] = box1.Text; 



        rowIndex++; 

       } 

       dtCurrentTable.Rows.Add(drCurrentRow); 
       ViewState["CurrentTable"] = dtCurrentTable; 

       Gridview1.DataSource = dtCurrentTable; 
       Gridview1.DataBind(); 

      } 
      else 
      { 
       Response.Write("Viewstate is null"); 
      } 
      SetPreviousData(); 
     } 
    } 






    private void SetPreviousData() 
    { 

     int rowIndex = 0; 

     if (ViewState["CurrentTable"] != null) 
     { 

      DataTable dt = (DataTable)ViewState["CurrentTable"]; 

      if (dt.Rows.Count > 0) 
      { 

       for (int i = 0; i < dt.Rows.Count; i++) 
       { 
        TextBox box1 = (TextBox)Gridview1.Rows[rowIndex].Cells[1].FindControl("TextBox1"); 


        box1.Text = dt.Rows[i]["Column1"].ToString(); 

        rowIndex++; 
       } 
      } 
     } 
    } 

    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 
    { 
     SetPreviousData(); 
     if (ViewState["CurrentTable"] != null) 
     { 

      DataTable dt = (DataTable)ViewState["CurrentTable"]; 

      if (dt.Rows.Count > 0) 
      { 
       TextBox box1 = (TextBox)Gridview1.Rows[(dt.Rows.Count - 1)].Cells[1].FindControl("TextBox1"); 
       box1.Text = DropDownList1.SelectedValue; 
      } 
     } 

    } 
} 
}

我想給定的JavaScript應用到由GridView控件創建的文本框...

謝謝！：d

來源

2016-01-19 Ml Ck

更改jQuery的功能，以便選擇把所有的文本框：

$("input[type=text]").datepicker({ 
      showButtonPanel: true 
     });

編輯：

設置一個類名要應用腳本的文本框：

<asp:TextBox CssClass="myclass" runat="server"></asp:TextBox>

然後用這個選擇器應用腳本代碼：

$(".myclass").datepicker({ 
     showButtonPanel: true 
    });

來源

2016-01-19 11:08:14 anmarti

可悲的是我想要一個...... :( –

好的。請看編輯的答案。 – anmarti

謝謝！ –

讓ClientIDMode屬性爲靜態

ClientIDMode="Static"

在瀏覽器中檢查調試器選項的問題

來源

2016-01-19 10:57:26 Shankaranand

我改變了它，但仍:(我想是會發生將textbox2發生到文本框1！ –

ASP.NET如何將javascript添加到動態gridview文本框（ItemTemplate）

回答

相關問題