hello,
i have this google api code it works fine
the only problem is coming that when user select any address from google auto complete <span> validation flashes then hide
instead of flashed error in span i want it flash it label
<div>
<style>
.pac-container
{
z-index: 1060 !important;
}
.pac-container:after
{
content: none !important;
}
</style>
<script type="text/javascript">
var fromAddress;
var toAddress;
$(function () {
var textbox1 = $(this).find('[id*=txtfrom]');
var textbox2 = $(this).find('[id*=txtto]');
ApplyAutoComplete(textbox1);
ApplyAutoComplete(textbox2);
$(textbox1).blur(function () {
var address = $(this).val();
if (address == fromAddress) {
$('[id*=lblFrom]').hide();
} else {
$('[id*=lblFrom]').show();
}
});
$(textbox2).blur(function () {
var address = $(this).val();
if (address == toAddress) {
$('[id*=lblTo]').hide();
} else {
$('[id*=lblTo]').show();
}
});
});
function ApplyAutoComplete(input) {
google.maps.event.addDomListener(window, 'load', function () {
var places;
for (var i = 0; i < input.length; i++) {
var options = { types: ['(regions)'] };
places = new google.maps.places.Autocomplete(input[i], options);
}
google.maps.event.addListener(places, 'place_changed', function () {
if ($(input)[0].id == $('#<%=txtfrom.ClientID%>')[0].id) {
fromAddress = places.getPlace().formatted_address;
$('[id*=txtfrom]').val(fromAddress);
$('[id*=txtfrom]').trigger("blur");
} else if ($(input)[0].id == $('#<%=txtto.ClientID%>')[0].id) {
toAddress = places.getPlace().formatted_address;
$('[id*=txtto]').val(toAddress);
$('[id*=txtto]').trigger("blur");
}
<%-- var place = places.getPlace();
var lat = place.geometry.location.lat();
var lng = place.geometry.location.lng();
//alert("Latitude is " + lat + "\n" + "longitude is " + lng)
$('#<%=lblorigin_longitude.ClientID%>').html(lat)
$('#<%=lblorigin_longitude.ClientID%>').html(lat)
$('#<%=lbldestination_longitude.ClientID%>').html(lat)
$('#<%=lbldestination_latitude.ClientID%>').html(lat)--%>
//document.getElementById('lblorigin_longitude').innerHTML = lng.val;
//document.getElementById('lblorigin_latitude').innerHTML = lat.val;
});
});
};
</script>
<%-- //----------------- Timer page scroll start-----------------%>
<%-- <script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(beginRequest);
function beginRequest() {
prm._scrollPosition = null;
}
</script>--%>
<%-- //----------------- Timer page scroll end----------------%>
<div class="form-group col-md-2 padding2">
Origin
<asp:TextBox ID="txtfrom" runat="server" onchange="UploadFile()"></asp:TextBox>
<asp:Label ID="Label6" runat="server" Text="Origin is required" CssClass="validation"
Visible="false"></asp:Label>
<span id="lblFrom" style="display: none; color: Red;">Select a valid origin city/municipality</span>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Select a valid origin city/municipality"
CssClass="validation" ControlToValidate="txtfrom" Display="Dynamic"></asp:RequiredFieldValidator>
</div>
<div class="form-group col-md-2 padding2">
<div runat="server" id="destination">
Destination
<asp:TextBox ID="txtto" runat="server" onchange="UploadFile()"></asp:TextBox>
<span id="lblTo" style="display: none; color: Red;">Select a valid destination city/municipality</span>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="Select a valid destination city/municipality"
CssClass="validation" ControlToValidate="txtto" Display="Dynamic"></asp:RequiredFieldValidator>
<%--///calculate distance between origin and destination thru timer--%>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Llbldistance" runat="server" Text=""></asp:Label><br />
<asp:Label ID="Llblduration" runat="server" Text=""></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" Style="display: none" />
<%--<asp:Timer ID="timer" runat="server" Interval="1000">
</asp:Timer>--%>
<br />
<asp:Label ID="lblorigin_longitude" runat="server" Text="" Visible="false"></asp:Label><br />
<asp:Label ID="lblorigin_latitude" runat="server" Text="" Visible="false"></asp:Label><br />
<asp:Label ID="lbldestination_longitude" runat="server" Text="" Visible="false"></asp:Label><br />
<asp:Label ID="lbldestination_latitude" runat="server" Text="" Visible="false"></asp:Label><br />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
<script type="text/javascript">
function UploadFile() {
document.getElementById("<%=Button1.ClientID %>").click();
if ($('#<%= txtto.ClientID %>').val() != '') {
document.getElementById("<%=RequiredFieldValidator4.ClientID%>").val('');
}
if ($('#<%= txtfrom.ClientID %>').val() != '') {
document.getElementById("<%=RequiredFieldValidator3.ClientID%>").val('');
}
}
</script>
</div>