Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

How to use jquery inside GridView inside UpdatePanel

Posted on 2010-09-16
5
Medium Priority
?
1,113 Views
Last Modified: 2012-08-14
Hi,

I have a GridView inside an UpdatePanel which is cool and works well.

The GridView provides the option to edit rows.

One of the columns in the GridView is a date column for which I am using the jquery datepicker.

Now when the page initially loads the GridView is in read mode, and therefore doesn't load the datepicker.

But when you click the edit button the UpdatePanel does its thing and reloads what it needs to present a row for editing.

What I can't get my head around is how to:

a) load the jquery library as before the UpdatePanel I was using Page.ClientScript.RegisterClientScriptBlock which means that the script is loaded intelligently rather than statically.

b) how to fire up the datepicker which needs a javascript funtion to be called once the load is complete. Before using the UpdatePanel this was $(document).ready(function(){$("#<%=DateField.ClientID%>").datepicker(...)});

If someone can help me solve this it would be much appreciated.

Cheers,

Dale
0
Comment
Question by:Dale Burrell
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 14

Expert Comment

by:existenz2
ID: 33699070
You can use the ScriptManager. That also has a method to load the jquery library (I forgot which exactly, but it'something like: ScriptManager.ClientScript.RegisterClientScriptBlock.
For question b)
Easiest would be to make a method like in the code example and then put the LoadDatePicker(this) on the onclick attribute from the gridviewcolumn.
function LoadDatePicker(column)
{
 $(document).ready(function(){$(column.id).datepicker(...)});
}

Open in new window

0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 33699141
Yeah I tried using the ScriptManager (It seems that one can access a static instance of it, or the actual instance and not sure what the difference it). and it threw an error saying something along the lines of it couldn't find the js file or didn't have access to it, yet when I copied the exact URL from the error message and slapped it into the browser it loaded perfectly.
0
 
LVL 21

Author Comment

by:Dale Burrell
ID: 33699154
When you say the onclick method are you talking about the catching the event when the person clicks in the textbox to enter a date? Because the datepicker itself uses that to open itself, so I think the code I showed needs to have run previous to that to allow it to attach its event handlers.

Surely there is a general solution for running javascript that is specific to a user control in such a case as this?
0
 
LVL 21

Accepted Solution

by:
Dale Burrell earned 0 total points
ID: 33711085
Found a solution.

For part A if you register a script with ScriptManager it appears that it needs to call the methods in the asp.net ajax library telling it when the script has finished loading. Since we're talking jquery I decided not to do that and instead load it in every page in the normal place.

For part B I managed to use the ScriptManager to load a customised version of the function show. I'm assuming that scripts loaded through ScriptManager will only be run once the ajax call is complete and therefore my sequencing works.
0
 
LVL 14

Assisted Solution

by:existenz2
existenz2 earned 1000 total points
ID: 33743414
From my knowledge you are correct on that.
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

721 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question