What I did was parse the the var a, sort and then display it. It doesn't return value or error.
var a = '<root><ap by="A" on="2021/10/01 14:03:24" lvl="4"></ap><ap by="A" on="2021/10/01 14:03:59" lvl="2"></ap><ap by="A" on="2021/10/01 14:04:01" lvl="5"></ap><ap by="A" on="2021/10/01 14:04:05" lvl="1"></ap></root>';
$($.parseXML(a), function (log) {
var ap = $(log).find($(this)).clone();
ap.sort(function (a, b) {
return (parseInt($(a).attr("lvl")) - parseInt($(b).attr("lvl")));
});
ap.find("ap").each(function () {
var ap = $(this);
var by = ap.attr("by");
var on = kendo.parseDate(ap.attr("on"));
var lvl = parseInt(ap.attr("lvl"));
if (apdate.html() != "") $("<br>").appendTo(apdate);
$("<span" + props + ">").text(by + " (" + kendo.toString(on, User.datetimeFormat) + ") (" + lvl + ")").appendTo(apdate);
});
I was able to display the data unsorted by using this. I assumed that the problem is in my sorting code.
$($.parseXML(a).find("ap").each(function () {
var ap = $(this);
var by = ap.attr("by");
var on = kendo.parseDate(ap.attr("on"));
var lvl = parseInt(ap.attr("lvl"));
var props = "";
if (apdate.html() != "") $("<br>").appendTo(apdate);
$("<span" + props + ">").text(by + " (" + kendo.toString(on, User.datetimeFormat) + ") (" + lvl + ")").appendTo(apdate);
I was referencing to the answer here link
From that link: $.get
is an asynchronous call to load an xml file, with a callback for when it has completed. You do not have a file, you have a string - the string does not need to be "loaded" asynchronously (as it's already loaded).
So there you have:
$.get("remote_file_url.xml", callback_when_loaded(xml) { ...
but here you want:
var a = "<root>...";
var xml = $.parseXML(a)
var log = $(xml);
var ap = log.find("ap")...
then you can use log
as a jquery object. $.parseXML(a)
will give you an XML document object, but to use jquery methods, it needs to be a jquery object, so wrap in $()
- this is the equivalent of using this
in an event handler: this
= a DOM node and $(this)
= jquery object.
Later on you have ap.find("ap")
as ap
already = $(xml).find("ap")
this is the equivalent of $(xml).find("ap").find("ap")
Updated code (with some minor adjustments to remove irrelevant "kendo" code)
var a = '<root><ap by="A" on="2021/10/01 14:03:24" lvl="4"></ap><ap by="A" on="2021/10/01 14:03:59" lvl="2"></ap><ap by="A" on="2021/10/01 14:04:01" lvl="5"></ap><ap by="A" on="2021/10/01 14:04:05" lvl="1"></ap></root>';
var log = $($.parseXML(a))
console.log(log.find("ap").length)
var ap = log.find("ap").clone();
//console.log(ap)
ap.sort(function(a, b) {
return (parseInt($(a).attr("lvl")) - parseInt($(b).attr("lvl")));
});
//console.log(ap)
ap.each(function() {
var ap = $(this);
var by = ap.attr("by");
//var on = kendo.parseDate(ap.attr("on"));
var lvl = parseInt(ap.attr("lvl"));
apdate = $("#output")
if (apdate.html() != "")
$("<br>").appendTo(apdate);
$("<span>").text(by + "(" + lvl + ")").appendTo(apdate);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='output'></div>