Como adicionar dinamicamente linhas a uma tabela em ASP.NET?
Então, hoje eu comecei a aprender ASP.NET. Infelizmente eu não encontrei nenhum bom tutoriais on-line, e eu não posso dar ao luxo de comprar livros no momento, então eu tive que criar um ASP.NET aplicação web no Visual Studio 2010 e apenas brincar com o padrão de configuração do projeto.
Até agora, eis o que tenho por defeito.aspx:<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Project Management</title>
</head>
<body>
<div style="padding-bottom:10px;"> Project Management System</div>
<div> <table style="width:100%;">
<tr>
<td>Name</td>
<td>Task</td>
<td>Hours</td>
</tr>
</table></div>
</body>
</html>
criei uma tabela simples com a linha de cabeçalho já lá dentro. Através de um script C#, Eu quero ser capaz de adicionar linhas dinamicamente a esta tabela HTML. Será esta a forma correcta de pensar em ASP.NET¶ se sim, como posso fazer isso? Tenho certeza que vou precisar de um botão "Adicionar", que adiciona uma nova linha para a tabela, com campos editáveis, e um botão "enviar" que adiciona algumas coisas a um banco de dados.
Basicamente, um resumo de como isto é feito seria muito útil. Também se alguém sabe qualquer tutoriais bons ou sites que podem me ajudar com coisas como esta, por favor, me avise. Obrigado antecipadamente.9 answers
<asp:Table ID="myTable" runat="server" Width="100%">
<asp:TableRow>
<asp:TableCell>Name</asp:TableCell>
<asp:TableCell>Task</asp:TableCell>
<asp:TableCell>Hours</asp:TableCell>
</asp:TableRow>
</asp:Table>
Você pode então adicionar linhas como você precisa no script, criando-as e adicionando-as ao myTable.Linhas
TableRow row = new TableRow();
TableCell cell1 = new TableCell();
cell1.Text = "blah blah blah";
row.Cells.Add(cell1);
myTable.Rows.Add(row);
EDIT-também, se você quiser aprender sem comprar livros aqui são alguns sites que você absolutamente precisa se familiarizar com:
Blog de Scott Guthrie
4 Pessoal de Rolla
MSDN
projecto de código Asp.Net
dê uma olhada no asp.net tutoriais oficiais do site e em 4GuysFromRolla site
ASP.NET a WebForms não funciona assim. O que você tem acima é apenas HTML normal, então ASP.NET não lhe vai dar nenhuma facilidade para adicionar / remover itens. O que você vai querer fazer é usar um controle de repetidores, ou possivelmente uma visão geral. Estes controlos estarão disponíveis no código atrás. Por exemplo, o repetidor exporia uma propriedade de "itens" sobre a qual você pode adicionar novos itens (linhas). In the code-front (the .ficheiro aspx) você iria fornecer um 'ItemTemplate' que evita o que as linhas de corpo iria parece que sim. Existem muitos tutoriais na web para repetidores, por isso sugiro que o google obtenha mais informações.
public partial class result : System.Web.UI.Page
{
static DataTable table1 = new DataTable("Shashank");
static DataSet set = new DataSet("office");
protected void Page_Load(object sender, EventArgs e)
{
lblEmployeeNumber.Text = HttpContext.Current.Request.Form["txtEmployeeNumber"];
lblFirstName.Text = Request.Form["txtFirstName"];
lblLastName.Text = Request.Form["txtLastName"];
lblTitle.Text = Request.Form["txtTitle"];
Int32 Rcount = Convert.ToInt32(table1.Rows.Count);
if (Rcount == 0)
{
table1.Columns.Add("ID");
table1.Columns.Add("FName");
table1.Columns.Add("LName");
table1.Columns.Add("Title");
table1.Rows.Add(lblEmployeeNumber.Text, lblFirstName.Text, lblLastName.Text, lblTitle.Text);
set.Tables.Add(table1);
}
else
{
if (lblEmployeeNumber.Text != "")
{
DataRow dr = table1.NewRow();
dr["ID"] = lblEmployeeNumber.Text;
dr["FName"] = lblFirstName.Text;
dr["LName"] = lblLastName.Text;
dr["Title"] = lblTitle.Text;
table1.Rows.Add(dr);
}
}
gvrEmp.DataSource = set;
gvrEmp.DataBind();
}
}
Tens de te familiarizar com a ideia do Código "lado do servidor" vs. "lado do cliente". Já passou muito tempo desde que eu tive que começar, mas você pode querer começar com alguns dos tutoriais de vídeo em {[[2]} http://www.asp.net.
Duas coisas para notar: se você está usando VS2010 você realmente tem dois frameworks diferentes para escolher para ASP.NET: WebForms e ASP.NET MVC2. WebForms é o antigo modo legado, MVC2 está sendo posicionado pelo MS como uma alternativa não um substituto para WebForms, mas vamos ver como a comunidade vai lidar com isso nos próximos anos. De qualquer forma, não se esqueça de prestar atenção a qual um dado tutorial está falando.
Pode usar a tabela asp:no seu formulário web e construí-la através do código:
Http://msdn.microsoft.com/en-us/library/7bewx260.aspx
Também, Confira asp.net para tutoriais e assim.
Criado dinamicamente para uma linha numa tabela
Ver abaixo a ligação
Http://msdn.microsoft.com/en-us/library/7bewx260 (V = vs. 100).aspx
Ligação para adicionar através da JS https://www.youtube.com/watch?v=idyyQ23joy0
Por favor, Veja também a ligação abaixo. Isto ajudá-lo-ia a adicionar as linhas dinamicamente na altura: https://www.lynda.com/C-tutorials/Adding-data-HTML-tables-runtime/161815/366843-4.html
<html>
<head>
<title>Row Click</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
function test(){
alert('test');
}
$(document).ready(function(){
var row='<tr onclick="test()"><td >Value 4</td><td>Value 5</td><td>Value 6</td></tr>';
$("#myTable").append(row);
});
</script>
</head>
<table id="myTable" >
<th>Column 1</th><th>Column 2</th><th>Column 3</th>
<tr onclick="test()">
<td >Value 1</td>
<td>Value 2</td>
<td>Value 3</td>
</tr>
</table>
</html>