Issue with multiple GoogleMap HTMLPlaceholder and RadWindow

3 posts, 1 answers
  1. Pierre
    Pierre avatar
    7 posts
    Member since:
    Jun 2010

    Posted 14 Nov 2012 Link to this post

    Hello, here my problem.

    First i Have a page that contain an HTMLPlaceHolder. This HTMLPlaceHolder host a GoogleMap HTMLPage that can be piloted without any problem with javascript code called from SIlverlight. See above :

    My HTMLPlaceHolder :
    <telerik:RadHtmlPlaceholder  UrlLoaded="HtmlPh_GoogleMap_UrlLoaded" Name="HtmlPh_GoogleMap" SourceUrl="HtmlFiles/GoogleMap.html" VerticalAlignment="Stretch" />


    Silverlight Button Click event :
    private void Bt_Zoom_Click(object sender, RoutedEventArgs e)
           {
               JavascriptGoogleMapHelper.CallJavascriptFunction(HtmlPh_GoogleMapFromChildWindows, "Zoom", new string[] { "48.08", "-0.75" });
           }

    the CallJavascriptFunction :
    public static void CallJavascriptFunction(RadHtmlPlaceholder _HtmlPh_GoogleMap, string _functionName, string[] _parameters)
            {
                // Get the IFrame from the HtmlPresenter
                HtmlElement iframe = (HtmlElement)_HtmlPh_GoogleMap.HtmlPresenter.Children[0];
                // Set an ID to the IFrame so that can be used later when calling the javascript
                iframe.SetAttribute("id", "myIFrame");
     
                string code = "";
     
                if (_parameters != null)
                {
                    // Code to be executed
                    code = "document.getElementById('myIFrame').contentWindow." + _functionName + "(";
     
                    for (int i = 0; i < _parameters.Length; i++)
                    {
                        code += _parameters[i] + ",";
                    }
                    code = code.Substring(0, code.Length - 1);
                    code += ");";
                }
                else
                {
                    // Code to be executed
                    code = "document.getElementById('myIFrame').contentWindow." + _functionName + "();";
                }
                try
                {
                    HtmlPage.Window.Eval(code);
                }
                catch (Exception ex)
                {
                    ErrorChildWindow _errorWindow = new ErrorChildWindow("Code : " + code + "execption : "+ ex.Message.ToString(), true, 1);
                }
          }

    the javascript function :
    function Zoom(_lat, _lng) {
        map.setCenter(new google.maps.LatLng(_lat, _lng));
        map.setZoom(17);
        alert('Zoomed from Child');
    }

    This code just work perfectly, but now i need to host a second GoogleMapPage in a radWindows on this same page. So I just repeat my code and the GoogleMap seems to load properly. I set a different HTMLpage to load in the second HTMLPlaceHolder (like this)

    <telerik:RadHtmlPlaceholder UrlLoaded="HtmlPh_GoogleMap_UrlLoaded" Name="HtmlPh_GoogleMapFromChildWindows" SourceUrl="HtmlFiles/GoogleMapChildWindows.html" />
    But when i'm calling my CallJavascriptFunction, the javascript code is always executed on the first map, not on this in the RadWindow. I tried to create two différent javascipt file (one for each htmlPage) but nothing change, can't call javascript code that is hosted in my second HTMLPlaceHolder :/

    Any Idea ??

    Thx a lot !
  2. Answer
    Hristo
    Admin
    Hristo avatar
    352 posts

    Posted 20 Nov 2012 Link to this post

    Hi,

    Looking at your code I have noticed that you are setting the string "myIFrame" for IFrame id. Calling the same function for different maps sets the same id to the iFrame(s). Thus, I could conclude that calling "document.getElementById('myIFrame')" always returns the first iFrame. Having that in mind, makes sens that function call is always directed to the first map zoom.

    Regards,
    Hristo
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Pierre
    Pierre avatar
    7 posts
    Member since:
    Jun 2010

    Posted 20 Nov 2012 Link to this post

    Thx a lot, i add a parameter to set a different MyIFrame for each map and that did the trick. Dunno why i didn't try this before :(

    Good job as always Telerik, thx again Hristo !!
Back to Top