Javascript Button that fires a SilverLight method?

Question

I've created a Silverlight application that basically builds a cross section image of a multi-layered sphere (think concentric circles) from data stored in a JSON string. The JSON string is an array of diameter+color values, and looks like so:

[{"diam":100,"color:"#ffffff"},{"diam":150,color:"#ff0000"}]

I have everything working within Silverlight. When I load the app in a browser with the JSON above, I successfully get a rendering of two concentric circles, the inner circle is white (#ffffff) with a diameter of 100 pixels, and the outer circle is red (#ff0000) with a diameter of 150 pixels. Great.

Now, I have to integrate this within an HTML page and pass that JSON data from javascript to Silverlight. I'm using the HTMLBridge capabilities that SIlverlight offers but I'm having trouble calling the Silverlight method that builds the viz from Javascript.

The method name in Silverlight is BuildViz(), which removes all existing elements from the Silverlight canvas and then re-builds the visualization from a public property named JSONData. JSONData calls the BuildViz() method upon setting it's value:

[ScriptableMember()]
public string JSONData { 
    get { return _JSONData; } 
    set { _JSONData = value; BuildViz(); } 
}

I have tried exposing the JSONData to javascript using HTMLBridge and setting it's value via javascript but it seems that the BuildViz() method is not called (or it is called but it has no effect on my canvas). Not sure where to go from here. The examples of HTMLBridge that I've seen online are very basic and only deal with simple methods like converting a string to uppercase and returning it's value to the calling javascript. I need to actually run a method within Silverlight.

Any help would be greatly appreciated.

TIA

I have the solution...but StackOverflow won't let me post it. Too bad :( — lamarant, Jul 01 '11 at 16:31

score 0 · Accepted Answer · answered Jul 01 '11 at 16:59

0

try this, or something like it

var silverlightObject = document.getElementById('_the_id_of_your_silverlight_obj_');
var jsonData = { value: 'hello world' }

// invoke setter
silverlightObject.Content._the_object_containing_your_method_.set_JSONData(jsonData);

// invoke getter
jsonData = silverlightObject.Content._the_object_containing_your_method_.get_JSONData();

answered Jul 01 '11 at 16:59

Jon Davis

6,562
5
43
60

Thanks...I basically did what you suggested. See this link too for further reading on this: http://stackoverflow.com/questions/6460431/sending-json-object-from-javascript-to-silverlight-then-triggering-an-event-to-up – lamarant Jul 07 '11 at 19:01

Javascript Button that fires a SilverLight method?

1 Answers1