動的テーブルを使用してデータのみを入力し、ASP.NETの背後にあるコードに値を渡す

Question

コード化して以来、長い時間がかかり、問題に直面しています。

私はVS2015 .NET c＃webFormsアプリケーションを使用しています。私は、ユーザーが動的な表を記入する必要があるシンプルなフォームを持っています。そして、提出を打った後、値は、DBに格納された計算のためにコードの背後に渡されます。

私はhttp://talkerscode.com/webtricks/add-edit-and-delete-rows-from-table-dynamically-using-javascript.php

にリンクして、出力をHTMLテーブルを使用：

私はGridViewのを使用するカントは、それがpostsback becuaseと直接DBに接続します。私はすぐにテーブルの入力を保存したくない。

HTMLテーブルからデータを取得しようとしています。 いくつかのヒントを得ることができます。

私はコードを提供できます。 おかげ

UPDATE： 自分のコード

form.aspx

<form runat="server"> 
    //elements here 

    <div class="table-responsive" id="div_invlv"> 

       <!------TABLE ----> 
      <table id="data_table" class="table" > 
      <tr> 
      <th></th> 
      <th> </th> 
      <th>Name</th> 
      <th>Position</th> 
      <th>Company</th> 
      <th></th> 
      </tr> 

      <tr> 
       <td> 
        <select class="form-control" id="type_of_person"> 
        <option>Internal</option> 
        <option>External</option> 
        </select> </td> 
       <td><input type="text" class="form-control" id="new_name" /></td> 
       <td><input type="text" class="form-control" id="new_position" /></td> 
       <td><input type="text" class="form-control" id="new_company" /></td> 
       <td><input type="button" class="btn btn-small btn-template-main add" onclick="add_row();" value="Add Row" /></td> 
      </tr> 

      </table> 
    </form> 

Table.js

function delete_row(no) 
    { 
    document.getElementById("row"+no+"").outerHTML=""; 
    } 

    function add_row() 
    { 
    var drop = document.getElementById("type_of_person"); 
    var new_type = drop.options[drop.selectedIndex].innerHTML; 
    var new_name=document.getElementById("new_name").value; 
    var new_country=document.getElementById("new_position").value; 
    var new_company=document.getElementById("new_company").value; 

    var table = document.getElementById("data_table"); 
    var table_len = (table.rows.length) - 1; 
    var row = table.insertRow(table_len).outerHTML = "<tr id='row" + table_len + "'><td id='id_row" + table_len + "'><asp:Label Name='id" + table_len + "' runat='server' > " + table_len + "</asp:Label></td> <td id='Type_row" + table_len + "'><asp:Label ID='type" + table_len + "' runat='server' > " + new_type + "</asp:Label></td><td id='name_row" + table_len + "'> <asp:Label ID='name'"+table_len+" runat='server' >" + new_name + "</asp:Label></td><td id='position_row" + table_len + "'>" + new_country + "</asp:Label></td><td id='company_row" + table_len + "'><asp:Label ID='company'"+table_len+" runat='server' >" + new_company + "</asp:Label></td><td > <input type='button' value='Delete' class='btn btn-small btn-template-main delete' onclick='delete_row(" + table_len + ")'></td></tr>"; 


    document.getElementById("new_name").value=""; 
    document.getElementById("new_position").value = ""; 
    document.getElementById("new_company").value = ""; 
    } 

C＃

string typeTable = Request.Form["type" + 1]; 
    Label10.Text = typeTable ; 

行実行中に生成され、テストのために最初の行の1つのセルの値を取得しようとしていますが、動作していません。

Answer 1

にdyamic HTMLテーブルを作成するために@legends

https://www.aspsnippets.com/Articles/Dynamically-Add-Rows-to-GridView-using-JavaScript-on-Button-Click-in-ASPNet.aspx

によって提供されるリンクをプレースホルダコントロールを使用することができますdyamicallyあなたのデータグリッドを埋めるために、この機能を使用することができます

はうまく動作し、私の問題のほとんどを解決しました。

ありがとうございました

Answer 2

あなたは

public void fillgrid(string qry, GridView dg){ 

     try 
     { 

      sql.cmd = new SqlCommand("qry", sql.cn); 
      sql.cn.Open(); 
      DataSet ds = new DataSet(); 
      SqlDataAdapter sda = new SqlDataAdapter(sql.cmd); 
      sda.Fill(ds); 
      dg.DataSource = ds; 
      dg.DataBind(); 
      sql.cn.Close(); 
     } 
     catch (Exception ex) 
     { 

      MessageBox.Show(ex.ToString()); 


     } 

    } 

またはあなたが