Simultaneously download a file and update a database using jQuery Ajax - html

I have a link which is supposed to download a file, whilst simultaneously sending data to a PHP script via Ajax to update a database. The HTML for the link is:
<a class="rel_link" href="document.docx">Download</a>
And the jquery code is:
$("#downloadtable a").click(function(){
$.ajax({
url: "download.php",
type: "POST",
data: {dlname: dlname, dlaccount: dlaccount, dlmodule: dlmodule, dlemail: dlemail, dlsub: dlsub, dlpath: dlpath},
success: function(data){
$("#die2").detach();
}
});
});
Unfortunately the two don't seem to work simultaneously. If the jQuery is disabled, the document downloads perfectly. If the jQuery is enabled and the href attribute is set to href="#"', the jQuery works and the data is written to the database. However, if jQuery is enabled and the href is set tohref="document.docx"`, the file downloads but the data does not get passed to the database. The only error message I'm getting on the console is:
Resource interpreted as Document but transferred with MIME type application/vnd.openxmlformats-officedocument.wordprocessingml.document: "http://www.mysite.org.uk/downloads/document.docx".
Can anyone shed any light on how to simultaneously download a document and write to the database via Ajax?
Many thanks

If you switch the href to point to a php, you problem might be solved.
Then you can write into database, and initiate the download with the appropriate header() calls.
Look on Example#1:
http://php.net/manual/en/function.header.php

Related

How do I clear cached angularjs files

I have an angularjs based web application with some functionality deployed to users that I need to hide. I've added the code to hide it and successfully verified the controls are hidden when appropriate but there are still users who have the old version of the file and can perform the undesired activities. Is there a way I can control from the server the view file to refresh on the client? (The tester was able to clear their cache but it's a burden to the users in the field)
Thanks!
Scott
One way to handle this would be to version the files. For example, the following line in your index.html
<script src="abc.js" />
could be rewritten as
<script src="abc.js?v1" />
v1 is the current file version and should be changed for each deployment of your application when abc.js has changed.
Since index.html(the initial page) is obtained from the server, updations to abc.js will now be reflected on all your clients.
This would need to be automated in a huge application. You could use Grunt for this. You can refer the following answer on StackOverflow for automating this:
https://stackoverflow.com/a/20446748/802651
UPDATE
HTML views/templates are cached using $templateCache in AngularJS. Basically, when you request templates for the first time, browser requests the template from the server and puts it in the template cache. Any subsequent requests to the same template are served from the template cache.
If you do not want these to be cached, you could listen to the $routeChangeStart event inside app.run block to remove the specific templates.
app.run(function($rootScope, $templateCache) {
$rootScope.$on('$routeChangeStart', function(event, next, current) {
if (typeof(current) !== 'undefined'){
$templateCache.remove(current.templateUrl);
}
});
});
Reference: http://opensourcesoftwareandme.blogspot.in/2014/02/safely-prevent-template-caching-in-angularjs.html

HTML link to either local network or domain name

In my web page, I want to link to another web server in my local network.
I use <a href="192.168.1.111:8080/index.jsp">to do this when I am in local network. However, when I access the website outside the local network, I need to use domain name. <a href="mydomain.com:8080/index.jsp">
How can I do this in same page of code if I would access it from both LAN and WAN.
Well, if it's an option, the easiest way to avoid this issue is using relative links. For example, if you're linking to another page on the same website, your link will always work if it's something like "../directory/some-web-page.html" rather than a full link with http included.
Otherwise, if you're linking to a completely different site, you could check whether your page exists on the local server using a very simple JQuery ajax request. If it doesn't exist, then assume you are not signed in to the same network and insert your remote domain name.
As discussed here, your simple ajax request can just fetch the HEAD of the locally hosted page, that way you're not fetching too much data and only confirming whether it exists. Your code could be something like this:
$( document ).ready(function(){
$.ajax({
url: 'path/to/your-file.html',
type: 'HEAD',
success: function() {
// page exists
// replace the href attribute with local host link
document.getElementById('your-link').setAttribute('href', 'path/to/your-file.html');
},
error: function() {
// page does not exist
// do nothing, so your link sends user to remote site
}
});
});
And then, in your HTML, just include the link to your remote site like so:
<a id="your-link" href="yourremotesite.com">This is a link</a>
This should work on both a local and remote server without having to change the code.
EDIT:
I had to jump out of bed because another answer was just nagging at me...
You can also try accessing window.location.host or window.location.hostname and testing that in an if-statement to determine whether your page is on the local host or remote server.
Anyway, I hope one of these solutions helps. Good night and good luck!
HTML:
link
javascript:
<script>
window.onload=myFunction;
function myFunction() {
var x = document.domain;
var a = document.getElementById('link');
a.href = x + "/index.jsp";
}
</script>

AngularJS, JSON, and js restrictions. How read a JSON file from outside with $http.get and "file:///" URI?

Is there any known and consolidated alternative for defining a new Angular scope reading data from outside?
I am working on a demo that should make available a standalone html page which reads the data from the same html file position, and on client machines without any webserver.
This because the HTML is generated on the fly from a pdf.
Do you have any idea?
In my working code below I should change $http.get('data.json'.. to avoid the Google restriction (on Firefox my sample is working fine).
<script>
var isisApp = angular.module('isisApp', []);
isisApp.controller('ISISListCtrl', function($scope, $http) {
$http.get('data.json').success(function(data) {
$scope.IsisDocument = data;
etc.....
and this is the error I get from Chrome:
XMLHttpRequest cannot load file:///C:/temp/data.json. Cross origin requests are only supported for HTTP. angular.js:8081
Error: A network error occurred.
Thanks in advance
Fabio
If you want to test your code, while developing, you have two options:
Use a local web server. You could use Node.js platform, using expressjs.
Start Chrome from the terminal with the –allow-file-access-from-files option

#3503 Error Attempting to Publish Custom Action via JSSDK

I am attempting to work out what is needed to publish a custom open graph action that includes user generated photos. I have made it through the approval process and am currently testing using the JSSDK. I have the following code which seems to work:
FB.api('/me/cheezburger-app:create', 'post', {
meme:'http://cheezburger.com/6459677184'
}, function(response){
console.log(response);
});
My understanding is, to publish this as user generated photo all I need to do is include an image property containing an array of objects like this:
FB.api('/me/cheezburger-app:create', 'post', {
meme:'http://cheezburger.com/6509097984',
image:[{user_generated:true, url:'https://i.chzbgr.com/completestore/12/8/13/c9Smb0ba2EGTLepkCgEp2g2.jpg'}]
}, function(response){
console.log(response);
});
Sadly, this returns the following error:
{"error":{"message":"(#3503) \"[{\"user_generated\":true,\"url\":\"https://i.chzbgr.com/completestore/12/8/13/c9Smb0ba2EGTLepkCgEp2g2.jpg\"}]\" is an invalid value for property \"image:url\" with type \"URL\"","type":"OAuthException","code":3503}}
I was able to successfully get the action to publish using the graph api explorer, but it is not using a javascript object and jquery. I assume I am doing something wrong with the way I am passing the extra parameter. But I just can't figure out what.
I haven’t tried this yet, but my guess (since it’s not clearly described in the docs) would be that you have to give a string value containing JSON-encoded data like in other similar cases.
image: '[{"user_generated":"true","url":"https:\/\/i.chzbgr.com\/completestore\/12\/8\/13\/c9Smb0ba2EGTLepkCgEp2g2.jpg"}]'

Beginner JSON/JQuery Issue

I'm building a Django application and am trying to integrate JSON, but I'm having some issues. Django is generating the feed, which is here: http://www.crowdpoint.org/session/1/activeCheck
Here is the JQuery I'm using to pull down the feed. The problem is that neither of the alerts fire, so I don't think the code is working.
$(document).ready(function() {
$.getJSON('http://www.crowdpoint.org/session/1/activeCheck', function(data) {
alert('Test 1')
$.each(data, function(key, val) {
alert('Test 2');
});
});
It's probably a same origin policy violation. If the JS and the JSON resource are on the same domain, you should be using a local path not a fully qualified URI. For example...
instead of this
$.getJSON('http://www.crowdpoint.org/session/1/activeCheck' ...
use this
$.getJSON('/session/1/activeCheck' ...
My guess is you're accessing the originating URL on http://crowdpoint.org/ or something else that isn't exactly http://www.crowdpoint.org/
If the script and resource are on different domains, you'll need to use JSONP which would involve some changes to the way your service responds.
you miss ; in the third line....