Solved

Need Help With a Modal Popup Dialog

Posted on 2011-09-05
2
222 Views
Last Modified: 2012-05-12
I am trying to use an AJAX:ModalPopupExtender to display detail information about a database record when the user selects a date in a calendar. The panel contains a SQLDataSource and a DetailsView control. The popup window opens but it is empty save for the OK button. The SQLDataSource SelectParameter is set to use the calendar selected date. This clearly is not working. What is the best way to present a record in a modal popup window, allow edits and then save it to the database? As I am (obviously) a novice at web development, some example code would be more than welcome.
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConflictDetection="CompareAllValues" 
            ConnectionString="<%$ ConnectionStrings:TLCCMembersOnlyConnectionString %>" 
            DeleteCommand="DELETE FROM [BldgUser] WHERE [ReservationID] = @original_ReservationID AND [LastName] = @original_LastName AND (([FirstName] = @original_FirstName) OR ([FirstName] IS NULL AND @original_FirstName IS NULL)) AND (([Address1] = @original_Address1) OR ([Address1] IS NULL AND @original_Address1 IS NULL)) AND (([Address2] = @original_Address2) OR ([Address2] IS NULL AND @original_Address2 IS NULL)) AND (([City] = @original_City) OR ([City] IS NULL AND @original_City IS NULL)) AND (([State] = @original_State) OR ([State] IS NULL AND @original_State IS NULL)) AND (([Zip] = @original_Zip) OR ([Zip] IS NULL AND @original_Zip IS NULL)) AND (([Phone] = @original_Phone) OR ([Phone] IS NULL AND @original_Phone IS NULL)) AND (([Organization] = @original_Organization) OR ([Organization] IS NULL AND @original_Organization IS NULL))" 
            InsertCommand="INSERT INTO [BldgUser] ([LastName], [FirstName], [Address1], [Address2], [City], [State], [Zip], [Phone], [Organization]) VALUES (@LastName, @FirstName, @Address1, @Address2, @City, @State, @Zip, @Phone, @Organization)" 
            OldValuesParameterFormatString="original_{0}" 
            SelectCommand="SELECT [LastName], [FirstName], [Address1], [Address2], [City], [State], [Zip], [Phone], [Organization], [ReservationID] FROM [BldgUser] ORDER BY [LastName], [FirstName], [Organization]" 
            UpdateCommand="UPDATE [BldgUser] SET [LastName] = @LastName, [FirstName] = @FirstName, [Address1] = @Address1, [Address2] = @Address2, [City] = @City, [State] = @State, [Zip] = @Zip, [Phone] = @Phone, [Organization] = @Organization WHERE [ReservationID] = @original_ReservationID AND [LastName] = @original_LastName AND (([FirstName] = @original_FirstName) OR ([FirstName] IS NULL AND @original_FirstName IS NULL)) AND (([Address1] = @original_Address1) OR ([Address1] IS NULL AND @original_Address1 IS NULL)) AND (([Address2] = @original_Address2) OR ([Address2] IS NULL AND @original_Address2 IS NULL)) AND (([City] = @original_City) OR ([City] IS NULL AND @original_City IS NULL)) AND (([State] = @original_State) OR ([State] IS NULL AND @original_State IS NULL)) AND (([Zip] = @original_Zip) OR ([Zip] IS NULL AND @original_Zip IS NULL)) AND (([Phone] = @original_Phone) OR ([Phone] IS NULL AND @original_Phone IS NULL)) AND (([Organization] = @original_Organization) OR ([Organization] IS NULL AND @original_Organization IS NULL))">
            <DeleteParameters>
                <asp:Parameter Name="original_ReservationID" Type="Int32" />
                <asp:Parameter Name="original_LastName" Type="String" />
                <asp:Parameter Name="original_FirstName" Type="String" />
                <asp:Parameter Name="original_Address1" Type="String" />
                <asp:Parameter Name="original_Address2" Type="String" />
                <asp:Parameter Name="original_City" Type="String" />
                <asp:Parameter Name="original_State" Type="String" />
                <asp:Parameter Name="original_Zip" Type="String" />
                <asp:Parameter Name="original_Phone" Type="String" />
                <asp:Parameter Name="original_Organization" Type="String" />
            </DeleteParameters>
            <InsertParameters>
                <asp:Parameter Name="LastName" Type="String" />
                <asp:Parameter Name="FirstName" Type="String" />
                <asp:Parameter Name="Address1" Type="String" />
                <asp:Parameter Name="Address2" Type="String" />
                <asp:Parameter Name="City" Type="String" />
                <asp:Parameter Name="State" Type="String" />
                <asp:Parameter Name="Zip" Type="String" />
                <asp:Parameter Name="Phone" Type="String" />
                <asp:Parameter Name="Organization" Type="String" />
            </InsertParameters>
            <UpdateParameters>
                <asp:Parameter Name="LastName" Type="String" />
                <asp:Parameter Name="FirstName" Type="String" />
                <asp:Parameter Name="Address1" Type="String" />
                <asp:Parameter Name="Address2" Type="String" />
                <asp:Parameter Name="City" Type="String" />
                <asp:Parameter Name="State" Type="String" />
                <asp:Parameter Name="Zip" Type="String" />
                <asp:Parameter Name="Phone" Type="String" />
                <asp:Parameter Name="Organization" Type="String" />
                <asp:Parameter Name="original_ReservationID" Type="Int32" />
                <asp:Parameter Name="original_LastName" Type="String" />
                <asp:Parameter Name="original_FirstName" Type="String" />
                <asp:Parameter Name="original_Address1" Type="String" />
                <asp:Parameter Name="original_Address2" Type="String" />
                <asp:Parameter Name="original_City" Type="String" />
                <asp:Parameter Name="original_State" Type="String" />
                <asp:Parameter Name="original_Zip" Type="String" />
                <asp:Parameter Name="original_Phone" Type="String" />
                <asp:Parameter Name="original_Organization" Type="String" />
            </UpdateParameters>
        </asp:SqlDataSource>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
            DeleteMethod="Delete" InsertMethod="Insert" 
            OldValuesParameterFormatString="original_{0}" SelectMethod="GetData" 
            TypeName="TLC.dsBuildingUseTableAdapters.BuildingUseTableAdapter" 
            UpdateMethod="Update">
            <DeleteParameters>
                <asp:Parameter Name="Original_ID" Type="Int32" />
            </DeleteParameters>
            <InsertParameters>
                <asp:Parameter Name="ReservationDate" Type="DateTime" />
                <asp:Parameter Name="ReservationType" Type="String" />
                <asp:Parameter Name="Contact" Type="String" />
                <asp:Parameter Name="ContactPhone" Type="String" />
                <asp:Parameter Name="ReservationID" Type="Int32" />
                <asp:Parameter Name="SerialID" Type="Int32" />
                <asp:Parameter Name="ReservationTitle" Type="String" />
            </InsertParameters>
            <UpdateParameters>
                <asp:Parameter Name="ReservationDate" Type="DateTime" />
                <asp:Parameter Name="ReservationType" Type="String" />
                <asp:Parameter Name="Contact" Type="String" />
                <asp:Parameter Name="ContactPhone" Type="String" />
                <asp:Parameter Name="ReservationID" Type="Int32" />
                <asp:Parameter Name="SerialID" Type="Int32" />
                <asp:Parameter Name="ReservationTitle" Type="String" />
                <asp:Parameter Name="Original_ID" Type="Int32" />
            </UpdateParameters>
        </asp:ObjectDataSource>
    </ContentTemplate>

</asp:UpdatePanel>


<table>
<tr>
    <td>
        &nbsp;</td>
    <td>
        &nbsp;</td>
</tr>
    <tr>
        <td align="center" >
            <br />
            <asp:DropDownList ID="drpCalMonth" runat="server" AutoPostBack="True"></asp:DropDownList>
            <asp:DropDownList ID="drpCalYear" runat="server" AutoPostBack="True"></asp:DropDownList>
        </td>
        <td>
            
        </td>
    </tr>
    <tr>
        <td>
          <dc:DataCalendar ID="DataCalendar1" runat="server" ShowTitle="False" 
              Width="400px" Height="184px">
              <DayStyle HorizontalAlign="Center" VerticalAlign="Top" />
              <SelectedDayStyle BackColor="#00CCFF" Font-Bold="True" Font-Underline="True" 
                  HorizontalAlign="Center" VerticalAlign="Top" />
              <SelectorStyle Font-Bold="True" Font-Underline="True" ForeColor="Black" 
                  HorizontalAlign="Center" VerticalAlign="Top" />
          </dc:DataCalendar>
        </td>
        <td>
        </td>
    </tr>
</table>
<asp:Panel ID="ModalPanel" runat="server" Width="500px" BackColor="White" ForeColor="Black" BorderColor="Black" BorderStyle="Solid" BorderWidth="2px">

    <asp:DetailsView ID="RentalDetail" runat="server" AutoGenerateRows="False" 
        DataKeyNames="ID" DataSourceID="SqlDataSource2" Height="50px" Width="125px">
        <Fields>
            <asp:BoundField DataField="ReservationDate" HeaderText="ReservationDate" 
                SortExpression="ReservationDate" />
            <asp:BoundField DataField="ReservationType" HeaderText="ReservationType" 
                SortExpression="ReservationType" />
            <asp:BoundField DataField="Contact" HeaderText="Contact" 
                SortExpression="Contact" />
            <asp:BoundField DataField="ContactPhone" HeaderText="ContactPhone" 
                SortExpression="ContactPhone" />
            <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" 
                ReadOnly="True" SortExpression="ID" />
            <asp:BoundField DataField="ReservationID" HeaderText="ReservationID" 
                SortExpression="ReservationID" />
            <asp:BoundField DataField="SerialID" HeaderText="SerialID" 
                SortExpression="SerialID" />
            <asp:BoundField DataField="ReservationTitle" HeaderText="ReservationTitle" 
                SortExpression="ReservationTitle" />
        </Fields>
    </asp:DetailsView>
    <asp:SqlDataSource ID="SqlDataSource2" runat="server" 
        ConnectionString="<%$ ConnectionStrings:TLCCMembersOnlyConnectionString %>" 
        SelectCommand="SELECT * FROM [BuildingUse] WHERE ([ReservationDate] = @ReservationDate)">
        <SelectParameters>
            <asp:ControlParameter ControlID="DataCalendar1" DbType="Date" 
                Name="ReservationDate" PropertyName="SelectedDate" />
        </SelectParameters>
    </asp:SqlDataSource>
    <br />
 <asp:Button ID="OKButton" runat="server" Text="Close" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server"
 TargetControlId="DataCalendar1" PopupControlID="ModalPanel" 
 OkControlID="OKButton" />

<script type="text/javascript">
 var launch = false;
 function launchModal() 
 {
 launch = true;
 }
 function pageLoad() {
     if (launch) {
         $find("mpe").show();
     }
 }
</script>
</asp:Content>

Open in new window

0
Comment
Question by:rkulp
2 Comments
 
LVL 16

Accepted Solution

by:
disrupt earned 500 total points
ID: 36485564
0
 
LVL 1

Author Closing Comment

by:rkulp
ID: 36492284
Thanks for your help. The second article is more like my problem. It is still not working as I wish but I am closer.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

830 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