i have this user control works fine, the only problem is when user is using user control 1 and type in address and not select address so javascript validation appears but it appears in both user control it should appear only to that user contorl which user is using currently
pls advice
when i add another instance of same user control like this
<%@ control language="C#" autoeventwireup="true" codebehind="GoogleAddressDifference.ascx.cs"
inherits="EcheckCallV2.usercontrol.GoogleAddressDifference" %>
<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");
}
});
});
};
</script>
<div class="form-group col-md-2 padding2">
<span class="none">Origin </span>
<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">
<span class="none">Destination </span>
<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" />
<br />
<%-- <asp:HiddenField ID="lblorigin_longitude" runat="server"/>--%>
<asp:Label ID="lblorigin_longitude" runat="server" Style="display: none"></asp:Label>
<br />
<asp:Label ID="lblorigin_latitude" runat="server" Style="display: none"></asp:Label>
<%-- <asp:HiddenField ID="lblorigin_latitude" runat="server" />--%>
<br />
<%-- <asp:HiddenField ID="lbldestination_longitude" runat="server" />--%>
<asp:Label ID="lbldestination_longitude" runat="server" Style="display: none"></asp:Label>
<br />
<asp:Label ID="lbldestination_latitude" runat="server" Style="display: none"></asp:Label>
<%-- <asp:HiddenField ID="lbldestination_latitude" runat="server" />--%>
<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>
<%@ Register Src="~/usercontrol/GoogleAddressDifference.ascx" TagPrefix="uc1" TagName="GoogleAddressDifference" %>
<uc1:GoogleAddressDifference runat="server" ID="GoogleAddressDifference" />
<uc1:GoogleAddressDifference runat="server" ID="GoogleAddressDifference1" />