I'm looking for a JavaScript library that can deserialize/unmarshal XML (strings or DOM) to JavaScript classes in a way similar to the .NET XmlSerializer's Deserialize method.
The functionality I'm looking for:
Classes are defined as JavaScript constructor functions.
Mapping between nodes and classes/properties is configurable.
Deserialization result consists of instances of these classes.
For example, the following XML:
<root textAttribute='text1' numberAttribute='1' attributeToIgnore1='ignored1' attributeToIgnore2='ignored2'>
<children>
<child>text2</child>
<child>text3</child>
</children>
<childToIgnore>ignored3</childToIgnore>
</root>
used with JavaScript definitions similar to these:
function RootClass() {
this.stringProperty = "";
this.integerProperty = 0;
this.collectionProperty = [];
}
function ChildClass() {
this.stringProperty = "";
}
should produce JavaScript objects similar to the following:
var result = new RootClass();
result.textProperty = "text1";
result.integerProperty = 1;
result.collectionProperty = [];
result.collectionProperty[0] = new ChildClass();
result.collectionProperty[0].textProperty = "text2";
result.collectionProperty[1] = new ChildClass();
result.collectionProperty[1].textProperty = "text3;
An example of .NET (C#) code that does the same would be something like (see this .NET Fiddle for a working example):
public class Program
{
public static void Main()
{
var result = Serializer.Deserialize();
Console.WriteLine("text: {0}", result.StringProperty);
Console.WriteLine("number: {0}", result.IntegerProperty);
Console.WriteLine("enum: {0}", result.EnumProperty);
Console.WriteLine("child[0].Value: {0}", result.CollectionProperty[0].Value);
Console.WriteLine("other#[0]: {0}", result.OtherAttributes[0].InnerText);
Console.WriteLine("other*[0]: {0}", result.OtherElements[0].InnerText);
}
}
public static class Serializer
{
public static RootClass Deserialize()
{
var type = typeof (RootClass);
var serializer = new XmlSerializer(type);
var xmlString = #"
<root textAttribute='text1' numberAttribute='1' enumAttribute='item1' attributeToIgnore1='ignored1' attributeToIgnore2='ignored2'>
<children>
<child>text2</child>
<child>text3</child>
</children>
<childToIgnore>ignored3</childToIgnore>
</root>";
using (var stringReader = new StringReader(xmlString))
{
return serializer.Deserialize(stringReader) as RootClass;
}
}
}
[XmlRoot("root")]
public class RootClass
{
[XmlAttribute("textAttribute")]
public string StringProperty;
[XmlAttribute("numberAttribute")]
public int IntegerProperty;
[XmlAttribute("enumAttribute")]
public Enumeration EnumProperty;
[XmlAnyAttribute]
public XmlAttribute[] OtherAttributes;
[XmlArray("children")]
[XmlArrayItem("child")]
public Collection<ChildClass> CollectionProperty;
[XmlAnyElement]
public XmlElement[] OtherElements;
}
public enum Enumeration
{
[XmlEnum("item1")]
Item1,
[XmlEnum("item2")]
Item2
}
public class ChildClass
{
[XmlText]
public string Value;
}
Jsonix by Alexey Valikov (source, guide) can deserialize XML to JavaScript based on configurable mapping.
I've contributed code to support deserializing custom classes using instance factories. This will hopefully make it into the next release of Jsonix (2.0.11).
var input = "<element1 attribute1='value1' />";
var Class1 = function () {};
Class1.prototype.toString = function () {
return this.Property1;
};
var mapping = {
elementInfos: [{
elementName: "element1",
typeInfo: new Jsonix.Model.ClassInfo({
name: "Element1",
instanceFactory: Class1,
propertyInfos: [
new Jsonix.Model.AttributePropertyInfo({
name: "Property1",
attributeName: "attribute1"
})
]
})
}]
};
var context = new Jsonix.Context([mapping]);
var unmarshaller = context.createUnmarshaller();
var result = unmarshaller.unmarshalString(input).value;
console.log(result.toString()); // logs "value1"
A longer working example on JSFiddle uses XML from question.
Related
I'm a beginer with JavaScript and now I'm facing such problem.
I have an enum
#JsonFormat(shape = Shape.OBJECT)
public enum FinancialEventType {
Income("Income"),
Expense("Expense");
private String code;
private FinancialEventType(String code) {
this.code = code;
}
#JsonValue
public String getCode() {
return this.code;
}
}
and I'd like to pass the enum to my view trough a ModelAttribute(as an object and as an JSON)
#ModelAttribute()
public void addAttributes(Model model) throws JsonProcessingException {
String data1 = new ObjectMapper().writeValueAsString(FinancialEventType.values());
model.addAttribute("data1", data1);
model.addAttribute("eventTypes", FinancialEventType.values());
}
in my view I can get these attributes
<script>
var documentDate = "[[${documentDate}]]";
var eventTypes = "[[${eventTypes}]]";
var data1 = "[[${data1}]]";
console.log("data1: " + data1);
</script>
but the "JSON" looks a bit weird:
data1: ["Income","Expense"]
and when I try the generate a dropdown element via the JavaScript
//Create and append the options
for (var i = 0; i < data1.length; i++) {
var option = document.createElement("option");
option.value = data1[i];
option.text = data1[i];
selectList.appendChild(option);
}
row.appendChild(cell);
the generated list is not what I'm looking for:
thanks for any advice
Witold
Change this:
var data1 = "[[${data1}]]";
for this:
var data1 = [(${data1})];
Using "[[ ]]" in Thymeleaf is equivalent to use th:text, and Thymeleaf is escaping the text (that means, converting the symbol ' in the HTML equivalent "). So, use "[( )]" instead, which is equivalent to th:utext.
This will only work with Thymeleaf version 3, not version 2.
Source: https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#inlining
Tried using c# 7 Tuples like
public (string, bool) ProcessForm([FromBody]Dictionary<string,string> contactFormRequest)
But I get the error "CS1031: Type expected". I guess this isn't supported yet.
Then I tried
public Tuple<string, bool> ProcessForm([FromBody]Dictionary<string,string> contactFormRequest)
{
var message = "test";
var result = true;
var tuple = new Tuple<string, bool>(message, result);
return tuple;
}
This gives no error, but then I cannot pick it up in the view file
function handleResult(data) {
$("#custommessages").html(data.Item1);
}
$2sxc(#Dnn.Module.ModuleID).webApi.post("Form/ProcessForm", {}, newItem, true).then(handleResult);
This outputs nothing.
If I return a simple string from the controller, "data" picks it fine.
How do you pick up the values from a Tuple return?
Why not create a POCO class for serialization:
public class SomeResult
{
public string Message{get;set;}
public bool Result{get;set;}
}
then
public SomeResult ProcessForm([FromBody]Dictionary<string,string> contactFormRequest)
{
var message = "test";
var result = true;
return new SomeResult{Message = message, Result = result};
}
Why not just return a IActionResult?
You can simply write an Anonymous type instead of Tuple!
Named Types may take up some useless spaces (As I thinks that...)
Try This:
public IActionResult ProcessForm([FromBody]Dictionary<string,string> contactFormRequest)
{
var message = "test";
var result = true;
//This will create an anonymous type! (you can see its named as "a'")
var resultData = new { Message = message, Result = result };
return Json(resultData);
}
Wish it may help you.
There is a webpage I am trying to extract data from. By looking at the HTML in the page Source, I can find the data I am interested inside script tags.
It looks like the following:
<html>
<script type="text/javascript">
window.gon = {};
gon.default_profile_mode = false;
gon.user = null;
gon.product = "shoes";
gon.books_jsonarray = [
{
"title": "Little Sun",
"authors": [
"John Smith"
],
edition: 2,
year: 2009
},
{
"title": "Little Prairie",
"authors": [
"John Smith"
],
edition: 3,
year: 2009
},
{
"title": "Little World",
"authors": [
"John Smith",
"Mary Neil",
"Carla Brummer"
],
edition: 3,
year: 2014
}
];
</script>
</html>
What I would like to achieve is, call the webpage by using its url, then retrieving the 'gon' variable from JavaScript and store it in a C# variable. In other words, in C#, I would like to have a data structure (a dictionary for instance) that would hold the value of 'gon'.
I have tried researching how to get a variable defined in JavaScript via C# WebBrowser, and this is what I found:
using System;
using System.Collections.Generic;
using System.Windows.Forms;
using System.Net;
using System.Runtime.InteropServices;
using System.Text.RegularExpressions;
using mshtml;
namespace Mynamespace
{
public partial class Form1 : Form
{
public WebBrowser WebBrowser1 = new WebBrowser();
private void Form1_Load(object sender, EventArgs e)
{
string myurl = "http://somewebsite.com"; //Using WebBrowser control to load web page
this.WebBrowser1.Navigate(myurl);
}
private void btnGetValueFromJs_Click(object sender, EventArgs e)
{
var mydoc = this.WebBrowser1.Document;
IHTMLDocument2 vDocument = mydoc.DomDocument as IHTMLDocument2;
IHTMLWindow2 vWindow = (IHTMLWindow2)vDocument.parentWindow;
Type vWindowType = vWindow.GetType();
object strfromJS = vWindowType.InvokeMember("mystr",
BindingFlags.GetProperty, null, vWindow, new object[] { });
//Here, I am able to see the string "Hello Sir"
object gonfromJS = vWindowType.InvokeMember("gon",
BindingFlags.GetProperty, null, vWindow, new object[] { });
//Here, I am able to see the object gonfromJS as a '{System.__ComObject}'
object gonbooksfromJS = vWindowType.InvokeMember("gon.books_jsonarray",
BindingFlags.GetProperty, null, vWindow, new object[] { });
//This error is thrown: 'An unhandled exception of type 'System.Runtime.InteropServices.COMException' occurred in mscorlib.dll; (Exception from HRESULT: 0x80020006 (DISP_E_UNKNOWNNAME))'
}
}
}
I am able to retrieve values of string or number variables such as:
var mystr = "Hello Sir";
var mynbr = 8;
However, even though I am able to see that the 'gon' variable is being passed as a '{System.__ComObject}', I don't know how to parse it in order to see the values of its sub components. It would be nice if I could parse it, but if not, what I would like to have instead, is a C# Data Structure with keys/values that contains all the sub infos for the gon variable, and especially, be able to view the variable 'gon.books_jsonarray'.
Any help on how to achieve this would be very much appreciated. Note that I cannot change the source html/javascript in anyway, and so, what I need is a C# code that would allow to reach my goal.
You can cast the result of InvokeMember() to dynamic and use the property names directly in your C# code. Array indexing is tricky but can be done with another use of InvokeScript(), see my example:
private void btnGetValueFromJs_Click(object sender, EventArgs e)
{
var mydoc = this.WebBrowser1.Document;
IHTMLDocument2 vDocument = mydoc.DomDocument as IHTMLDocument2;
IHTMLWindow2 vWindow = (IHTMLWindow2)vDocument.parentWindow;
Type vWindowType = vWindow.GetType();
var gonfromJS = (dynamic)vWindowType.InvokeMember("gon",
BindingFlags.GetProperty, null, vWindow, new object[] { });
var length = gonfromJS.books_jsonarray.length;
for (var i = 0; i < length; ++i)
{
var book = (dynamic) mydoc.InvokeScript("eval", new object[] { "gon.books_jsonarray[" + i + "]" });
Console.WriteLine(book.title);
/* prints:
* Little Sun
* Little Prairie
* Little World
*/
}
}
You need to use JSON.stringify to convert your gon.books_jsonarray variable to JSON string
After you can retrive JSON using next C# code:
var gonFromJS = mydoc.InvokeScript("eval", new object[] { "JSON.stringify(gon.books_jsonarray)" }).ToString();
After you can deserialize JSON to object using Newtonsoft.Json
My full code is here:
using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Windows.Forms;
namespace WindowsFormsApp1
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
var webBrowser = new WebBrowser();
webBrowser.DocumentCompleted += (s, ea) =>
{
var mydoc = webBrowser.Document;
var gonFromJS = mydoc.InvokeScript("eval", new object[] { "JSON.stringify(gon.books_jsonarray)" }).ToString();
var gonObject = JsonConvert.DeserializeObject<List<Books>>(gonFromJS);
};
var myurl = "http://localhost/test.html";
webBrowser.Navigate(myurl);
}
private class Books
{
public string Title { get; set; }
public List<string> Authors { get; set; }
public int Edition { get; set; }
public int Year { get; set; }
}
}
}
Also you can see output on screenshot:
EDIT:
Also you can have a trouble with JSON.stringify method.
It can returns null.
In this case you can review SO topics: here and here.
If JSON.stringify method returns null then try to add next code to your HTML page:
<head>
<meta http-equiv='X-UA-Compatible' content='IE=edge' >
</head>
I have used HybridWebView from XLabs to build a HybridWebView that can communicate with C# code. I have build custom renderers to do this. In simple terms I have:
iOS
public class HybridWebViewRenderer : ViewRenderer<HybridWebView, WKWebView>, IWKScriptMessageHandler
{
const string JavaScriptFunctionTemplate = "function {0}(){{window.webkit.messageHandlers.invokeAction.postMessage('{0}|' + JSON.stringify(arguments));}}";
protected override void OnElementChanged(ElementChangedEventArgs<HybridWebView> e)
{
base.OnElementChanged(e);
if (Control == null)
{
userController = new WKUserContentController();
foreach (var f in Element.RegisteredFunctions.Where(ff => !ff.IsInjected))
{
var script = new WKUserScript(new NSString(string.Format(JavaScriptFunctionTemplate, f.Name)), WKUserScriptInjectionTime.AtDocumentEnd, false);
userController.AddUserScript(script);
f.Injected();
}
userController.AddScriptMessageHandler(this, "invokeAction");
var config = new WKWebViewConfiguration { UserContentController = userController };
var webView = new WKWebView(Frame, config)
{
NavigationDelegate = new CustomWKNavigationDelegate(this.Element)
};
SetNativeControl(webView);
}
if (e.OldElement != null)
{
userController.RemoveAllUserScripts();
userController.RemoveScriptMessageHandler("invokeAction");
var hybridWebView = e.OldElement as HybridWebView;
hybridWebView.Cleanup();
}
if (e.NewElement != null)
{
Load(Element.Uri);
}
}
public void DidReceiveScriptMessage(WKUserContentController userContentController, WKScriptMessage message)
{
var bits = message.Body.ToString().Split('|');
if (bits.Count() == 2)
{
var result = Element.InvokeFunction(bits[0], bits[1]);
//How do I return result back to Javascript function?
}
}
the InvokeFunction method returns a value result which is a string.
How can I return this string result back to the javascript function which was injected?
Edit
Do I need to edit my JavaScriptFunctionTemplate I notice in the XLabs they have a similar template but append something to the end
Is there any reason why you couldn't simply 're-call' your function using the methods described here?
Their example:
void OnCallJavaScriptButtonClicked (object sender, EventArgs e)
{
...
int number = int.Parse (numberEntry.Text);
int end = int.Parse (stopEntry.Text);
webView.Eval (string.Format ("printMultiplicationTable({0}, {1})", number, end));
}
So yours would be something like:
const string JavaScriptFunctionTemplate = "function {0}(){{window.webkit.messageHandlers.invokeAction.postMessage('{0}|' + JSON.stringify(arguments));}}";
public void DidReceiveScriptMessage(WKUserContentController userContentController, WKScriptMessage message)
{
var bits = message.Body.ToString().Split('|');
if (bits.Count() == 2)
{
var result = Element.InvokeFunction(bits[0], bits[1]);
webView.Eval(string.Format ("JavaScriptFunctionTemplate({0})", result)); // or however your parameter structure is.
}
}
EDIT:
Just want to encorporate the LINK that the OP found as it looks to be a solid guide to the solution in Objective-C which is fairly straight forward to convert to Xamarin C#.
I am using Asp MVC 3 application.
I have an Enum:
public enum EmployeesOptions
{
John = 1,
Peter = 2,
Andrew = 3
}
And a MyViewModel class
public class MyViewModel
{
public MyViewModel()
{
Employees = new List<EmployeesOptions>()
{
EmployeesOptions.John,
EmployeesOptions.Peter,
EmployeesOptions.Andrew
};
}
public IEnumerable<EmployeesOptions> Employees { get; set; }
}
My Controller:
public ActionResult Index()
{
var vm = new MyViewModel();
return View(vm);
}
In My Index View:
#model MyViewModel
<script type="text/javascript">
var jsonString = '#Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model))';
var data = ko.mapping.fromJSON(jsonString);
omega.franchiseInfo = ko.mapping.fromJS(data);
</script>
My serialized data coming from the server looks like this:
Emplyees:[1,2,3]
I want to be like this:
Emplyees:["John","Peter","Andrew"]
What am I missing ?
Update:
var jsonString = '#Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model, Newtonsoft.Json.Formatting.None, new Newtonsoft.Json.Converters.StringEnumConverter()))';
This do the job!
If you want this enum type always to be serialized with its string values, you can decorate it with a JsonConverter attribute and the StringEnumConverter class like this:
using Newtonsoft.Json;
using Newtonsoft.Json.Converters;
[JsonConverter(typeof(StringEnumConverter))]
public enum EmployeesOptions
{
John = 1,
Peter = 2,
Andrew = 3
}
Then you don't need to specify any converter classes in the serializer options anymore.
I tried decorating a List property that holds Enum values with [JsonConverter(typeof(StringEnumConverter))] but understandably that didn't work since it should decorate the Enum type directly.
// Did not work!
[JsonConverter(typeof(StringEnumConverter))]
public List<Assessment.AssessmentFunction> SelectedFunctions { get; set; }
then I did as you suggested and it worked as expected.
var selectedFunctions = #Html.Raw(JsonConvert.SerializeObject(Model.SelectedFunctions,
new StringEnumConverter()))
Instead of Enum int values now I get Enum strings in the JavaScript code inside a Razor .cshtml view. Just what I needed in a specific situation.
Before
var selectedFunctions = #Html.Raw(Json.Encode(Model.SelectedFunctions))
// Output
var selectedFunctions = [3, 3, 2, 2, 2, 3, 2, 2]
After
var selectedFunctions = #Html.Raw(JsonConvert.SerializeObject(Model.SelectedFunctions,
new StringEnumConverter()))
// Output
var selectedFunctions = ["Nurse","Nurse","Doctor","Doctor","Doctor","Nurse","Doctor","Doctor"]
You are returning enums, and by default it will display the enum values. You can modify your model like this.
public class MyViewModel
{
public MyViewModel()
{
Employees = new List<EmployeesOptions>()
{
EmployeesOptions.John.ToString(),
EmployeesOptions.Peter.ToString(),
EmployeesOptions.Andrew.ToString()
};
}
public IEnumerable<EmployeesOptions> Employees { get; set; }
}
By using the .ToString() extension method we can convert enums to the exact thing they are representing to string format.