asked on

Why jquery datepicker won't work in asp.net?

Hi, I'm using vs2012.
I have a project made from asp.ent web form project template. I put a textbox in the the derault.aspx. I would like to have a datepicker, jquery plugin, to pop up when the textbox is clicked. But nothing happens when I click on it. Also, it's expecting a parameters when calling datepicker and intellisence shows lots of selection. Can I leave it blank? Will the value selected from the datepicker automatically be put in the textbox?
Attached is the site.master and default.aspx and default.cs.
Site.Master
Default.aspx
Default.aspx.cs

Dao Nguyen

1. you can use default datepicker
$("#textboxid").datepicker()

2. you can use datepicker with more option
$( "#textboxid" ).datepicker({
beforeShowDay: $.datepicker.noWeekends
...
});

Dave Baldwin

Jquery doesn't runat="server". You need to look at the "View Source" in your browser to see what the jquery code sees. You should not see runat="server" anywhere in the "View Source" in your browser.

lapucca

ASKER

I use just the default and it still won't work.
$(function () {
$("#<%= TextBox1.ClientID %>").datepicker();
});
I don't see the runat=server in source, which I'm attaching here. I used jQuery before with asp.net but never had this much problem getting it to work. Thank you.
datepicker-Source.html

ASKER CERTIFIED SOLUTION

Gary

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

lapucca

ASKER

I moved the jQuery ref back to site.master head section. I also removed the jQuery ref generated by asp.net web form template, these 2 lines of code were in the site.master file under the script manager.
<asp:ScriptReference Name="jquery" />
<asp:ScriptReference Name="jquery.ui.combined" />
But still nothing happens when I click on the textbox.
I'm attaching the new source code page, site.master and the default.aspx
datepicker-Source-2.html
Site.Master
Default.aspx

lapucca

ASKER

I also tried the other way around. I removed the 3 lines of jQuery ref in the head section and just used the asp.net built-in jQuery ref but that doesn't work either. Nothing happens when I click on the textbox. This is pretty crazy stuff with VS2012 trying to add in all these jQuery and other jscript ref that is breaking the code.
If you look at the site.master file, there are a bunch of script ref under the Scriptmanager tag. I don't know what exactly I can remove. This came with asp.net web form project template.

lapucca

ASKER

Gary,
You're correct. I just created an empty asp.net project and the calendar easily come up. In my project I only have a gridview control on my page. What can I remove under the scriptmanager on the master file? I see there is a gridview js in there. Also, should I just use the built-in jQuery or ref my own?
Thank you.

Gary

So if you remove the gridview from your test project it works but when you add it then it stops working?
Sometimes just changing the order of the script loading can fix things
So try putting your jquery stuff after your asp:ScriptManager block

lapucca

ASKER

In my project there is a gridview control In the test projects, there is no gridview control, just text box for testing.
The test project that works is creating using the Empty asp.net application and it has no scripting bundle created for it.

I can only put my jquery script in the aspx page after the page content tag because having to ref the textbox control ClientID and it won't work in the site.master page where Script manager tag is.

Gary

You can move the jQuery js files though, that doesn't affect anything else, so they are after all your other js scripts.

lapucca

ASKER

Okay, got it to work in both Chrome and IE, however, getting the following error in Firebug when I run it in Firefox.
uncaught exception: Missing instance data for this datepicker
The Web Console logging API (console.log, console.info, console.warn, console.error) has been disabled by a script on this page.

What I did is remove the jQuery ref in the Script Manager and put the jQuery ref in the Head section of the site.master file. How to get rid of this problem in Firefox?
Site.Master
Default.aspx

lapucca

ASKER

Thank you.