Today, I am going to show you how to fixed Silverlight 6 Control Content always null from Javascript Access. I got an Error when  I try to access the Silverlight object from the client side. Here’s the following snippet code from client site.

function search() {
            try {
                var silverLightControl = document.getElementById("silverlightControl");
                silverLightControl.Content.Page.SetUser(document.getElementById("txtUser").value);
            } catch (e) {
                alert(e.description);
            }
        }

The page with silverlight object embedded
    <div id="silverlightControl">
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
          <param name="source" value="ClientBin/SLAspxCommunication.xap"/>
          <param name="onError" value="onSilverlightError" />
          <param name="background" value="white" />
          <param name="minRuntimeVersion" value="5.0.61118.0" />
          <param name="autoUpgrade" value="true" />
          <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=5.0.61118.0" style="text-decoration:none">
               <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
          </a>
        </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>

At the silverlight object class,  we have registered the page as javascriptable object with following line

HtmlPage.RegisterScriptableObject("Page", this);
public MainPage()
        {
            InitializeComponent();
            _users = GenerateList();
            HtmlPage.RegisterScriptableObject("Page", this);
        }

The function looks simple that I just want to call the Silverlight function to search the user, unfortunately. This error message below always popped up.

When I debug the process, it indicate that the control did not contain a Content element.  This Error
var silverLightControl = document.getElementById("silverlightControl");

It will load the Div Control instead of the object container that host the silverlight object.  After I set the id to be silverlightControl for the object tag. then  search function funtion well and access the SetUser function in the silverlight object.
   <div>
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%" id="silverlightControl">
          <param name="source" value="ClientBin/SLAspxCommunication.xap"/>
          <param name="onError" value="onSilverlightError" />
          <param name="background" value="white" />
          <param name="minRuntimeVersion" value="5.0.61118.0" />
          <param name="autoUpgrade" value="true" />
          <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=5.0.61118.0" style="text-decoration:none">
               <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
          </a>
        </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>

HostForLIFE.eu Silverlight 6 Hosting
HostForLIFE.eu is European Windows Hosting Provider which focuses on Windows Platform only. We deliver on-demand hosting solutions including Shared hosting, Reseller Hosting, Cloud Hosting, Dedicated Servers, and IT as a Service for companies of all sizes. We have customers from around the globe, spread across every continent. We serve the hosting needs of the business and professional, government and nonprofit, entertainment and personal use market segments.