I am facing an issue with vue.js.
I want to create a settings page on the server program that has XML data.
I believe it can be achieved by following these steps :
- server | parse XML to JSON
- client | get JSON and read JSON
- client | edit JSON
- client | push JSON to server
- server | parse JSON to XML
- server | save XML
However, I am unable to read JSON as the received data contains '@' symbol.
"?xml": {
"@version": "1.0",
"@encoding": "utf-8"
},
"Nodes": {
"Node": [
{
"@type": "development",
- - - -
I am having trouble reading the @type attribute in my script..
// script
<script>
var node = new Vue({
el: '#Nodes',
data: {
json: null
},
filters: {
checkNum: function(value) {
var result = value;
if (value < 10) {
var result = "0" + value;
}
return result;
},
}
})
$(document).ready(function(){
console.log("ready");
getNodes();
setTimeInterval();
});
function getNodes() {
var $url ="http://localhost:21004/nodes/current/get/json"
$.ajax({
url: $url,
type: 'get',
success: function (data) {
console.log(data);
console.log(data.Nodes[0].type);
node.json = data;
},
error: function(err) {
console.log(err);
}
})
}
function setTimeInterval () {
setInterval(function() {
getNodes();
},3000)
}
</script>
// HTML
<ul id="Nodes">
<li v-for="node in json.Nodes">
{{ node.@type }}
{{ node.@group }}
{{ node.@name }}
<li v-for="item in node.Items">
{{ node.@name }}
{{ node.@defaultValue }}
{{ node.@expression }}
{{ node.@format }}
</li>
</li>
</ul>
Thank you for taking the time to read this.