0

When i use the below code in webpage (.aspx file), it works fine; but when I use the below in a user control (.ascx file) it does not work.

How to fix this? Do i have to do any modifications in the masterpage.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ExclusionSwipeCardRequest.ascx.cs" Inherits="ExclusionSwipeCardRequest" %>
<link type="text/css" rel="stylesheet" href="../App_Themes/LMSTheme/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="../Scripts/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" language="javascript">
$(function() {
    $("#txtFromDate").datepicker({ dateFormat: 'mm-dd-yy', changeMonth: true, changeYear: true });   
});
</script>

<asp:TextBox ID="txtFromDate" MaxLength="10" runat="server" autocomplete="off" ToolTip="Enter From Date"></asp:TextBox>
Ashish
  • 2,544
  • 6
  • 37
  • 53
Kajah User
  • 593
  • 5
  • 17
  • 56

3 Answers3

1

the id for the textbox is not correct,

try

$("#<%=txtFromDate.ClientID%>").datepicker({ dateFormat: 'mm-dd-yy', changeMonth: true, changeYear: true });

instead of

$("#txtFromDate").datepicker({ dateFormat: 'mm-dd-yy', changeMonth: true, changeYear: true });
Pedro Costa
  • 2,968
  • 2
  • 18
  • 30
0

I might suggest that your paths have changed, which would mean that the src/href value of the script/CSS imports are wrong.

Rather than using relative paths that jump up directories, you could try qualifying the path from the root of the website (starting the URL with a forward-slash /), such that:

<link type="text/css" rel="stylesheet" href="/Scripts/App_Themes/LMSTheme/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="/Scripts/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.16.custom.min.js"></script>

Obviously if there are any paths between the root and the Scripts folder, you would need to specify it, for example:

src="/MyIntermediatePath/Scripts/jquery-1.6.2.min.js"

Also worth mentioning is that although control ID prefixing can be managed (even turned off in .NET4), generally server-side controls have IDs in the page that have been concocted by their parent container, such as:

txtFromDate -> ctl001_txtFromDate

If you weren't using a server-side control in the page initially, you might want to check you haven't introduced an issue with jQuery finding the control in the rendered page.

Grant Thomas
  • 44,454
  • 10
  • 85
  • 129
  • Should he be importing the scripts in the ASCX at all? Shouldn't that be handed back to the page e.g. with [ScriptManager](http://msdn.microsoft.com/en-us/library/bb398863.aspx)? – Rup Sep 08 '11 at 10:37
  • @Rup That's a different matter, I guess; you're correct (IMO), but for the sake of the problem at hand, this may well help solve it. Don't really want to start a debate over _where_ these files _should_ be referenced. – Grant Thomas Sep 08 '11 at 10:38
  • No it is not working......the problem is in usercontrol only.....how to use in usercontrol..... – Kajah User Sep 08 '11 at 10:40
  • i want to use this is one in jquery a? eg $("#ctl001_txtFromDate").datepicker( – Kajah User Sep 08 '11 at 10:46
  • Well, not really, but you could try `$("input[type='text']:eq(0)")`. This will grab the first text input on the page and should suit this purpose, though it is not robust and open to failure when page structure changes. – Grant Thomas Sep 08 '11 at 10:48
  • how to give in my jquery it is not working in the usercontrol – Kajah User Sep 08 '11 at 10:55
  • i have used like this is not working $('input[name="txtFromDate"]').datepicker(); – Kajah User Sep 08 '11 at 11:01
0

the problem is the src url in your script references. it's relative to the page's location where control is used, not the control itself.

I recommend you put your css/script links in the [master]page instead of user control.

Ruslan
  • 9,927
  • 15
  • 55
  • 89