Solved

Ajaxtoolkit Modalpopup help

Posted on 2011-03-10
3
659 Views
Last Modified: 2012-05-11
My goal is to have a single textbox and button where when the button is clicked, the textbox contents will be fed to a SqlDataSource within a panel tied to a modalpopup and linked to a gridview to display results based off a query - then to have the select of the gridview redirect back to the page to display some data.  I've been able to get everything working except the modalpopup part.  I've tried it with it linked to the button next to the textbox but I can't get the data within the textbox to be passed to the sqldatasource within the panel - yet the modalpopup would work.  instead I've tried putting a dummy button in and then add an onclick event to the visible button to pass the value and doing response.write i confirmed that the value is getting passed to the sqldatasource parameter, but I can't get the modal popup to show.  Code is attached and any help is appreciated!
.aspx file

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link rel="Stylesheet" href="CSS/modalpopup.css" />
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </asp:ToolkitScriptManager>
        <asp:TextBox ID="txtSiteSearch" runat="server" Width="200" ></asp:TextBox>
        <asp:Button ID="btnSiteSearch" runat="server" Text="Search" OnClick="showSearchResults" /><br /><br />
        <asp:Button ID="Button1" runat="server" visible="false" />
        <asp:ModalPopupExtender ID="mpSearchResults" runat="server" 
            TargetControlID="Button1" PopupControlID="pnlSearchResults"
            BackgroundCssClass="modalBackground" DropShadow="false" CancelControlID="btnCancel">
        </asp:ModalPopupExtender>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
            DataKeyNames="site_id" DataSourceID="SqlDataSource1" Width="1000px" 
            CellPadding="4" ForeColor="#333333" GridLines="None">
            <RowStyle BackColor="#EFF3FB" />
            <Columns>
                <asp:CommandField ShowEditButton="True" />
                <asp:TemplateField>
                    <EditItemTemplate>
                    <table border="0" cellpadding="1" width="1000">
                        <tr>
                            <td align="center" colspan="2" width="1000">
                                <asp:TextBox runat="server" ID="site_id" Text='<%# Bind("site_id")%>'></asp:TextBox>&nbsp;-&nbsp;
                                <asp:TextBox runat="server" ID="site_name" Text='<%# Bind("site_name")%>'></asp:TextBox>
                            </td>
                        </tr>
                        <tr>
                            <td width="500">
                                Connection: &nbsp;<asp:TextBox runat="server" ID="site_vpn_type" Text='<%# Bind("site_vpn_type")%>'></asp:TextBox><br />
                                Username: &nbsp;<asp:TextBox runat="server" ID="site_vpn_username" Text='<%# Bind("site_vpn_username")%>'></asp:TextBox><br />
                                Password: &nbsp;<asp:TextBox runat="server" ID="site_vpn_password" Text='<%# Bind("site_vpn_password")%>'></asp:TextBox>
                            </td>
                            <td width="500">
                                Host: &nbsp;<asp:TextBox runat="server" ID="site_host" Text='<%# Bind("site_host")%>'></asp:TextBox>
                                <hr />
                                Notes: &nbsp;<asp:TextBox runat="server" ID="Label1" Text='<%# Bind("site_notes")%>'></asp:TextBox>
                            </td>
                        </tr>
                    </table>
                    </EditItemTemplate>
                    <ItemTemplate>
                    <table border="0" cellpadding="1" width="1000">
                        <tr>
                            <td align="center" colspan="2" width="1000">
                                <asp:Label runat="server" ID="site_id" Text='<%# Bind("site_id") %>'></asp:Label>&nbsp;-&nbsp;
                                <asp:Label runat="server" ID="site_name" Text='<%# Bind("site_name") %>' 
                                    ></asp:Label>
                            </td>
                        </tr>
                        <tr>
                            <td width="500">
                                Connection: &nbsp;<asp:Label runat="server" ID="site_vpn_type" 
                                    Text='<%# Bind("site_vpn_type") %>'></asp:Label><br />
                                Username: &nbsp;<asp:Label runat="server" ID="site_vpn_username" Text='<%# Bind("site_vpn_username")%>'></asp:Label><br />
                                Password: &nbsp;<asp:Label runat="server" ID="site_vpn_password" Text='<%# Bind("site_vpn_password")%>'></asp:Label>
                            </td>
                            <td width="500">
                                Host: &nbsp;<asp:Label runat="server" ID="site_host" Text='<%# Bind("site_host")%>'></asp:Label>
                                <hr />
                                Notes: &nbsp;<asp:Label runat="server" ID="Label1" Text='<%# Bind("site_notes")%>'></asp:Label>
                            </td>
                        </tr>
                    </table>
                    </ItemTemplate>
            </asp:TemplateField>
            </Columns>
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <EditRowStyle BackColor="#2461BF" />
            <AlternatingRowStyle BackColor="White" />
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:ConnMgrCS %>" 
            DeleteCommand="DELETE FROM [hd_site] WHERE [site_id] = @site_id" 
            InsertCommand="INSERT INTO [hd_site] ([site_id], [site_name], [site_vpn_type], [site_vpn_username], [site_vpn_password], [site_host], [site_notes]) VALUES (@site_id, @site_name, @site_vpn_type, @site_vpn_username, @site_vpn_password, @site_host, @site_notes)" 
            SelectCommand="SELECT * FROM [hd_site] WHERE ([site_id] = @site_id)" 
            UpdateCommand="UPDATE [hd_site] SET [site_name] = @site_name, [site_vpn_type] = @site_vpn_type, [site_vpn_username] = @site_vpn_username, [site_vpn_password] = @site_vpn_password, [site_host] = @site_host, [site_notes] = @site_notes WHERE [site_id] = @site_id">
            <SelectParameters>
                <asp:QueryStringParameter Name="site_id" QueryStringField="site" 
                    Type="String" />
            </SelectParameters>
            <DeleteParameters>
                <asp:Parameter Name="site_id" Type="String" />
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="site_name" Type="String" />
                <asp:Parameter Name="site_vpn_type" Type="String" />
                <asp:Parameter Name="site_vpn_username" Type="String" />
                <asp:Parameter Name="site_vpn_password" Type="String" />
                <asp:Parameter Name="site_host" Type="String" />
                <asp:Parameter Name="site_notes" Type="String" />
                <asp:Parameter Name="site_id" Type="String" />
            </UpdateParameters>
            <InsertParameters>
                <asp:Parameter Name="site_id" Type="String" />
                <asp:Parameter Name="site_name" Type="String" />
                <asp:Parameter Name="site_vpn_type" Type="String" />
                <asp:Parameter Name="site_vpn_username" Type="String" />
                <asp:Parameter Name="site_vpn_password" Type="String" />
                <asp:Parameter Name="site_host" Type="String" />
                <asp:Parameter Name="site_notes" Type="String" />
            </InsertParameters>
        </asp:SqlDataSource>
        <asp:Panel ID="pnlSearchResults" runat="server" style="display:none" CssClass="modalPopup">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
            <asp:GridView ID="gvSiteSelect" runat="server" AutoGenerateColumns="False" 
                CellPadding="4" DataKeyNames="site_id" DataSourceID="SqlDataSource2" 
                ForeColor="#333333" GridLines="None" OnSelectedIndexChanging="goToSite">
                <RowStyle BackColor="#EFF3FB" />
                <Columns>
                    <asp:BoundField DataField="site_id" HeaderText="site_id" ReadOnly="True" 
                        SortExpression="site_id" />
                    <asp:BoundField DataField="site_name" HeaderText="site_name" 
                        SortExpression="site_name" />
                </Columns>
                <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
                <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
                <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                <EditRowStyle BackColor="#2461BF" />
                <AlternatingRowStyle BackColor="White" />
            </asp:GridView>
            <asp:SqlDataSource ID="SqlDataSource2" runat="server" 
                ConnectionString="<%$ ConnectionStrings:ConnMgrCS %>" 
                SelectCommand="SELECT [site_id], [site_name] FROM [hd_site] WHERE (([site_id] LIKE '%' + @site_id + '%') OR ([site_name] LIKE '%' + @site_id + '%'))">
                <SelectParameters>
                    <asp:FormParameter FormField="txtSiteSearch" Name="site_id" Type="String" />
                </SelectParameters>
            </asp:SqlDataSource>
            <br />
            </ContentTemplate>
            </asp:UpdatePanel>
                <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
        </asp:Panel> 
    </div>
    </form>
</body>
</html>

Open in new window

codebehind file:

using System.Data;
using System.Data.SqlClient;
using System.Collections.Generic;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Configuration;

public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void showSearchResults(object sender, EventArgs e)
    {
        string boxcontents = txtSiteSearch.Text.ToString();
        SqlDataSource2.SelectParameters["site_id"].DefaultValue = boxcontents;
        this.mpSearchResults.Show();
    }

    protected void goToSite(object sender, GridViewSelectEventArgs e)
    {
        GridViewRow row = gvSiteSelect.Rows[e.NewSelectedIndex];
        string site = row.Cells[1].Text.ToString();
        Response.Redirect("Default.aspx?site=" + site);
    }
}

Open in new window

0
Comment
Question by:rondre
  • 2
3 Comments
 

Author Comment

by:rondre
ID: 35113586
Now it appears that it's working in firefox but not in IE - any explanations?
0
 
LVL 14

Accepted Solution

by:
CtrlAltDl earned 500 total points
ID: 35734300
Instead of making Button1 visible="false" try hiding it with CSS:
style="display:none"

I'm guessing that visible="false" is causing asp.net not to render the button at all, so you are unable to trigger the button since it doesn't exist, so if you hide it with CSS it will be there, but it will be hidden.

Check out this blog post:
http://aspdotnet-suresh.blogspot.com/2011/03/how-to-show-modalpopup-to-edit-gridview.html
0
 

Author Closing Comment

by:rondre
ID: 35738923
Thanks - that worked great.
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

Suggested Solutions

Just a quick little trick I learned recently.  Now that I'm using jQuery with abandon in my asp.net applications, I have grown tired of the following syntax:      (CODE) I suppose it just offends my sense of decency to put inline VBScript on a…
Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now