I am currently trying to parse and xml file that is of the following format:
<holidays>
<holiday1> text </holiday1>
<holiday2> text </holiday2>
<holiday3> text </holiday3>
<holiday4> text </holiday4>
...
with the following code:
$.ajax({
url: '<filename>',
dataType: 'xml',
success: xmlParser
});
function xmlParser(xml) {
$('#load').fadeOut();
$(xml).contents().each(function () {
$("#holidates").append('<p>' + $(this).text() + '</p>');
});
$(".dates").fadeIn(2000);
}
The current output is:
<p>01/13/2016 02/02/2016 12/24/2015 12/24/2015 12/24/2015 12/29/2015 12/30/2015 11/23/2015 01/01/2016 01/26/2016 12/25/2015</p>
I would prefer:
<p>01/13/2016</p>
<p>02/02/2016</p>
<p>12/24/2015</p>
....
Is there a way to achieve his without formatting the xml file? The file is part of another system and is required in the indicated format.
Many thanks.
Given your feedback, the problem is clear. You take the text value of the root element. This however just concatenates all text elements from its children.
I am not a pro when it comes to ajax, but the idea is to select the 'holiday' tags and run an 'each' on that set.
Your XML structure makes it a bit harder than it should be because of the integers in the name. If you are certain that all the children of the 'holidays' tag are 'holidayx' tags then you could just take all children.
$(xml).contents().find('holidays').children().each(function () {
$("#holidates").append('<p>' + $(this).text() + '</p>');
});
I would suggest trying something like that.
Related
I found this page How can I pretty-print JSON using node.js? and I think it's useful, but I have one question: I have a page that give a result from a request sparql in an array, and I want to take just one line of this results with a button "add" that is insert in the last column of the line, and when I take the line in Json I want to write it in a file json that already exist with other data. The button call the next function:
function add(param) {
res= param;
$.ajax({
type: "POST",
url: "....",
data: { nom:resource,abstract:resume,photo:src,indice: res ,fichier:$("#myselect" ).val()}
})
.done(function( msg ) {
alert( "ajout réussie"+msg);
window.location.reload();
});
};
Where res is the index for the line that I want to add, and data all data I need to add.
So I want to know how I can change this code to use the last code posted by "Larry Battle". I have to put his code in a file "add.js" and I call this file in url? Or How?
Link for my example: https://www.dropbox.com/s/noyh1ltwljlpevw/Capture%20du%202014-05-01%2019%3A05%3A04.png
The easiest way might be to require the original json file, add the new data in memory, then save the object back as a pretty json file (overwriting the original if you like).
I'm not sure what you meant by "res is the index of the line I want to add", so I'll assume it's going to be the property name in the javascript object that you serialize to JSON. So in general it'd look something like this:
var fileData = require('/path/to/jsonData.json');
// fileData is now a JS object that was parsed from the json file); this is a sync operation.
fileData[res] = data; // data object from your existing code.
// write fileData to a JSON file like you were going to do before.
I am trying to create a jsfiddle for one of the dc.js examples. I am not able to load an external file using a URL and d3.csv().
Can someone please suggest how to load a csv file using d3.csv in jsfiddle.
The approach I usually use for CSV data in JSFiddle examples is
a. Put the data in a <pre> block at the end of the HTML mark-up, usually with the id "data".
b. Add pre {display:none;} to the CSS.
c. Replace the d3.csv(filename, callback) function call with a d3.csv.parse(text) call, using the text content of the <pre> block as the input to the parse function.
Because the parse function doesn't use a callback, it just returns the data array, you need to save that output in a variable of the same name as your callback data parameter.
In other words, if your example looks like
d3.csv("data.csv", function(error, data) {
if(error){console.log("Could not read " + "data.csv");
/* Do something with `data` here */
});
The JSFiddle-friendly version would look like:
//d3.csv("data.csv", function(error, data) {
// if(error){console.log("Could not read " + "data.csv");
var data = d3.csv.parse( d3.select("pre#data").text() );
/* Do something with `data` here */
//});
If you would rather have a full working example that uses the file-reading methods as intended, there are other options as mentioned in the comments. Tributary also allows external data files I think.
I'm using Nokogiri, at this moment, I have variable which contains code of some page: doc = Nokogiri::HTML(open(page)). There is script in code, ajax calls:
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("#menu").kendoMenu();
$('.menu_item').on('click', function (e){
$.ajax({
url: '/movie/101299-the-hunger-games-catching-fire/images?kind=backdrop&language=' + $(this).attr('alt') + '&translate=false',
cache: false
}).done(function(response) {
$('#image_panel').html(response);
});
});
$.ajax({
url: '/movie/101299-the-hunger-games-catching-fire/images?kind=backdrop&language=&translate=false', //goal
cache: false
}).done(function(response) {
$('#image_panel').html(response);
});
});
</script>
There is some way to get second request url, and place it to the variable, I need to go to this url. Unfortunately I didn't find something about it, maybe phantomjs can help me?
I think you will to manually parse the script element. You can do this by using Nokogiri to get the text of the script element. Then use a regexp to find the last url:
Assuming the script is the first on the page, you can do:
url = doc.at_css('script').text.scan(/url: '(.*)'/).last.first
The following breaks the script down to provide explanation of each step:
# Get the text of the script element
# Note that this assumes it is the first script element (you may need to be more specific)
script = doc.at_css('script').text
# Find all urls in the script
urls = script.scan(/url: '(.*)'/)
# Of the urls found, take the last one
url = urls.last
# url is actually an array of length 1, since we used a matching group in the regex
# Take the first element of the array to get the url as a string
url = url.first
#=> "/movie/101299-the-hunger-games-catching-fire/images?kind=backdrop&language=&translate=false"
in destroy.js.erb it works
$("<%= escape_javascript(render #comment) %>").appendTo("#commentlist");
how to do it for slim?
I have tried
$("= escape_javascript(render #comment)").appendTo("#commentlist");
and renamed to destroy.js.slim, but its not works
By default, Slim tries to convert your code into HTML markup, so your current code produces an error. You can check it by viewing http://<website_adress>/something/destroy.js
To fix this, you have to use pipe symbol, here is excerpt from official documentation:
The pipe tells Slim to just copy the line. It essentially escapes any processing. Each following line that is indented greater than the pipe is copied over.
http://rdoc.info/gems/slim/frames
Also, ruby embedding work a bit different for Slim, you have to use #{ruby code} instead of equal sign, if you embedding it into string.
To sum things up this is how it should look like to work:
|
$("#{escape_javascript(render #comment)}").appendTo("#commentlist");
This way you can add more lines without prepending code with pipe each time.
Just to note, there is also shortcut for escape_javascript called simply j, so you could've used this code:
|
$("#{j(render #comment)}").appendTo("#commentlist");
in view
- url_ajax = 'http://gilcierweb.com.br'
- content_for :js do
javascript:
var ids = new Array();
$('input[type=checkbox]:checked').each(function () {
var id = $(this).val();
ids.push($(this).val());
$('.' + id).fadeOut("slow").hide(1600).remove();
});
$.ajax({
type: "POST",
url: "#{escape_javascript(url_ajax)}",
data: {id_img: ids},
success: function (data) {
$('.contestants_list').append(data);
}
});
in layout
-if content_for?(:js)
== yield(:js)
I want to make an AJAX call to an HTML-returning page, extract part of the HTML (using jQuery selectors), and then use that part in my jQuery-based JavaScript.
The AJAX retrieval is pretty simple. This gives me the entire HTML document in the "data" parameter of the callback function.
What I don't understand is how to handle that data in a useful way. I'd like to wrap it in a new jQuery object and then use a selector (via find() I believe) to get just the part I want. Once I have that I'll be passing it off to another JavaScript object for insertion into my document. (This delegation is why I'm not using jQuery.load() in the first place).
The get() examples I see all seem to be variations on this:
$('.result').html(data);
...which, if I understand it correctly, inserts the entire returned document into the selected element. Not only is that suspicious (doesn't this insert the <head> etc?) but it's too coarse for what I want.
Suggestions on alternate ways to do this are most welcome.
You can use your standard selector syntax, and pass in the data as the context for the selector. The second parameter, data in this case, is our context.
$.post("getstuff.php", function(data){
var mainDiv = $("#mainDiv", data); // finds <div id='mainDiv'>...</div>
}, "html");
This is equivalent to doing:
$(data).find("#mainDiv");
Depending on how you're planning on using this, $.load() may be a better route to take, as it allows both a URL and a selector to filter the resulting data, which is passed directly into the element the method was called on:
$("#mylocaldiv").load("getstuff.php #mainDiv");
This would load the contents of <div id='mainDiv'>...</div> in getstuff.php into our local page element <div id='mylocaldiv'>...</div>.
You could create a div and then put the HTML in that, like this…
var div = $("<div>").html(data);
...and then filter the data like this…
var content = $("#content", div.get(0));
…and then use that.
This may look dangerous as you're creating an element and putting arbitrary HTML into it, but it's not: anything dangerous (like a script tag) will only be executed when it's inserted into the document. Here, we insert the data into an element, but that element is never put into the document; only if we insert content into the document would anything be inserted, and even then, only anything in content would be inserted.
You can use load on a new element, and pass that to a function:
function handle(element){
$(element).appendTo('body');
}
$(function(){
var div = $('<div/>');
div.load('/help a', function(){handle(div);});
});
Example: http://jsbin.com/ubeyu/2
You may want to look at the dataFilter() parameter of the $.ajax method. It lets you do operations on the results before they are passed out.
jQuery.ajax
You can do the thing this way
$.get(
url,
{
data : data
},
function (response) {
var page_content = $('.page-content',response).get(0);
console.log(page_content);
}
)
Here in the console.log you will see the inner HTML of the expected/desired portion from the response. Then you can use it as your wish