I'm trying to read from xml file text and remove nodes where that text was.
For example I read the text from <en> or <es> nodes and I need to remove those both nodes and save text to <translation>
xml file before editing:
<?xml version="1.0" encoding="UTF-8" ?>
<books>
<name>
<translation>
<en>
Text 1
</en>
<es>
Text 2
</es>
</translation>
</name>
</books>
So it should looks like this:
<books>
<translation>
Text 1
</translation>
</books>
this is part of my function where after reading text from <en> I'm trying to remove all child nodes from <translation> but I'm stuck and getting an error when I'm using removeChild method
var lang = 'en';
$.ajax({
type: "GET",
url: 'my.xml',
dataType: "xml",
success: function (xml) {
$(xml).find('translation').each(function () {
var text = $(this).find(lang).text();
});
$(xml).getElementsByTagName('translation').parentNode.removeChild();
// xml convert to json
var books = [];
var data = $.xml2json(xml)['#document'];
that.books = data.books;
}
});
I'll appreciate any help. Thank you!
var value = [];
$.get("your.xml", function(d){
values.push($(d).find("en")[0].childNodes[0]); //push "Text 1" into array
$(d).find("en").remove(); //remove node
$(d).find("es").remove(); //remove node
$(d).find("translation").append(values[0]); //add "Text 1" to node
});
The problem you're running into is that you're attempting to use a jQuery object as a DOM node here:
$(xml).getElementsByTagName('translation').parentNode.removeChild();
To use jQuery, you would do
$(xml).find('translation').remove();
HOWEVER, I think you're possibly headed down a false path. I see you've declared a var text that isn't used anywhere in your code. You probably want to do something like the following:
$xml = $(xml);
$xml.find('translation').each(function () {
$this = $(this);
$this.text($this.find(lang).text());
});
// do something with $xml...
I couldn't get xml2json working, as I'm not familiar with that plugin, but it should be relatively straightforward for you.
tried this?
getElementsByTagName('translation').children().remove()
Related
I'm trying to get each hexadecimal value from the Adobe Kuler API using JQ/JS:
kuler api xml
They provide an xml but I'm having a hard time grabbing the values and placing them in an array like this:
var colors = [E6E2AF, A7A37E, EFECCA, 046380, 002F2F];
The colors exist in this element
<description>
Hex: E6E2AF, A7A37E, EFECCA, 046380, 002F2F
</description>
and here too:
<kuler:swatchHexColor>
E6E2AF
</kuler:swatchHexColor>
If you have any ideas I would really appreciate it,
K
I spent some time to find a selector that works for namespaces. This selector seems to do the job. Credits goes to Fasani for his answer in jQuery - XML parsing with namespaces.
$(xml).find('kuler\\:swatchHexColor, \\swatchHexColor');
Full snippet:
var colors = [];
$.ajax({
type: "GET",
url: 'https://kuler-api.adobe.com/rss/get.cfm?listType=popular&itemsPerPage=5&key=mykey',
dataType: "xml",
success: function(data){
// Select all <kuler:swatchHexColor> tags
var colorHexs = $(data).find('kuler\\:swatchHexColor, \\swatchHexColor');
// Loop through them, push them to colors array, and then append it body
$(colorHexs).each(function(i, hex){
colors.push($(hex).text()); // push to array
$('body').append('<div class="color" style="background:#'+$(hex).text()+'">'+$(hex).text()+'</div>');
});
// colors output.
console.log(colors);
}
});
.color {
width:33.334%;
height:100px;
float:left;
text-align:center;
line-height:100px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
Credits:
Fasani - jQuery XML parsing with namespaces
I have an xml file that I retreive via terminal emulation. I want to parse the results into a textarea in html. I am able to view the file in the textarea in xml format but have been unable to parse it into lines of the inner text.
Here is the javascript/jquery:
var x = ""
var y = ""
var Command="";
var cmd=""
$(document).ready(function() {
alert('jquery working');
$('#tester').click(function() {
$("#disptext").val("");
var APOresp = new ActiveXObject("DAT32COM.TERMINALEMULATION");
var Command = "<FORMAT>>*IA</FORMAT>";
APOresp.MakeEntry(Command);
//APOresp.GetMore(true,false);
var x = APOresp.ResponseXML;
APOresp.Close();
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.loadXML(x);
$(x).find('RESPONSE').each(function() { //these lines do not work. I get null xmlDoc reference
$("#disptext").val($(this).text() + "<br />");
});
//$("#disptext").val(xmlDoc.xml); //disptext is the textarea
});
Here is what a portion of the text file looks like:
?xml version="1.0"?>
<!--This is a host terminal response-->
<RESPONSE xmlns="x-schema:C:\fp\swdir\Content\emulation-schema.xml">
<LINE INDEX="1"><![CDATA[SIGN IN ]]><CARRIAGE_RETURN/></LINE>
<LINE INDEX="2"><SOM/></LINE>
</RESPONSE>
Most files are much longer.
I want to get the text for each "LINE: tag and loop it into the textarea. It does put in the whole xml file in xml format if I use the last commented out line in the javascript file. For some unknown reason, I am unable to use the xmlDoc. I keep getting errors that the xmlDoc has null values. I have been trying to fix this for a number of days without success. Any help would be greatly appreciated.
I have a string that for example looks like this.
var html = '<div class="templatemo_post_text grid-85">
<div id="wmd-preview"><h2>Skriv något!</h2>
<p>Lorem ipsum</p></div>
<div class="templatemo_post_footer">
<div class="templatemo_post_on">
<span class="orange">Skrivet den</span> 3 Mar 2013</div>
<div class="templatemo_post_comment">
Inlägg nummer
</div></div></div>';
Can I use the .addClass() in some way to add a class to the id=wmd-preview?
Actually my question goes for all javascripting to modify existing variables. One other thing I would like to do is to replace the whole tag with a new one.
Thanks.
You can turn that HTML into a DOM element:
var element = $(html);
Then select the div you want:
var div = element.find('#wmd-preview');
Then add the class:
div.addClass('new-class');
EDIT
To turn your modified DOM elements back into an HTML string, you can use jQuery's html function:
html = element.html();
Note that this gives the inner HTML of the element, so the enclosing div is missing. You can get around this by adding it to another div.
html = $('<div></div>').append(element).html();
Thanks for the comments but it didn't solve my problem and the reason for that is bad input from me.
I was getting the html by using innerHTML and that didn't work well with the solutions.
I am leaving my code here for anyone that needs it. The code is a way of getting my DIV and when the ajax get a success it will change the and delete the id wmd-preview.
mydiv = document.createElement('div')
mydiv.className = 'templatemo_post_area addbottom grid-parent';
mydiv.innerHTML = document.getElementById('preview').innerHTML;
$.ajax({
type: "POST",
dataType: 'json',
url: "/pages/posts_ajax.php",
data: {
data : text,
time : timepost
},
success: function(response) {
$(mydiv).find('#wmd-preview').removeAttr('id');
$(mydiv).find('#postnr').text('Inlägg nummer '+response.id);
$(mydiv).insertAfter('div#post_area');
}
});
here is what you want to do
var html = '<div class="templatemo_post_text grid-85"><div id="wmd-preview"><h2>Skriv något!</h2><p>Lorem ipsum</p></div><div class="templatemo_post_footer"><div class="templatemo_post_on"><span class="orange">Skrivet den</span> 3 Mar 2013</div><div class="templatemo_post_comment">Inlägg nummer </div></div></div>';
$(html).find('.orange').addClass('someclass')
I have encounter an problem with using javascript/jquery to read XML file's nodes.
Say We have a xml file like this
<root>
<people>
<name>Jack</name>
<age>18</age>
</people>
<name>Rose</name>
</root>
For this xml file, on the first level, there is a name with content"Rose", and in the second level there are also has a name with content"Jack"
I have tried to use jquery's function to read the file:
var NAME;
$.get('myxml.xml', 'xml', function(d){
NAME = $(d).find('name').text();
});
But in this way, everytime the NAME will contain the combine of two node's contents, like 'JackRose'
If I just want to get the contents of the second node, the 'Rose' one to be read and stored, what should I do?
Thank you!
You can use each method:
$.get('myxml.xml', 'xml', function(d){
$(d).find('name').each(function(){
var txt = $(this).text()
});
});
Or eq method:
$.get('myxml.xml', 'xml', function(d){
var $name = $(d).find('name');
var first = $name.eq(0).text()
var second = $name.eq(1).text()
});
Try
var NAME;
$.get('myxml.xml', 'xml', function(d){
NAME = $(d).find('root > name').text();
});
As the second one is a direct child of the root element it can be found like this:
var NAME;
$.get('myxml.xml', 'xml', function(d){
NAME = $(d).find('> name').text();
});
Depending on the xml, if the root element is'nt really the root element, and often there is a <xml> element as the root element, the selector would be ('root > name') !
How to retreive node_names and attribute_names from a xml (not values of node or attributes) Is it possible using jquery?
<Client>
<product name="astro">
<service_process name="ACID">
<host>pable</host>
<port>18848</port>
</servcice_process>
<service_process name="Mestro">
<host>Mico</host>
<port>18821</port>
</servcice_process>
</product>
</Client>
You could start with something like this:
var xml = '<Client><product name="astro"><service_process name="ACID"><host>pable</host><port>18848</port></servcice_process><service_process name="Mestro"><host>Mico</host><port>18821</port></servcice_process></product></Client>';
$(xml).each(function displayChildren (i, node) {
console.log(node.nodeName);
// traverse attributes
$.each(node.attributes, function (j, attr) {
console.log(attr.nodeName, attr.nodeValue);
});
// recursive call
$(node).children().each(displayChildren);
});
A quick search revealed this page which deals in XML Parsing with jQuery. Getting the node name is a little more difficult but a method for getting it is provided here. From a quick look, I'm assuming you'd want to do something along the lines of:
$(xml).each(function(){ //xml is the XML resource.
if($(this).attr("name")!=""){
alert("Name = " + $(this).attr("name"));
}
alert("Node = " + $(this).get(0).TagName);
});
I believe this should work no problems.