Page view counter

[How Do I:] Use the ASP.NET AJAX DynamicPopulate Extender?

Please install Silverlight or click download to watch video locally.

Watch a demonstration of using the ASP.NET AJAX DynamicPopulate extender to dynamically populate an area of a web page with the results of an asynchronous call to a web method.

Presented by Joe Stagner

Duration: 11 minutes, 19 seconds

Date: 31 January 2007

Watch    Video   |   Download    Video   |   VB Code    C# Code

Video downloads: WMV

Audio downloads:

Comments : 11

Leave a Comment

ajaykaushik : On May 12, 2008 11:53 AM said:

Hi,

I have been dynamic populate extender and its working in IE. But when i run it in Firefox it doesn't work. I get "Web Service call failed: 500" error. In IE its been working. I have used mostly the code available in tutorial only change is that i had to specify behaviorid to get it working.

Rest is pretty similar to Tutorial code.

Here is the code that i am using

<script type="text/javascript" language="javascript">

           function showSellerName(value){

               if (value != ''){

                   var behavior = $find('dp1');

                   if(behavior){

                       behavior.populate(value);

                   }

               }

           }

</script>

               </ajaxToolkit:DynamicPopulateExtender>

Please advise me what should i do to get it working in firefox as well.

Thanks.

rjv_rnjn : On July 22, 2008 1:51 PM said:

A sample code for achieving this in a drop-down list would be nice. As the value required to bind the drop down is a data table and not a string (in almost all cases). Currently when I wire the javascript method with the OnSelectedIndexChanged method of drop down list the web service method doesn't fire up (actually it doesn't compile at all). Any help would be great.

Thanks.

fsteveb : On August 05, 2008 2:36 PM said:

I have been trying to use the ajaxToolkit:ModalPopupExtender to popup a modal window showing info when a link in a datagrid is clicked.

           

               

               

               

                   

                   

                       TargetControlID="LinkButton" PopupControlID="Panel2" OkControlID="Button1"

                       BackgroundCssClass="modalBackground" DynamicControlID="lblComments"

                       DynamicContextKey='<%# Eval("Comments") %>' DynamicServiceMethod="GetContent" />

                 

                 Comments

               

               

           

       

           

  <%-- All ModalPopups share the same popup --%>

   

     

Comments: <asp:Label ID="lblComments" runat="server" />

     

<asp:Button ID="Button1" runat="server" Text="OK" />

   </asp:Panel>

I placed the method in the codebehind which looks like this.

   [System.Web.Services.WebMethod, System.Web.Script.Services.ScriptMethod]

   public string GetContent(string contextKey)

   {

       // Create a random color

       string color = (new Random()).Next(0xffffff).ToString("x6");

       // Use the style specified by the page author

       string style = contextKey;

       // Display the current time

       string time = DateTime.Now.ToLongTimeString();

       // Compose the content to return

       return "<span style='color:#" + color + "; '>" + time + ": " + contextKey + "</span> ";

   }

When I click on the link I get the modal popup but the message is "Comments: Web Service call failed: 500"

Any idea why I am not able to call the webmethod?

cv_vikram : On August 06, 2008 1:24 PM said:

It is simple and good.

Roc1 : On August 15, 2008 10:50 AM said:

>rjv_rnjn : On July 22, 2008 1:51 PM said:

>A sample code for achieving this in a drop-down list  >would be nice.

Markup:

-----------------------------------------

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit, Version=3.0.20229.20843, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"

Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<head id="Head1" runat="server">

   <title>Untitled Page</title>

   <style type="text/css">

       .dynamicPopulate_Normal

       {

       border: 1px inset #000080;

       padding: 2px;

       text-align: center;

       height: 1.5em;

       margin: 5px;

       width: 400px;

       }

       .dynamicPopulate_Updating

       {

       background-image:url(images/loading.gif);

       background-repeat:no-repeat;

       border: 1px inset #000080;

       text-align:center;

       height:1.5em;

       margin:5px;

       width:400px;

       }

   </style>

   <script type="text/javascript">

       function updateSelection(value) {

           var behavior = $find('DynamicPopulateExtender1');

           if (behavior) {

               behavior.populate(value);

           }

       }

   </script>

</head>

<body>

   <form id="form1" runat="server">

   

   Select your favorite vegetable:

   

       Spinach

       Cucumber

       Tomato

       Eggplant

   

   

   

   

   

       targetcontrolid="Panel1" servicemethod="Refresh" updatingcssclass="dynamicPopulate_Updating">

       </ajaxToolkit:dynamicpopulateextender>

   </form>

</body>

</html>

Code-Behind:

--------------------------------------------

using System;

public partial class _Default : System.Web.UI.Page

{

   protected void Page_Load(object sender, EventArgs e)

   {

       ddlVegetables.Attributes.Add("OnChange", "updateSelection(this.value);");

   }

   [System.Web.Services.WebMethod()]

   [System.Web.Script.Services.ScriptMethod()]

   public static string Refresh(string contextKey)

   {

       System.Threading.Thread.Sleep(1000);

       var text = string.Format("You selected: {0}", contextKey);

       return string.Format("<span style='font-family:courier new;font-weight:bold;'>{0}</span>", text);

   }

}

NewDays : On August 28, 2008 1:21 PM said:

I am trying to update the imageurl that the Image2 control looks at.  I keep getting inner html problems...meaning I didn't write the dynamic page that keeps popping up.  Please help.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">www.w3.org/.../xhtml1-transitional.dtd">

">www.w3.org/.../xhtml">

   

   

   

   

   

                               style="z-index: 1; left: 700px; top: 124px; position: absolute; height: 378px; width: 405px">

                               

                                   

                                       ImageUrl="~/Indicator Light/red.bmp" />

                                   

                                       Enabled="True" PopulateTriggerControlID=""  ServiceMethod="GetDynamicContent"

                                       TargetControlID="Image2" UpdatingCssClass="dynamicPopulate_Updating">

                                   

<%--                                    

                                       style="position: absolute; top: 7px; left: 124px; height: 82px; width: 214px"

                                       onselectedindexchanged="RadioButtonList1_SelectedIndexChang ed"

                                       AutoPostBack="True">

                                       Not meeting current obligations

                                       Turning away new work

                                       Able to accept new work

                                       Excess capacity

                                   --%>

                                   

       

           

               

                   type="radio" value='r' />R)Not meeting current obligations

           

               

                   value='y' />Y)Turning away new work

           

               

                   value='g' />G)Ready to accept future work

           

               <input id="r3" name="rbFormat" onclick="updateDateKey(this.value);" type="radio"

                   value='b' />B)Excess acity</label><br />

       </div>

                               </asp:Panel>

Sorry about the poor indenting'I have been playing with the functionality and not the appearance.

ak_friendz : On October 05, 2008 12:22 PM said:

Simple and easy to implement....

som nath shukla : On October 27, 2008 8:00 AM said:

I am using the same dropdown and dynamic extender control. Every thing is fine when i am using mouse to change the selection in Dropdownlist. But when i use Tab and up/down key change the selection of dropdownlist. Dynamic extender event is not firing.

Plz reply ASAP.

djibril_chimere_DIAW : On December 30, 2008 4:49 AM said:

Thanks! Jërëjëf!

bgates1970 : On January 16, 2009 4:28 PM said:

Any ideas on how to use this inside a repeater control?  For example, i have a repeater control that shows a list of products.  when a user clicks on the link button i want to display underneath the link some dynamic text.

I can get it to work great with a Modal Popup but I need a hovermenu to display underneath instead.

haithemara : On May 06, 2009 2:09 AM said:

Nice video . Thank you Joe.

I do have a question.

The definition of the GetHtml function is different in both the populateExtenderControl and the service call. In other words, in the control you specify that the ServiceMethod="GetHtml" with no parameters and in the service call you specify that public static string GetHtml(string contextKey) accept a parameter. Hence, i have to assume that control default behavior is to accept the contextkey, but this property is ommitted.

Can you please explain this ?

thank you.

Leave a Comment

You must be logged in to leave a comment. Click here to log in.

Microsoft Communities