Passing a javascript function to ReactJS.NET Server side

Question

I have a pretty basic, but probably complicated question.

I am using ReactJS.net to render react components server side. I have a typeahead component which I use multiple times throughout my site. One of the properties it expects is a javascript filter function.

I don't want to have to create a seperate component for each instance of the typeahead, but would like to pass in a javascript function as a property so that I can reuse the component throughout the site.

For example, to render a component on the server I would do the following. The second parameter is the properties argment

@Html.React("Components.WorkSiteTypeahead", new { filterFn = model.SomeFunction })

Now as ReactJS.net expects native c# objects (string, array, list, etc), I don't see any straight forward way to pass in a Javascript function. Any ideas on how would I go about telling my MVC5 view to render my function not as a string? My first instinct is that there might be some sort of Javascript Raw type I am not aware of, but haven't been able to find it.

Of course after I posted this I figured it out. Newtonsofts JRAW does the trick filterFn= new JRaw("function() {doStuff())}") — Ray Suelzer
– Ray Suelzer, Commented Mar 28, 2015 at 17:54
You should post your comment as an answer and mark it as accepted. It's okay to accept your own answer :) — Daniel Lo Nigro
– Daniel Lo Nigro, Commented Mar 29, 2015 at 21:13

Ray Suelzer · Accepted Answer · 2015-03-29 22:58:07Z

6

As I suspected, at least one way to go about this is to use Newtonsoft's JRAW Type.

@Html.React("Components.WorkSiteTypeahead", new { filterFn = JRaw("function(){//do stuff } "})

answered Mar 29, 2015 at 22:58

Ray Suelzer

4,1375 gold badges41 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Passing a javascript function to ReactJS.NET Server side

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related