Télécharger un fichier et le redirect vers une autre page via ajax

J’ai un simple formulaire de contact pour télécharger le fichier Excel. Le problème principal se produit, lorsque le chargement ajax. Je veux télécharger le fichier Excel, puis redirect l’utilisateur vers une page suivante .. Voici mon code avec des données factices ..

Code Ajax ..

$.ajax({ type: "POST", url: "/site/ajaxexcel.php", data: {'value':'send'}, cache: false, success: function(html){ location.href = ''; } }); 

Et mon code ajaxexcel.php est:

 <?php $content= '    
Rakeshkumar
RakeshRakesh
RakeshRakesh
RakeshRakesh
RakeshRakesh
'; header('Content-type: application/excel'); header('Content-type: image/jpeg,image/gif,image/png'); header("Content-Disposition: attachment; filename=download.xls"); header("Pragma: "); header("Cache-Control: "); echo $content; ?>

Je veux juste télécharger le fichier Excel, puis redirect l’utilisateur vers un emplacement spécifique.

Aussi, vous pouvez m’aider avec votre code codeigniter si vous l’avez fait correctement.

Essayez la méthode ci-dessous, espérons que cela fonctionnera

  1. ouvrir ajaxexcel.php dans une nouvelle fenêtre via window.open
  2. il va commencer à télécharger, puis fermez-le.
  3. Dès qu’il se ferme, redirigez la page.

Je pense que c’est très difficile à télécharger. Veuillez utiliser PHP Excel pour créer un fichier et le télécharger.

Vous ne pouvez pas télécharger le fichier en utilisant la demande Ajax. De quelle manière vous devez redirect vers un emplacement particulier qui vous permettra de télécharger le fichier. Seriez-vous essayé avec cela, mais essayez de télécharger le fichier dans l’onglet séparé et redirect votre page à particulier.

    de    

De même, dans votre fichier PHP (excel.php), supprimez cette ligne. Sinon, votre fichier sera téléchargé au format JPG ou PNG.

 header('Content-type: image/jpeg,image/gif,image/png'); 

En utilisant https://github.com/johnculviner/jquery.fileDownload js:

 $.ajax({ type: "POST", url: "/site/ajaxexcel.php", data: {'value':'send'}, cache: false, success: function(html) { $.fileDownload("ajaxheader.php", { successCallback: function (url) { location.href = ''; }, failCallback: function (responseHtml, url) { alert('error'); } }); } }); 

Et du côté php, ajoutez la ligne en dessous des en-têtes:

 header("Set-Cookie: fileDownload=true; path=/"); 

vous pouvez utiliser jquery.fileDownload.js pour cela. vous pouvez trouver un exemple ici. . . http://www.codeasearch.com/working-with-jquery-filedownload-js-plugin.html

En fait, pour cette situation, je vous recommande d’ouvrir un fichier avec une option vide et une redirection. Pour ce faire, vous devez créer une structure de formulaire et l’envoyer à votre action.php.

Exemple:

 var form = document.createElement("form"); form.setAtsortingbute("method", "post"); form.setAtsortingbute("action", "action.php"); form.setAtsortingbute("target", "myView"); // or you can use _blank : form.setAtsortingbute("target", "_blank"); var hiddenField = document.createElement("input"); hiddenField.setAtsortingbute("type", "hidden"); hiddenField.setAtsortingbute("name", "message"); hiddenField.setAtsortingbute("value", "val"); form.appendChild(hiddenField); document.body.appendChild(form); window.open('', 'myView'); form.submit(); alert("Redirect in 10 second!"); setTimeout(function(){ location.href = "/home" }, 10000); 

En utilisant https://github.com/johnculviner/jquery.fileDownload

De même, dans votre fichier PHP (excel.php), supprimez cette ligne. Sinon, votre fichier sera téléchargé au format JPG ou PNG.

header ( ‘Content-type: image / jpeg, image / gif, image / jpeg’);

Vous pouvez y parvenir en créant un formulaire virtuel et en le publiant.

 function autoGenerateAndSubmitForm(method, url, post_data) { var element = document.getElementById("virtual_form"); if(element != null ) { element.parentNode.removeChild(element); } var form = document.createElement("form"); form.setAtsortingbute("id", "virtual_form"); form.setAtsortingbute("style", "display:none;"); form.setAtsortingbute("target", "_blank"); // This line is very important in your case for redirect in other page and download your file. form.method = method; form.action = url; for(i in post_data) { var element=document.createElement("input"); element.value=post_data[i]; element.name=i; form.appendChild(element); } document.body.appendChild(form); form.submit(); form.parentNode.removeChild(form); } 

Appelez la méthode ci-dessus lorsque vous en avez besoin, je suppose que vous l’avez appelée dans l’événement click

 $('button').on('click', function(e){ autoGenerateAndSubmitForm("POST","/site/ajaxexcel.php",{'value':'send'}); location.href = ''; }); 

Supprimez la ligne ci-dessous du code de votre serveur.

 header('Content-type: image/jpeg,image/gif,image/png'); 

En Ajax …. Vous pouvez simplement créer un fichier excel sur le serveur … La réponse ajax sera le chemin du fichier excel … Sur succès ajax, ouvrez le fichier excel dans un nouvel onglet (il télécharge automatiquement Excel) et à la en même temps ouvrir nouvel onglet avec nouvel emplacement.

exemple de code à l’intérieur du succès ajax donné ci-dessous

  window.open("path to excel.."); window.open("new location"); 

peut également utiliser (si nécessaire)

 window.location.replace("new location"); 

Ouvrir simultanément plusieurs liens dans Chrome en tant que nouveaux tabs

Méthode 1 : avec jQuery AJAX

Remplacez votre ajax par le code suivant.

  

window.open ouvrira le fichier ajaxexcel.php dans une fenêtre séparée et location.href redirecta vers le fichier welcome.php. C’est la meilleure méthode pour cela.

Méthode 2 : avec le plugin jQuery filedownload

Incluez simplement le script jqueryfiledownload et faites quelque chose comme ceci:

 Download  a Download  

Maintenant, lorsque vous cliquez sur l’ancre, votre fichier est téléchargé et vous pouvez écrire votre code de réussite / échec dans les fonctions done()/fail() , respectivement.

Juste utiliser avec javascript simple

 window.location.replace(###file url###); 

1) Ajax n’est pas une solution.

2) le popup window.open() sera bloqué dans la plupart des navigateurs même du même domaine (du moins cela se passait en chrome et FF il y a quelque temps, quand j’ai essayé d’implémenter quelque chose de similaire)

Quelque chose comme ceci ferait le travail: (Il ne vérifie pas des choses comme le code renvoyé, donc une sortie 404 ou non-fichier provoquera une redirection sans téléchargement)

 document.getElementById('zzz').onclick = function() { ifrm = document.createElement('iframe'); ifrm.style.display = "none"; ifrm.src = "https://github.com/SheetJS/test_files/blob/b07031a7bd5a8b86b9baac94267f20cf81c6d5eb/A4X_2013.xls?raw=true"; // some random xls file from github (it contains just a single "x" character in cell A-4) ifrm.onload = function() { window.location.href = "https://jquery.com"; }; document.body.appendChild(ifrm); return false; } la document.getElementById('zzz').onclick = function() { ifrm = document.createElement('iframe'); ifrm.style.display = "none"; ifrm.src = "https://github.com/SheetJS/test_files/blob/b07031a7bd5a8b86b9baac94267f20cf81c6d5eb/A4X_2013.xls?raw=true"; // some random xls file from github (it contains just a single "x" character in cell A-4) ifrm.onload = function() { window.location.href = "https://jquery.com"; }; document.body.appendChild(ifrm); return false; } 
  click me