1

可能重复:
ASP.NET 在 asp 上异步回发:按钮单击

我正在创建一个带有嵌入式谷歌地图(v3)的asp.net应用程序......当我按下提交按钮时遇到问题,地图消失了,而不是显示我添加的点和它们之间的路线。输入新地址时标记显示正常,这似乎是给我带来麻烦的提交按钮。也许它导致地图无法生存的回传?任何想法将不胜感激!!!

这是我当前的代码:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="NewCallForm.ascx.cs"     Inherits="RamRideOps.Controls.NewCallForm" %>
<table class="style1" id="NewCallTable">               
    <tr>
        <td class="style23" align="right">
            Thank you for calling RamRide! Can I have your <span class="style3"><strong>
            first name</strong></span> 
            please?</td>
        <td class="style24" colspan="2">
            <asp:TextBox ID="name" runat="server" CausesValidation="True" 
                MaxLength="25" style="margin-bottom: 0px" 
                ontextchanged="newCall_name_TextChanged"></asp:TextBox>
        </td>
        <td class="style25">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
                ControlToValidate="name" CssClass="ErrorMessage" ErrorMessage="* Enter the patron's first name." 
                Font-Bold="False" Display="Dynamic" ValidationGroup="NewCallFormSubmit">*</asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" 
                CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="* Names may only contain letters." 
                ControlToValidate="name" SetFocusOnError="True" 
                ValidationExpression="[a-z|A-Z]{2,25}" ValidationGroup="NewCallFormSubmit">*</asp:RegularExpressionValidator>
            </td>
        <td class="style30">
            </td>
        <td class="style25">
            </td>
    </tr>
    <tr>
        <td class="style4" align="right">
            What is the <span class="style3"><strong>phone number</strong></span> our driver 
            can reach you at?</td>
        <td class="style8" colspan="2">
            <asp:TextBox ID="phone" runat="server" CausesValidation="True" 
                MaxLength="14" ontextchanged="newCall_phone_TextChanged" Height="22px"></asp:TextBox>
        </td>
        <td class="style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" 
                ControlToValidate="phone" CssClass="ErrorMessage" ErrorMessage="* Enter the call-back number." 
                Font-Bold="False" Display="Dynamic" ValidationGroup="NewCallFormSubmit">*</asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="* Invalid phone number." ControlToValidate="phone" 
                SetFocusOnError="True" 
                ValidationExpression="(\d{10})|((\(\d{3}\) ?)|(\d{3}-))?\d{3}-\d{4}" 
                ValidationGroup="NewCallFormSubmit">*</asp:RegularExpressionValidator>
        </td>
        <td class="style31">
        </td>
        <td class="style5">
        </td>
    </tr>
    <tr>
        <td class="style17" align="right">
            <span class="style3"><strong>How many</strong></span> people need a ride?</td>
        <td class="style18" colspan="2">
            <asp:TextBox ID="numPatrons" runat="server" CausesValidation="True" 
                ontextchanged="newCall_numPatrons_TextChanged"></asp:TextBox>
        </td>
        <td class="style19" style="font-style: italic">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" 
                ControlToValidate="numPatrons" CssClass="ErrorMessage" ErrorMessage="* Enter the number of patrons." 
                Font-Bold="False" Display="Dynamic" ValidationGroup="NewCallFormSubmit">*</asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" 
                CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="* Invalid number of patrons." ControlToValidate="numPatrons" 
                SetFocusOnError="True" 
                ValidationExpression="(\d{1}[0-9]{1,2})|([1-9{1}])" 
                ValidationGroup="NewCallFormSubmit">*</asp:RegularExpressionValidator>
            <asp:RangeValidator ID="RangeValidator1" runat="server" 
                ControlToValidate="numPatrons" CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="Number of patrons must be 1-255" MaximumValue="255" 
                MinimumValue="1" SetFocusOnError="True" 
                ValidationGroup="NewCallFormSubmit" Type="Integer">*</asp:RangeValidator>
        </td>
        <td class="style49">
            We can send multiple vehicles for large groups.</td>
        <td class="style19">
        </td>
    </tr>
    <tr>
        <td class="style11" align="right">
            Where is the <span class="style3"><strong>pick-up location</strong></span>?</td>
        <td class="style12" colspan="2">
            <asp:TextBox ID="pickup" runat="server" CausesValidation="True"  
                MaxLength="80" Rows="2" TextMode="MultiLine"
                onchange="showPickup()"></asp:TextBox>
        </td>
        <td class="style13">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" 
                ControlToValidate="pickup" CssClass="ErrorMessage" ErrorMessage="* Enter the pick-up location." 
                Font-Bold="False" Display="Dynamic" ValidationGroup="NewCallFormSubmit">*</asp:RequiredFieldValidator>
            <asp:CustomValidator ID="CustomValidator1" runat="server" 
                ClientValidationFunction="ValidateAddress" ControlToValidate="pickup" 
                CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="* Invalid pick-up address." 
                onservervalidate="puAddressValidator_ServerValidate" SetFocusOnError="True" 
                ValidationGroup="NewCallFormSubmit">*</asp:CustomValidator>
        </td>
        <td class="style48">
            No dorm pick-ups!</td>
        <td class="style13">
        </td>
    </tr>
    <tr>
        <td class="style14" align="right">
            Where is the <span class="style3"><strong>drop-off location?</strong></span></td>
        <td class="style15" colspan="2">
            <asp:TextBox ID="dropoff" runat="server" CausesValidation="True" 
                MaxLength="200" Rows="2" TextMode="MultiLine" 
                onchange="showDropoff()"></asp:TextBox>
        </td>
        <td class="style16">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" 
                ControlToValidate="dropoff" CssClass="ErrorMessage" ErrorMessage="* Enter the drop-off location." 
                Font-Bold="False" Display="Dynamic" ValidationGroup="NewCallFormSubmit">*</asp:RequiredFieldValidator>
            <asp:CustomValidator ID="CustomValidator2" runat="server" 
                ClientValidationFunction="ValidateAddress" ControlToValidate="dropoff" 
                CssClass="ErrorMessage" Display="Dynamic" 
                ErrorMessage="* Invalid drop-off address." 
                onservervalidate="doAddressValidator_ServerValidate" SetFocusOnError="True" 
                ValidationGroup="NewCallFormSubmit">*</asp:CustomValidator>
        </td>
        <td class="style47">
            <em>No Old-Town, bar, or party drop-offs!</em></td>
        <td class="style16">
        </td>
    </tr>
    <tr>
        <td class="style2" align="right">
            <asp:Image ID="checkMark" runat="server" ImageUrl="~/img/checkmark.png" 
                Height="20px" Visible="False" />
        </td>
        <td class="style44">
            <asp:Button ID="submitButton" runat="server" Text="Submit" ValidationGroup="NewCallFormSubmit" 
            OnClientClick="calcRoute()" onclick="submitButton_Click" />
        </td>
        <td class="style41">
            </td>
        <td class="style55">
            </td>
        <td>
            </td>
    </tr>
    <tr>
        <td class="style4" align="right">
            Thank you, there are
            <asp:TextBox ID="ridesAhead" runat="server" BorderStyle="Dotted" 
                Font-Bold="False" MaxLength="3" ReadOnly="True" Width="28px" 
                Font-Underline="False" ontextchanged="TextBox1_TextChanged" 
                style="text-align: center"></asp:TextBox>
                &nbsp;rides ahead of you...</td>
        <td class="style8" colspan="2">
            </td>
        <td style="font-style: italic" class="style5">
            &nbsp;</td>
        <td class="style46">
            We cannot give estimated wait times.</td>
        <td class="style5">
            </td>
    </tr>
    <tr>
        <td class="style4" align="right">
            The driver will call you at
            <asp:TextBox ID="phoneDisplay" runat="server" BorderStyle="Dotted" Font-Bold="False" 
                MaxLength="1" ReadOnly="True" Width="85px" Font-Underline="False" 
                ontextchanged="phoneDisplay_TextChanged" style="text-align: center"></asp:TextBox>
        &nbsp;when they arrive.</td>
        <td class="style8" colspan="2">
            </td>
        <td class="style5">
            </td>
        <td class="style46">
            Please verify the call-back number.</td>
        <td class="style5">
            </td>
    </tr>
    <tr>
        <td class="style20" align="right">
            </td>
        <td class="style21" colspan="2">
            <asp:Button ID="resetButton" runat="server" Text="New Call"
                onclick="resetButton_Click" CausesValidation="False" />
        </td>
        <td class="style22">
        </td>
        <td class="style35">
        </td>
        <td class="style22">
        </td>
    </tr>
    <tr>
        <td class="style2" align="right">
            </td>
        <td colspan="4">
            <asp:ValidationSummary ID="ValidationSummary1" runat="server" 
                CssClass="ErrorMessage" DisplayMode="List" 
                ValidationGroup="NewCallFormSubmit" />
        </td>
        <td>
        </td>
    </tr>
</table>

<table id="NewCallSubTable">          
    <tr>
        <td align="left" valign="top">
            <h1>
                Pick-Up and Drop-Off Locations
            </h1>
                <!-- Map Layout -->
                <div id="map_canvas" style="width: 500px; height: 500px;"></div>                          
        </td>

        <td valign="top" align="left">
            <h1>
                Current Bar/Party-House Black-List
            </h1>
            <uc:BlackListForm ID="BlackListForm1" runat="server"></uc:BlackListForm>
        </td>
    </tr>
</table>

<!-- Dynamic p/u & d/o location validator-->    
<script type="text/javascript">
    function ValidateAddress(source, args) {
        var dropoff = document.getElementById('<%= dropoff.ClientID %>');
        var pickup = document.getElementById('<%= pickup.ClientID %>');

        if (dropoff.value.length > 80 || pickup.value.length > 80) {
            args.IsValid = false;
            source.errormessage = "* Address must be 80 chars or less.";
        }
        else {
            args.IsValid = true;
        }
    }
</script>

<!--MAP SCRIPT--> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=<%= Google_API_key%>&sensor=false&v=3.7"></script>   

<!--INTELLISENSE HELPER-->
<script src="/Scripts/google-maps-3-vs-1-0.js" type="text/javascript"></script>

<!--MARKER_MANAGER SCRIPT--> 
<script src="http://gmaps-utility-library.googlecode.com/svn/trunk/markermanager/release/src/markermanager.js" type="text/javascript"></script>

 <!--GEOCODER/DIRECTIONS_DISPLAY SCRIPT-->
 <script type="text/javascript">
    var infoWindow, geocoder, directionsDisplay, map, transf_address;
    var default_zoom = parseInt('<%= default_zoom %>');
    var default_point = new google.maps.LatLng(40.575475, -105.084604);
    var directionsService = new google.maps.DirectionsService();
    var startLL, endLL;
    var markers = [];

    //Functions
    function initialize_map() {
        var mapOptions = {
            zoom: default_zoom,
            center: default_point,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            },
            navigationControl: true,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.SMALL
            }
        };

        geocoder = new google.maps.Geocoder();
        directionsDisplay = new google.maps.DirectionsRenderer();
        map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);            

        directionsDisplay.setMap(map);
    }

    function interpretKnownAddress(initAdd) {
        if (initAdd.indexOf("old town") != -1) {
            return "100 N College Ave, Fort Collins, CO 80524-2444";
        }
        else if (initAdd.indexOf("csu") != -1) {
            return "Colorado State University"
        }
        else {
            return initAdd + ", Fort Collins, Colorado";
        }
    }

    function showPickup() {
        var pickup_address = document.getElementById('<%=pickup.ClientID%>').value;

        if (pickup_address != '' && pickup_address != null) {
            transf_address = interpretKnownAddress(pickup_address);
            get_latlong(transf_address, "start");
        }
    }

    function showDropoff() {
        var dropoff_address = document.getElementById('<%=dropoff.ClientID%>').value;

        if (dropoff_address != '' && dropoff_address != null) {
            transf_address = interpretKnownAddress(dropoff_address);
            get_latlong(transf_address, "end");
        }
    }

    function get_latlong(srcAddress, markerType) {
        if (geocoder && markerType && srcAddress != '') {

            var geocoderRequest = {
                address: srcAddress
            };

            geocoder.geocode(geocoderRequest, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    map.setCenter(results[0].geometry.location);

                    if (markerType == "start") {
                        var greenA = new google.maps.MarkerImage('/img/MapMarkers/green_MarkerA.png');
                        marker = new google.maps.Marker({
                            icon: greenA,
                            map: map,
                            shape: {
                                type: 'poly',
                                coord: [4, 4, 29, 4, 29, 29, 22, 29, 17, 35, 16, 35, 10, 29, 4, 29, 4, 4]
                            }
                        });
                        markers.push(marker);
                        startLL = results[0].geometry.location;
                    }
                    else if (markerType == "end") {
                        var redB = new google.maps.MarkerImage('/img/MapMarkers/red_MarkerB.png');
                        marker = new google.maps.Marker({
                            map: map,
                            icon: redB,
                            shape: {
                                type: 'poly',
                                coord: [4, 4, 29, 4, 29, 29, 22, 29, 17, 35, 16, 35, 10, 29, 4, 29, 4, 4]
                            }
                        });
                        markers.push(marker);
                        endLL = results[0].geometry.location;
                    }
                    else {
                        marker = new google.maps.Marker({
                            map: map,
                            icon: 'icon.png',
                            shape: {
                                type: 'poly',
                                coord: [4, 4, 29, 4, 29, 29, 22, 29, 17, 35, 16, 35, 10, 29, 4, 29, 4, 4]
                            }
                        });
                        markers.push(marker);
                    }

                    marker.setPosition(results[0].geometry.location)
                    infoWindow = new google.maps.InfoWindow();
                    var infoContent = '<strong>' + results[0].formatted_address + '<strong>';
                    infoWindow.setContent(infoContent);
                    infoWindow.open(map, marker);
                }
            });
        } //if

        else {
            alert("Location: " + srcAddress + "could not be found! Please verify this location.");
        } //else
    } //end get_latlong

    function calcRoute() {                            
        var request = {
            origin: startLL,
            destination: endLL,
            provideRouteAlternatives: false,
            travelMode: google.maps.TravelMode.DRIVING
        };

        directionsService.route(request, function (result, status) {                
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(result);
            }
            else {
                alert('Route could not be displayed!')
            }
        });

        var center = new google.maps.LatLng((startLL.lat() + endLL.lat()) / 2, (startLL.lng() + endLL.lng()) / 2);
        map.setCenter(center);
    } //end calcRoute

    // Removes the overlays from the map, but keeps them in the array
    function clearMarkers() {
        if (markers) {
            for (i in markers) {
                markers[i].setMap(null);
            }
        }
    }

    // Shows any overlays currently in the array
    function showMarkers() {
        if (markers) {
            for (i in markers) {
                markers[i].setMap(map);
            }
        }
    }

    // Deletes all markers in the array by removing references to them
    function deleteMarkers() {
        if (markersy) {
            for (i in markers) {
                markers[i].setMap(null);
            }
            markers.length = 0;
        }
    }

    //initialization listener
    google.maps.event.addDomListener(window, 'load', initialize_map);

</script>

<!--End Google Scripts-->
4

0 回答 0