Javascript in a dynamically created Raddock

5 posts, 0 answers
  1. Bill DeLisi
    Bill DeLisi avatar
    3 posts
    Member since:
    Jul 2007

    Posted 13 May 2008 Link to this post

    I am sorry if this has been asked before, but I couldn't seem to find anything on it and don't have enough development background to figure it out. I have docks being dynamically created based on some of the Telerik sample code. When the user adds the dock the contents are populated with a user control that is pulled from a database. The user control contains some javascript that needs to run immediately after the dock is loaded, but only seems to intiate after a postback. Anytime that dock is loaded afterwards the contents are displayed fine. Is there something I can do to make that load during the initial creation. Thank you!
  2. Dimcho
    Admin
    Dimcho avatar
    45 posts

    Posted 16 May 2008 Link to this post

    Hi Bill DeLisi,

    The Dynamically Created Docks demo shows how using AJAX you can add newly created docks without a postback. The new docks are firstly created in a hidden UpdatePanel,  and then transferred to a dock zone with client-side script. If your code fires only when a postback occurs, the problem is maybe related with the AJAX.

    We need more details about your scenario and the problem you experience.
    Please open a new support ticket and send us a small sample project which reproduces the problem and we will do our best to help you.


    Kind regards,

    Dimcho
    the Telerik team


    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Imran
    Imran avatar
    24 posts
    Member since:
    Jan 2007

    Posted 22 Mar 2011 Link to this post

    Just bringing this question back to life.. 

    for example, if I was dynamically adding a dock (UserControl) which only had the content:

    <script type='text/javascript'>
    alert("sdfdfgdfgdfg");
    </script>

    The alert is not fired when the dock is added. But when the page is re-loaded or refreshed the alert is triggered.

    This is a basic example, and we have controls that have things like twitter feeds using javascript and none of our javascript content is loaded. Is there a workaround for this?

    All help would be appreciated.

    Thanks
  5. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 23 Mar 2011 Link to this post

    Hi Imran,

    This is not directly related to the RadDock control, because if you try to add any user control dynamically during ajax request, its scripts will not be executed.
    This problem can be solved, by manually evaluating the scripts in the user control, by registering a script from the code behind. What you need to do is place the JS code of every user control into asp:Panel control with ID="Panel1". Then in the code behind of the main page, where the docks are added for the first time - on button.click for example we add the following code (highlighted in yellow):

    protected void ButtonAddDock_Click(object sender, EventArgs e)
    {
        RadDock dock = CreateRadDock();
        //find the target zone and add the new dock there
        RadDockZone dz = (RadDockZone)FindControl(DropDownZone.SelectedItem.Text);
        dz.Controls.Add(dock);
        CreateSaveStateTrigger(dock);
     
        //Load the selected widget in the RadDock control
        dock.Tag = DroptDownWidget.SelectedValue;
        LoadWidget(dock);
     
        Control widget = dock.ContentContainer.Controls[0];
        Control panelScript = widget.FindControl("Panel1");
        if (panelScript != null)
        {
            var script = string.Format("eval(document.getElementById('{0}').getElementsByTagName(\"script\")[0].innerHTML);", panelScript.ClientID);
            ScriptManager.RegisterStartupScript(this, this.Page.GetType(), "key1", script, true);
        }
    }

    What it does is, it gets the ClientID of the panel, and registers a script that searches the panel's HTML element on the client (using the ClientID), and evaluates the script tag.

    The script in the user control should look like the following:
    <asp:Panel ID="Panel1" runat="server">
        <script type="text/javascript">
            alert("alert message");
        </script>
    </asp:Panel>


    Greetings,
    Pero
    the Telerik team
  6. Imran
    Imran avatar
    24 posts
    Member since:
    Jan 2007

    Posted 23 Mar 2011 Link to this post

    Pero

    Thanks for that. That worked great.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017