asp.net - ASP.NET onclickイベントは、ページの上部にHTMLをレンダリングします

Question

ASPを使うのはこれが初めてで、少し混乱しています。データベースから情報を取得してテーブルに表示するインターフェイスをコーディングしています。そのために、onClickイベントでボタンをクリックするとaspテキストボックスからテキストを取得するaspボタンを使用しています。データベースに接続し、クエリを実行して、HTMLをメインページに出力します。

問題は、ボタンをクリックすると、結果のhtmlがページの上部にレンダリングされ、テキストボックスとボタンが下に残り、下にスクロールして別の検索を行う必要があることです。

これが役立つ場合は、私のonClickコードです。

If Not SearchBox.Text Is Nothing Then

        Dim conn = New OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;" &
                                      "Data Source= C:\Users\user\Documents\Visual Studio 2012\Projects\Aplicación UNED\Aplicación UNED\App_Data\Libros.mdb")

        Dim query = New OleDbCommand("SELECT * FROM Libros WHERE Titulo LIKE '%" & SearchBox.Text & "%'", conn)

        Dim adapter = New OleDbDataAdapter(query)

        Dim res = New DataSet()
        adapter.Fill(res, "Libros")
        Response.Write("<table class='data_table'>")
        Response.Write("<thead><tr class='data_table_info'><th scope='col'>Titulo</th><th scope='col'>Resumen</th><th scope='col'>Categoria</th><th scope='col'>ISBN</th><th scope='col'>PrecioConIVA</th><th scope='col'>EnlaceCompra</th></tr></thead>")
        For Each Fila In res.Tables("Libros").Rows
            Response.Write("<tr><td>" & Fila("Titulo") & "</td><td>" & Fila("Resumen") & "</td><td>" & Fila("Categoria") & "</td><td>" & Fila("ISBN") & "</td><td>" & Fila("PrecioConIVA") & "</td><td>" & Fila("EnlaceCompra") + "</td></tr>")
        Next
        Response.Write("</table>")
        conn.Close()
    End If
End Sub

よろしく。

Answer 1

Response.Writeを使用する代わりに、ボタンの下にLiteralコントロールを導入し、生成されたテキストをLiteralのTextプロパティに割り当てます。これにより、コンテンツがボタンの下に表示されます。

SearchBoxという名前のASP.NETテキストボックスがあるとすると、<asp:Textbox id="SearchBox" runat="server" />その下にリテラルを配置します

<asp:Textbox id="SearchBox" runat="server" />
<br />
<asp:Literal id="ResultHtml" runat="server" />

Response.Writeコードビハインドで、呼び出しを次のように置き換えます

Dim sb = new StringBuilder("<table class='data_table'>")
sb.Append("<thead><tr class='data_table_info'><th scope='col'>Titulo</th><th scope='col'>Resumen</th><th scope='col'>Categoria</th><th scope='col'>ISBN</th><th scope='col'>PrecioConIVA</th><th scope='col'>EnlaceCompra</th></tr></thead>")

      For Each Fila In res.Tables("Libros").Rows
          sb.Append("<tr><td>" & Fila("Titulo") & "</td><td>" & Fila("Resumen") & "</td><td>" & Fila("Categoria") & "</td><td>" & Fila("ISBN") & "</td><td>" & Fila("PrecioConIVA") & "</td><td>" & Fila("EnlaceCompra") + "</td></tr>")
      Next

sb.Append("</table>")    
ResultHtml.Text = sb.ToString()

Answer 2

ページが応答にレンダリングされる前に、応答にhtmlを書き込んでいます。