Parsing a XML File in Jquery - xml-parsing

I had an html file "search.html" and an xml file "videos.xml" located in same directory, I used the following code to parse it:
$.ajax({
type: "GET",
url: "videos.xml",
dataType: "xml",
success: parseXml
});
function parseXml(xml) {
$(xml).find("Video").each(function () {
var id = $(this).find("id").text();
alert(id);
}
}
This code works in the server(when i run as a web application)
i.e localhost:8080/mysite/search.html
but it is not working locally without server.
i.e file:///D:/mysite/search.html
I think it could not get the path of xml file, i tried by giving both relative path and absolute path but it does not work. So please help me to solve this.
thank you,
P.Naresh

Related

Using rails asset in javascript

I'm using rails to build a site, and I want to embed a swagger doc in one of the pages. The swagger yaml file is stored in /app/assets/myfile.yaml. In the swagger embed code (javascript) I've tried a variety of approaches:
// in myswagger.html.erb
window.onload = function() {
const ui = SwaggerUIBundle({
url: "<%= asset_path('myfile.yaml') %>",
dom_id: '#swagger-ui',
presets: [
SwaggerUIBundle.presets.apis,
SwaggerUIBundle.SwaggerUIStandalonePreset
]
})
}
I've also tried a bare path to /app/assets/myfile.yaml, document_path('myfile.yaml'), etc. But every time we end up with Fetch error Not Found /swagger.yaml.
What's the proper way to access this file and get it embedded in the javascript?
fast answer:
put the file yaml in your public folder
otherwise check what is generated at the browser level, by inspecting the page

How to debug ajax response?

I am at lost with ways to debug my Ajax callback. I'm trying to print the response from the php file to see if the call is working but without success. While the call works, the response seem to return empty... Nothing shows in the console but the response in Network tab is 200 OK and I can see the data in the response header. However not able to print it back to the console. console.log(response) should print the table but meh. What are alternative ways to debug this? Any suggestion is welcome.
js
$.ajax({
type: 'POST',
dataType : 'json',
url: 'queries/getsocial.php',
data:nvalues,
success: function(response)
{
console.log(response);//does not print in the console
}
});
So here's the proof I get that it is working server side
After a much needed 10 hour break into the night, I solved the issue with a much clearer mind. I removed the dataType row and it worked for me.
As silly as it may sound, the table in the PHP page was not in JSON format, so when jQuery tries to parse it as such, it fails.
Hope it helps for you. If not, check out more suggestions here.
Before
$.ajax({
type: 'POST',
dataType : 'json',
url: 'queries/getsocial.php',
data:nvalues,
success: function(response)
{
console.log(response);//does not print in the console
}
});
After (Works now)
$.ajax({
type: 'POST',
url: 'queries/getsocial.php',
data:nvalues,
success: function(response)
{
console.log(response);//yes prints in the console
}
});
Can you add a photo of the console? When something like that happens to me, I usually print something console.log(“Response: “+ response). At least if you see the text at least you can be sure your function is getting executed.

How do I send a user uploaded CSV file to my Rails backend with AJAX?

I am running a Rails/React web app and have a file input field for users to upload CSV files. I would like to send this CSV file to my backend, parse through it and use the info to create a new batch of users.
I have my input field
<div>
<label htmlFor="add-doc">Bulk Add</label>
<input style={{display: 'none'}} onChange={this.uploadCSV} id="add-doc" name='csv-file' type="file"/>
</div>
And my onChange function. I have tried a bunch of different things, mostly I think it comes down to how I am passing the file off, it probably is in the wrong format? I dont know
uploadCSV(evt) {
evt.preventDefault();
let file = evt.target.files[0]
let formData = new FormData();
formData.append('file', file);
$.ajax({
url: '/api/v1/client/employees',
type: 'POST',
dataType: 'json',
data: formData,
contentType: false,
processData: false
});
}
Do you use the gem pry for rails? If affirmative put a binding.pry on your controller method and write params on server terminal and put the answer.
Perhaps can be the encoding from frontend to backend.
I think you may need to use an enc type multipart/form-data because it is a file upload.
I am coming to the conclusion on the fact that you are saying the issue may be in the client side and not the server side. If you can give a specific error using a stack trace or some info from a break point, I can be of help. This is what comes on the top of my head.
uploadCSV(evt) {
evt.preventDefault();
let file = evt.target.files[0]
let formData = new FormData();
formData.append('file', file);
$.ajax({
url: '/api/v1/client/employees',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
enctype: 'multipart/form-data',
processData: false,
success: function (response) {
alert(response);
}
});
});

Rails Active Model Serializers conflict with Ajax?

When I use gem "active_model_serializers", my all Ajax can't work, my code like following:
$(document).on('change','#brand_id_dropdown', function () {
var request = "/beacons/find_beacon_uuid_given_brand_id?brand_id="
+ $('#brand_id_dropdown').val();
var aj = $.ajax({
url: request,
type: 'get',
data: $(this).serialize()
}).done(function (data) {
change_uuids(data);//modify the majors' dropdown
}).fail(function (data) {
console.log('AJAX request has FAILED');
});
});
I tried change to
data: { get_param: 'value' },
dataType: 'json'
still conflict, whenever I gem serializer and start rails server, all Ajax fail. how can I fix that?
I can't comment because I don't have enough rep. But you need to supply a little more information.
What's the failure message in the rails server logs? Check the rails server output and copy paste the errors into your question. Also, open your browser console and paste the "console" or "network" errors (in chrome: OPTION+CMD+I to show console). Lastly, throw a debugger; statement into your ajax call and play around with the variables.

InAppBrowser inject script (using executeScript)

InAppBrowser js scripts injection using {code: 'some code'} param is working perfectly but not with {file: 'local file url'} param.
var ref = window.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function() {
ref.executeSript({file: "myscript.js"});
});
how do I go about injecting script using the file param to inject my local js script?
does it require absolute file path or relative?
Must file be hosted on the child website?
It seem like a mysterious complicated thing to do as I have a few lines of script and can't embed it all using ref.executeSript({codedetails, callback: "myscript.js"});
I had the same problem. Using cordova3.1.0.
ref.executeScript(
{
file: "http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"
//webURL works fine with 'file'
}, function()
{ 
$.get("js/myscript.js", function(data)
{ //workaround to obtain code using jQuery.get
ref.executeScript(
{
code: data
}, function()
{ 
console.log('ref.executeScript done');
});
});
});
When I set the file URL as webURL http://.... ,
it worked, but I could not figure out how to point the local js file,
so I obtain code strings using $.get "js/myscript.js".
The sample code illustrates: jQuery is already installed on the phonegap App, and also trying to use jQuery on the target inAppBrowser app. Just in case.

Resources