Pull data from button in HTML to aspx page

Question

Here's what I have so far:

Aspx file:

    <asp:DataList ID="DataList1" runat="server" DataKeyField="AppId" DataSourceID="TestDB" RepeatColumns="1">
        <ItemTemplate>
            AppId:
            <asp:Label ID="AppIdLabel" runat="server" Text='<%# Eval("AppId") %>' />
            <br />
            ToonName:
            <asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
            <br />
            AppStatus:
            <asp:Label ID="AppStatusLabel" runat="server" Text='<%# Eval("AppStatus") %>' />
            <br />
            <br />
        </ItemTemplate>
    </asp:DataList>
    <asp:SqlDataSource ID="TestDB" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" ProviderName="<%$ ConnectionStrings:ConnectionString.ProviderName %>" SelectCommand="SELECT * FROM [Applications] WHERE ([AppId] = @AppId)">
        <SelectParameters>
            <asp:QueryStringParameter Name="AppId" QueryStringField="btnView" Type="Int32" />
        </SelectParameters>
    </asp:SqlDataSource>

Grid that is auto populated using the database and creates a button for each action to be performed on that specific entry.

<form>
   <div id="grid">
       @grid.GetHtml(    
            tableStyle : "grid",
            alternatingRowStyle : "alt",
            headerStyle : "header",
            columns: grid.Columns(
                     grid.Column("AppId", "Action", format: @<text>
                            <button type="submit" class="view-app" id="@item.AppId" name="btnView" value="@item.AppId">View</button>
                            <button type="submit" class="approve-app" id="@item.AppId" name="btnApprove" value="@item.AppId">Approve</button>
                            <button type="submit" class="deny-app" id="@item.AppId" name="btnDeny" value="@item.AppId">Deny</button>
                            <button type="submit" class="delete-app" id="@item.AppId" name="btnDelete" value ="@item.AppId">Delete</button>
                        </text>),
                     grid.Column("Name", "Name"), 
                     grid.Column("AppDate", "AppDate"),
                     grid.Column("AppStatus", "Status")
        )
       )
    </div>
</form>
<br />
<fieldset>    
<legend>Applicant Answers</legend>
<iframe id="ff" width="100%" height="50px" frameborder="0" scroll="yes" src="Applicant.aspx"></iframe>
</fieldset>

What I am attempting to do is when a user clicks the button, I want the data to be populated in the aspx datalist. I know that the button does create the QueryString "btnView=". Plus the SQL Query does work, but no data is populated and no errors occur. Will this work, or will I need to approach this in a different manor?

UPDATED to reflect solution by Grundy

Edited as follows:

IFrame changed to:

<fieldset>  
<legend>Applicant Answers</legend>
    <script type="text/javascript">
        function ShowDetail(appId) {
            document.getElementById("ff").src ="Applicant.aspx?AppId=" + appId;};
    </script>
    <iframe id="ff" width="300" height="300"></iframe>
</fieldset>

Button changed to:

<button type="button" onclick="ShowDetail(this.value)" class="view-app" id="@item.AppId" name="btnView" value="@item.AppId">View</button>

are you sure that btnView= in QueryString instead of in body of post request? — Grundy
– Grundy, Commented Feb 19, 2014 at 5:14
I'm using QueryString because the button does not post directly to the web form or aspx file. Basically at this point, I have a web form inside an HTML file by means of iframe. What I need is the button id in order to populate the data in the web form. Like I said, I don't know if this is the way to achieve this. The end result is that I'd like to have data populated depending on the view button from the dynamically created grid, that users can see. — James
– James, Commented Feb 19, 2014 at 9:40
just added the whole grid that dynamically creates the view button. Also included the iframe that embeds the asp.net web form. — James
– James, Commented Feb 19, 2014 at 16:09

Grundy · Accepted Answer · 2014-02-20 06:16:55Z

1

As i understand you don't need use submit, instead you need change src attribute for iframe. Change your code something like this

<script type="text/javascript">
    function ShowDetail(appId) {
        document.getElementById("ff").src = "Applicant.aspx?AppId=" + appId;
    }
</script>

....
<button type="button" onclick="ShowDetail(this.value)" class="view-app" id="@item.AppId" name="btnView" value="@item.AppId">View</button>
....

answered Feb 20, 2014 at 6:16

Grundy

13.4k3 gold badges39 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

James Over a year ago

That is exactly what I needed thank you. I updated the code in my original post to reflect the changes I made and accepted this as the answer. Again, thank you for the help.

Collectives™ on Stack Overflow

Pull data from button in HTML to aspx page

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related