JQuery :: Selectors With Xml Cdata / Parse Html String
Aug 21, 2009
I have an XML document that is returned which has an element named html. Inside of that element is a block of HTML wrapped with CDATA tags. I can alert the html variable that i create and see it has all of the data inside of it. So I want to parse through and grab certain things now. I'm just trying to get the element to return it's id to me, even though I know it ... because I kept getting the following error with other code.[code]
I have an XML document that is returned which has an element named html. Inside of that element is a block of HTML wrapped with CDATA tags. I can alert the html variable that i create and see it has all of the data inside of it. So I want to parse through and grab certain things now. I'm just trying to get the element to return it's id to me, even though I know it ... because I kept getting the following error.
I still continue to get this error with the current code below:
I've been dabbling in the coding for a few weeks now and I want to build my own plugin for fun, but I think there's something that I don't fully understand (that's probably systemic to the syntax or order).
So this is what I have so far...and it's pretty cool
1) As a general question, is there an order in which "commands" should be called? I'm assuming that it should be some logical order. For example, if I asked to apply the green formatting to the div before it has been created (via the .append command), it wouldn't work right? The only exception is if I call a function, I could put that function pretty much anywhere in the document.
2) How come I can use $('.searchstyle').hide() inside a function, but I can't select for it outside of the function? Does it cease to exist after the function has been run?
2a) Does it have something to do with XML data? (I was able to do what I wanted in an isolated example when had the output data put in the html).
I need to parse an HTML string received from an AJAX request. I wrote a function that places the HTML string into an unappended (not added) <div> , which opens the string up to the DOM hierarchy. However, when I try to access the elements of this <div> , I get an error in the console that says root.getElementById is not a function. This tells me that I can't access any of the child nodes.
Here is what my script looks like:
function parseHTML(html) { var root = document.createElement("div"); root.innerHTML = html; // The error console stops at this line
I'm receiving XML data via AJAX and the XML includes some CDATA values. The XML needs to be added to the page and then later scraped from the page and sent back as XML via AJAX.
Simple Example:
I receive -
And want to end up with:
And then send back as XML
99% of this is easy except the handling of the CDATA tag.
If I treat the XML as HTML, the CDATA tags get commented out automatically by JQuery.
So .html() returns <!--<![CDATA[Hello World]]>--> and .text() returns an null value (which is correct for a node containing only a comment).
If I treat the XML as XML, then .html() doesn't work making it impossible to insert the data (with its XML tags) into my page.
The only way around this I can see is to create a function that loops through the XML creating a HTML duplicate somehow and converting the CDATA nodes. When I want to send it back I have to reverse the process.
This seems a very long winded process when all I want to do is treat the XML as HTML except for the CDATA which needs to converted appropriately.
So two questions:
1) Am I missing some easy way to do all this using JQuery or other tools?
2) If I do need to manually convert the XML into HTML and vice versa, how do I do it?
I have a web site which creates printed output which will be printed out on A4 with a standard template that I use. Fortunately each output will (should?) fit on one page so I don't need to worry about the content munging the template. Now so far the approach I have used is to spin through a loop writing the content into a new div which is shown as a preview and which I then print. So far so good.
Now I want to generalise the templates so I can change them more easily. So instead of $('#printableblock').html(somefunction());I want to load a template from a file. That file would look something like;
I see that jQuery provides a function to turn an object into a set of URL query parameters: $.param({foo:"xxx", bar:"yyy"}) => "foo=xxx&bar=yyy" is there a function which does the opposite, i.e.parsing a query string into an object? The reason is that when I make an Ajax request, I want to take some parameters from the original page and include them in the new request, and modify others. I can get the original page's query string from location.search, which may contain, say, "?foo=xxx&bar=yyy" Now, suppose I want to submit an Ajax request with the same value of foo as the original page but a different value of bar, what's the cleanest way to do that? Remember that the original query string might have the two parts the other way round, i.e. "?bar=yyy&foo=xxx" If I need to write a function to split this myself, I know it's not a major undertaking, but I just wanted to see if I've missed something in the API.
I'm trying to parse a Json string received by $.getJSON(). I can receive the string but firebug gives me an "invalid label" error. I think it is because the string is an hash array with a number as first label, but I'm not sure. This is the string:
{"15":{"id":15,"x":0.4589937586135409,"y": 0.8324914620560137,"z":-0.9435707004102728,"rawData":"1256204002860 13 -442866538 18392602 647462767 314 1777206957 -1664784174 "}} and this is the non-working code:
I have been trying to use jquery function .html() but I noticed that it clears all events that are attached to the selectors. Is there a way around this issue? I want to change the content and keep the events.
I am aware of live and delegate functions but I am making changes to an external page so I do not have control over attaching events or knowing what they are at the first place.
I'm trying to get jquery to parse some text in a variable as HTML, has anyone tried this before and got it to work? Can this even be done, or do I have to parse as text?
Ex XMl :: "<?xml version='1.0' encoding='UTF-8'?><profile><title>PricelessCitiesNewYokrRegistration.</title><site></site><application></application><fields><field><label>Email</label><type>text</type></field><field><label>Password</label><type>password</type></field></fields></profile>"
And The form Should like below .
Email :: TEXTBOX Password :: TEXTBOX
Submit Button
When you click submit button it will take those two values and send to back end.
I am using jQuery for ajax call and receives HTML as a response.
Response I am getting is
I would like to parse this response and fetch "1","Debopam" and "Poddar" from the response HTML. How to do this and is there any way to parse it using jQuery selector.
I have a string that contains n items. Each item start with a '@' and the item itself does not contains the '@a'.
For example the string looks like: "@one@two@three@four"
I have to output this string as "one, two, three and four". So in fact the first '@' can be removed, the next except the last replaces by ", " and the last one by the word "and ". Is there a simple way doing this?
I am looking for a javascript function that will parse a query string. Parameters are passed in the url: url?a=3&c=5&etc An array is returned that uses the variable name as the index.
I'm trying to parse a string from a URL and pass it as a parameter to another function. If that parameter meets certain conditions, I want hidden fields in my form to "unhide".
I am giving 3 usersr a specified url i.e. (http://DOMAINNAME.com?usr=uk or http://DOMAINNAME.com?usr=france) and based on that url, we'll parse the name and pass it as a parameter to a function. (i think i expressed that right??) Then we will display the proper shipping address depending on the parameter passed. My only problem now is, i'm horrible at writing regular expressions and programming in general. Do you or anyone else out there know of any good url parseing functions? I've been doing mostly project management throughout my career and never really got a chance to become fluent in javascript or programming for that matter.
I feel like I have been repeating this code lately, so I cleaned it up and am gonna show it here. This function returns an array (with hash names) containing all the get variables.
function parseGetVars() { var getVars = new Array(); var qString = unescape(top.location.search.substring(1)); var pairs = qString.split(/&/); for (var i in pairs) { var nameVal = pairs[i].split(/=/); getVars[nameVal[0]] = nameVal[1]; } return getVars; }A simple page to test this looks like<html> <head> <title>Test</title>
<script> function parseGetVars() { var getVars = new Array(); var qString = unescape(top.location.search.substring(1)); var pairs = qString.split(/&/); for (var i in pairs) { var nameVal = pairs[i].split(/=/); getVars[nameVal[0]] = nameVal[1]; } return getVars; } </script> </head>
<body> <script> var g = parseGetVars(); for (var i in g) document.writeln(i+'='+g[i]+'<br>'); </script>
I am putting together a site that uses screen scraping to extract results from a number of search engines. The HTML is downloading fine and I am able to extract search engines results relatively easily using the JQuery .find() function.
My problem is that when the HTML is parsed the browser is firing requests for external resources (i.e. image & video files) that are referenced within the parsed HTML. These resources are not required by my site (I only extract the text results and don't want to display images) and just waste the user's bandwidth.
Is it possible to parse the HTML without evaluating embedded resources?
From using Fiddler and Firebug I have determined that the requests are being made during execution of this function [code]...
I am loading an entire page in ajax, but I just want to load a fragment from it. Using the .load() function, you can do this by adding a selector after your url like 'getPage.php #myDiv' etc, how to do it using the .ajax method.
I'm trying to get the "d1" div to be populated with the contents of the "my2" div on the second page. I don't want to use the .load() function, I want to use the .ajax() function. I can get this to work if I just use: $('#d1').html(data); instead of $('#d1').html($(data).find('#my2')); but the former results in the entire html contents of the second page being placed into the "d1" div, and I only want the fragement.
I am developing a web application in java (jsp's and servlets). For the project I am working on I will need to develop an html data entry screen and the code to load data into the screen, and then save the data back to the back-end database.
How to do the following: Read the data out of the database (JDBC, no problem) in a servlet. Put the data into the appropriate form for returning to the data entry screen, which will be a jsp. (Is JSON the right choice for passing the data from the servlet to the jsp?)
In the jsp, parse the returned data and populate the HTML form elements (text fields and combo boxes). When a button is clicked, pull the data out of the form elements and return to a servlet for saving back in the database.
New to this, worked through the w3c tutorials and am really fascinated by some of the concepts. I'm only familiar with html, css, js (basics), so am trying to keep things as simple as I can for this.
For simplicity I'll use books.xml with a listing of books. Each book has a <title><author><year><price> and <image> element. The images are stored in a folder called "images" a path is listed in the xml document.
Using js and an array I can loop through the xml file and have it extract each node into a table, if I mouseOver a ROW in the table, it displays that listing in a DIV above and I would like it to display the image/thumbnail for that particular listing within another div called thumbnail which is in the same location regardless of which listing you mouseOver.
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }
[Code]....
So the way this looks is there's a grey div. At the top it says listing, and when the body loads it lists the [0] first entry from the array. To the right of this is a small div called thumbnail that is empty and I would like it to load the relevant image from the path in the <image> tag in the xml file.
Below the listing is a table with 4 columns (title, genre, price, image) and an equal number of rows to the number of listings in the xml file. Under the "image" column it just shows the path to the image.
So how do I tie the empty thumbnail div to the listing so it'll just add the path from the xml <image> tag into a <img src="pathnamefromxmldocument">
I have a script that reads the contents of an XML file. The contents of one of the tags of the XML file contains XHTML(made up of <p> and <a> tags). The code I have to output the content of the XML is as follows:
xmlRoot = xmlResponse.documentElement;
var wrapper = document.getElementById("myDiv"); var bodyText = xmlRoot.getElementsByTagName("bodyText");
for(var i=0; i<bodyText.length; i++) { var para = document.createElement("p"); var bodyContent = document.createTextNode(bodyText[i].firstChild.data);
Now, when I view the page in my browser, I get paragraphs that actually display the HTML code. Is there a way to parse this HTML so that it actually appears with all the links etc, as opposed to just showing the code?
