データベースからのデータを使用する動的HTML要素

Question

現在、ドロップダウンリストを使用して特定のMake、Model、Yearが選択されたときに動的にアイテムを表示するWebサイトを作成しようとしています。アイテム情報は、HtmlAgilityPackを利用したWebクローリングを使用して取得されました。

私は現在、id、Make、Model、Year、PartCategory、PartUrl、ImageUrl、PartBrand、PartName、PartPriceという列を含む何千ものアイテムでいっぱいのデータベーステーブルを持っています。ユーザーが簡単に彼らが見ている項目からなるサイト伝えることができるので、私がしようとしてる何

はdiv要素の中に独立した各サイトです。例：私は現在、合計3つのサイトを使用していて、その数は、私が作成する必要がありますどのように多くの動的なインスタンスになりますので、私は、簡単のDataTableにデータを引き出した後、返された行数を見ることができます

<div id="siteOne"> 
    <table> 
    <tr> 
     <td> 
     <img url="ImageUrl"> 
     <a href="PartUrl">PartBrand & PartName & PartPrice</a> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     <img url="ImageUrl"> 
     <a href="PartUrl">PartBrand & PartName & PartPrice</a> 
     </td> 
    </tr> 
    </table> 
</div> 
<div id="siteTwo"> 
    ............. 
</div> 
<div id=""siteThree> 
    ............. 
</div> 

。私はかなりJqueryがこの仕事を処理できると確信していますが、私はDataTableのDataRowsを使用して動的部品を制御する人々の例は見つけられません。通常は、ボタンイベントなどがあります。私は、私は誰にもしながら、任意のヒントや同様の例があったかどうかを確認するために投稿すると考えました私はしばらくの間、この一歩に取り組んできました

//this foreach statement will be in the last dropdown list's SelectedIndexChanged event 
//when the last dropdown is chosen, a datatable will be returned with all the items that match that particular make/model/year 
foreach (DataRow tempRow in tempDataTable) 
{ 
    //this should pull data from each column one at a time 
    //column: 0 = id, 1 = Make, 2 = Model, 3 = Year, don't think I'll need these right now 
    string partCategory = tempRow[4].ToString(); 
    string partUrl = tempRow[5].ToString(); 
    string imageUrl = tempRow[6].ToString(); 
    string partBrand = tempRow[7].ToString(); 
    string partName = tempRow[8].ToString(); 
    string partPrice = tempRow[9].ToString(); 

    //this is where the jquery would generate the dynamic elements in the table. 
    //three main divs can be hard coded for now, only using 3 sites currently 
    //this means the <table></table> in each will most likely be hard coded as well 
    //the <tr></tr>, <td></td>, <img>, and <a></a> will need to be generated dynamically each loop iteration 
} 

：

私は、コードは次のようになります想像します私は自分自身でそれを解決しようとし続けます。何でも大歓迎です。乾杯！

Answer 1

私はそれを簡単に理解しました。

HERESに私の機能は、セットアップ

protected void drpdwnYear_SelectedIndexChanged(object sender, EventArgs e) 
    { 
     //get the data for the specific make/model/year from the database 
     DataTable dt = new DataTable(); 
     string tempYear = drpdwnYear.SelectedItem.ToString(); 
     string tempManufacturer = Globals.myManufacturer; 
     string tempModel = Globals.myModel; 
     Globals.myQuery = "SELECT * FROM CrawlerInfo WHERE Model = '" + tempModel + "' AND Year ='" + tempYear + "'"; 
     try 
     { 
      using (SqlConnection con = new SqlConnection(Globals.myConStr)) 
      { 
       using (SqlCommand cmd = new SqlCommand(Globals.myQuery, con)) 
       { 
        using (SqlDataAdapter da = new SqlDataAdapter(cmd)) 
        { 
         da.Fill(dt); 
        } 
       } 
      } 
     } 
     catch (Exception ex) 
     { 
      handleTheError(ex); 
     } 

     //put the data into HTML elements 
     try 
     { 
      int tempflag = 0; 
      foreach (DataRow tempRow in dt.Rows) 
      { 
       string tempCategory = tempRow[4].ToString(); 
       string tempPartUrl = tempRow[5].ToString(); 
       string tempImageUrl = tempRow[6].ToString(); 
       string tempPartBrand = tempRow[7].ToString(); 
       string tempPartName = tempRow[8].ToString(); 
       string tempPrice = tempRow[9].ToString(); 
       string tempStoreName = tempRow[10].ToString(); 

       Image tpImg = new Image(); 
       tpImg.ID = "id_img_" + tempflag; 
       tpImg.ImageUrl = tempImageUrl; 
       Page.Controls.Add(tpImg); 

       HyperLink hyp = new HyperLink(); 
       hyp.ID = "id_link_" + tempflag; 
       hyp.NavigateUrl = tempPartUrl; 
       hyp.Text = tempPartBrand + " " + tempPartName + ": " + tempPrice + "\n\n"; 
       Page.Controls.Add(hyp); 
       tempflag++; 
      } 
     } 
     catch (Exception ex) 
     { 
      handleTheError(ex); 
     } 
    } 

であり、ここで、それは現在表示されているノウハウどのように、私はちょうど私が彼らのスタイルを設定することができますので、<div>秒にそれらを配置する方法を把握する必要があります。