Question

Hi guys I have a user control:

<input type="text" id="datepicker" runat="server" readonly="readonly" />
 <img src="../images/remove.png" id="test" onclick="ClearFeild()" runat="server" />

My aspx page looks like this:

<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolderBody" runat="server">

    <uc:Calendar ID="calSample" runat="server" ChangeMonth="false" ChangeYear="false"
        DateFormat="dd-M-yy" TextBoxWidth="75px" Enabled="true" />
    <uc:Calendar ID="Calendar1" runat="server" ChangeMonth="false" ChangeYear="false"
        DateFormat="dd-M-yy" TextBoxWidth="75px" Enabled="true" />
</asp:Content>

And on the user control I have a javascript function that gets called on the img onclick:

    function ClearFeild()
    {     
       debugger; 
       $("#<%=datepicker.ClientID %>").val() = "";
    }

but the value of

$(“#<%=datepicker.ClientID %>”);

is always :

$(“#ContentPlaceHolderBody_Calendar1_datepicker”);

which is the second user control, even though i click on the first control.

PLease assist as to how i can over come this.

The CLearFeild function gets called on a button click to clear the datepicker feild.

Kind regards.

Answer 1

You need to pass the source object to your function

Live Demo

onclick="ClearFeild(this)"

function ClearFeild(source) {        
    obj = $('#' + source.id)
    prevInput = obj.prev('input[type=text]')
}​