CODEWITHSUNDEEP
asp.net
Nucklear
Nucklear

Reputation: 478

ASP.NET onclick event renders HTML at the top of the page

This is my first time with ASP and I'm a little messed with it. I'm coding an interface that grabs information from a database and displays it in a table. For that I'm using an asp button that takes the text from an asp textbox once I click the button in the onClick event I do the connection to the database, execute the query and print the html to the main page.

The problem is that once I click the button the resultant html is rendered at the top of the page and the textbox and the button remains below, forcing me to scroll down to make another search.

This is my onClick code if it helps:

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

Regards.

Upvotes: 1

Views: 430

Answers (2)

Babak Naffas
Babak Naffas

Reputation: 12561

Instead of using Response.Write, introduce a Literal control below your button and assign the generated text to the Text property of your Literal. This will ensure that your content displays below your button.

Assuming you have an ASP.NET Textbox by the name SearchBox <asp:Textbox id="SearchBox" runat="server" /> place the literal below it 

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

and in your code behind, replace the Response.Write calls with 

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()

Upvotes: 2

matt-dot-net
matt-dot-net

Reputation: 4244

You are writing html to the response before the page has rendered to the response.

Upvotes: 0

Related Questions