2009-11-30 15 views
6

Ecco cosa sto cercando di realizzare. Ho una forma che usa jQuery per fare una chiamata AJAX a un file PHP. Il file PHP interagisce con un database e quindi crea il contenuto della pagina da restituire come risposta AJAX; Ad esempio, il contenuto di questa pagina viene scritto in una nuova finestra nella funzione di successo per la chiamata $.ajax. Come parte del contenuto della pagina restituito dal file PHP, ho un semplice tag script HTML che ha un file JavaScript. In particolare:Perché il mio tag <script> non funziona con il file php? (jQuery coinvolto anche qui)

<script type="text/javascript" src="pageControl.js"></script> 

Ciò non si ripercuote sul php (anche se ho provato), è solo html. Il pageControl.js è nella stessa directory del mio file php che genera il contenuto.

Non importa quello che provo, non riesco a ottenere il file pageControl.js incluso o il lavoro nella risultante nuova finestra creata in risposta al successo nella chiamata AJAX. Finisco con errori come "Oggetto atteso" o variabile non definita, che mi porta a credere che il file non venga incluso. Se copio il codice JavaScript direttamente nel file PHP, invece di usare il tag script con src, posso farlo funzionare.

C'è qualcosa che mi manca qui riguardo la risoluzione dello scope tra file di chiamata, php e jQuery AJAX? Ho intenzione di voler includere i file javascript in questo modo in futuro e vorrei capire cosa sto facendo male.


Ciao di nuovo:

ho lavorato via a questo problema, e ancora senza fortuna. Cercherò di chiarire quello che sto facendo, e forse questo mi farà venire in mente qualcosa. Sto includendo del codice come richiesto per aiutare a chiarire un po 'le cose.

Ecco la sequenza:

  1. L'utente seleziona alcune opzioni, e fa clic pulsante di invio sulla forma.
  2. Il pulsante modulo click è gestita da codice jQuery che assomiglia a questo:

    $(document).ready(function() { 
        $("#runReport").click(function() { 
    
        var report = $("#report").val(); 
        var program = $("#program").val(); 
        var session = $("#session").val(); 
        var students = $("#students").val(); 
    
        var dataString = 'report=' +report+ 
            '&program=' +program+ 
            '&session=' +session+ 
            '&students=' +students; 
    
        $.ajax({ 
         type: "POST", 
         url: "process_report_request.php", 
         cache: false, 
         data: dataString, 
         success: function(pageContent) { 
          if (pageContent) { 
           $("#result_msg").addClass("successMsg") 
            .text("Report created."); 
    
           var windowFeatures = "width=800,menubar=yes,scrollbars=1,resizable=1,status=yes"; 
    
           // open a new report window 
           var reportWindow = window.open("", "newReportWindow", windowFeatures); 
    
           // add the report data itself returned from the AJAX call 
           reportWindow.document.write(pageContent); 
           reportWindow.document.close(); 
          } 
          else { 
           $("#result_msg").addClass("failedMsg") 
            .text("Report creation failed."); 
          } 
         } 
        }); // end ajax call 
        // return false from click function to prevent normal submit handling 
        return false; 
        }); // end click call  
    }); // end ready call 
    

Questo codice esegue una chiamata AJAX in un file PHP (process_report_request.php) che crea il contenuto della pagina per la nuova finestra . Questo contenuto è preso da un database e HTML. Nel file PHP voglio includere un altro file javascript in testa con javascript utilizzato nella nuova finestra. Sto cercando di comprendere come segue

<script src="/folder1/folder2/folder3/pageControl.js" type="text/javascript"></script> 

nomi delle cartelle percorso cambiato per proteggere gli innocenti :)

Il file pageControl.js è in realtà nella stessa cartella del file di codice jQuery e il file php, ma sto provando il percorso completo solo per essere al sicuro. Sono anche in grado di accedere al file js utilizzando l'URL nel browser e posso inserirlo con successo in una pagina di prova html statica utilizzando il tag src dello script.

Dopo che il file javascript è incluso nel file php, ho una chiamata a una delle sue funzioni nel modo seguente (eco da php):

echo '<script type="text/javascript" language="javascript">writePageControls();</script>'; 

Quindi, una volta che il file php invia tutte pagina il contenuto torna alla chiamata AJAX, quindi la nuova finestra viene aperta e il contenuto restituito viene scritto dal codice jQuery sopra.

La riga writePageControls è dove viene visualizzato l'errore "Errore: oggetto previsto" quando eseguo la pagina. Tuttavia, dal momento che JavaScript funziona bene sia nella pagina HTML statica che quando è incluso "in linea" nel file PHP, mi sta portando a pensare che questo sia un problema di percorso di qualche tipo.

Anche in questo caso, indipendentemente da ciò che provo, le mie chiamate alle funzioni nel file pageControls.js non funzionano. Se inserisco il contenuto del file pageControl.js nel file php tra tag di script e non modifica nient'altro, funziona come previsto.

Sulla base di ciò che alcuni di voi hanno già detto, mi chiedo se la risoluzione del percorso per la finestra appena aperta non sia corretta. Ma non capisco perché, perché sto usando il percorso completo. Anche per confondere le cose ancora di più, il mio foglio di stile collegato funziona bene dal file PHP.

Mi scuso per quanto tempo è, ma se qualcuno ha il tempo di guardare oltre, lo apprezzerei molto. Sono perplesso. Sono un principiante quando si tratta di molto di questo, quindi se c'è solo un modo migliore per fare questo ed evitare questo problema, io sono tutto orecchie (o gli occhi suppongo ...)

+0

Puoi postare alcuni messaggi di errore? –

+0

Come stai cercando di usarlo? Forse non è caricato prima di tentare di usarlo. – Greg

+0

Sei sicuro che il percorso di "pageControl.js" si risolva correttamente all'interno della nuova finestra? – James

risposta

2

Ho anche avuto problemi con un problema simile a questo, e questo è stato un vero mal di testa. Il seguente approccio potrebbe non essere elegante, ma ha funzionato per me.

  1. Assicurarsi che il file php, emette solo quello che vuoi nel vostro corpo
  2. Add jquery alla testa finestra dinamicamente
  3. Aggiungi tutti i file di script esterni alla testa finestra dinamicamente
  4. utilizzare jQuery html sul documento della finestra per chiamare html() con il contenuto caricato sul corpo, in modo che gli script vengano valutati.

Ad esempio, nel vostro successo Ajax:

success: function(pageContent) { 
     var windowFeatures = "width=800,menubar=yes,scrollbars=1,resizable=1,status=yes"; 
     var reportWindow = window.open("", "newReportWindow", windowFeatures); 

     // boilerplate 
     var boilerplate = "<html><head></head><body></body></html>"; 

     reportWindow.document.write(boilerplate); 

     var head = reportWindow.document.getElementsByTagName("head")[0]; 

     var jquery = reportWindow.document.createElement("script"); 
     jquery.type = "text/javascript"; 
     jquery.src = "http://code.jquery.com/jquery-1.7.min.js"; 
     head.appendChild(jquery); 

     var js = reportWindow.document.createElement("script"); 
     js.type = "text/javascript"; 
     js.src = "/folder1/folder2/folder3/pageControl.js"; 
     js.onload= function() { 
      reportWindow.$("body").html(pageContent); 
     }; 
     head.appendChild(js); 


     reportWindow.document.close(); 

    } 

Buona fortuna!

+0

Accetterò questa risposta perché penso che sia più vicina a una soluzione che avrebbe funzionato se avessi mantenuto il mio progetto originale. Per essere onesti, ho ridisegnato il mio codice per eliminare il problema con il file pageControl.js. Questo non ha risolto la mia domanda originale, ma ho dovuto farlo funzionare e andare avanti! Ringrazia tutti. –

2

Assicurati che lo hai all'interno di <head> o <body> della pagina HTML. Inoltre, vorrei ricontrollare il percorso del file .js. Puoi farlo incollando "pageControl.js" nella radice del tuo indirizzo web.

+0

"Accertati di averlo all'interno o nella pagina HTML." Potresti approfondire un po '? Non sono sicuro cosa intendi. –

+0

Oops, ho dimenticato tutti i tag di codice importanti lì. – Myles

3

Probabilmente non sta guardando dove pensi che stia cercando di prendere il tuo file javascript.

Prova un formato relativo al server in questo modo:

<script src="/some/path/to/pageControl.js"></script> 

Se questo ancora non funziona, verificare che sia possibile digitare l'URL al file di script nel browser e farlo per scaricare.

+0

Posso accedere al file di script usando l'url e ottenere l'opzione per il download. Grazie per quello però. Non ho pensato di provarlo. L'utilizzo di un percorso relativo al server come descritto sopra, tuttavia, non sembra essere d'aiuto. –

+0

Il problema non riguarda i percorsi. Non è possibile document.write e ottenere per valutare correttamente gli script senza una quantità terribile di problemi circa – devrooms

+1

-1 concordato con @devrooms –

1

Cose da cercare:

  • Usa Firebug (scheda NET) per verificare se il file js è caricato con lo stato 200. Controlla anche nella scheda Console per eventuali errori javascript.
  • Si sta utilizzando HTML5 offline. Se lo fai, forse serve una versione memorizzata nella cache che non include il tuo tag <script>.
  • Visualizza l'origine della pagina e assicurati che includa il tag script.
  • Modificare l'attributo di origine sul percorso assoluto: <script src="http://www.example.com/js/pageControl.js" type="text/javascript"></script>
  • Visitare il numero http://www.example.com/js/pageControl.js e assicurarsi che sia visualizzato correttamente.
  • Provare a posizionare lo <script> subito dopo lo <head> in modo che venga caricato per primo.

Questo è tutto quello che potevo pensare.

+0

aha! ho appena capito quanti anni ha questa domanda. –

+0

Solo perché è vecchio non significa che non lo sto ancora controllando! :) Grazie per l'input. Alcuni buoni articoli lì da considerare penso. –

1

È possibile caricare in modo dinamico lo script creando l'elemento e poi aggiungerlo a testa o altro elemento:

reportWindow.document.write(pageContent);      
var script = document.createElement('script'); 
script.src = 'pageControl.js'; 
script.type = 'text/javascript'; 
reportWindow.document.getElementsByTagName('head')[0].appendChild(script); 
reportWindow.document.close(); 
0

Per me suona come ti aspetti uno script scaricato al lavoro.

provare a prendere uno sguardo qui: http://ensure.codeplex.com/SourceControl/changeset/view/9070#201379

Questo è un po 'di javascript che assicura che lo script sia caricata correttamente prima che l'accesso è tentato. È possibile utilizzarlo come caricamento pigro (caricando i file javascript solo quando richiesto) o, come interpreto il problema, caricando uno script in base al risultato delle chiamate Ajax.

1

Hai provato a usare il jquery $("#target_div").load(...) Esegue anche JS all'interno l'uscita ...

Leggere questo documento per sapere come usarlo:

http://api.jquery.com/load/

+0

No, non l'avevo provato. Grazie per segnalarlo! –

0

Che cosa sta accadendo è probabilmente , stai facendo eco ad una stringa tramite un callback ajax, non inserendo un elemento. Gli script esterni richiedono una seconda chiamata GET per caricare i loro contenuti, il che non sta succedendo - solo la prima chiamata è avvenuta. Quindi, quando la prima chiamata include il codice inline, il DOM non deve effettuare una richiesta GET aggiuntiva per recuperare il contenuto. Se il DOM non vede lo script, il DOM non lo eseguirà, il che significa che si tratta solo di un tag casuale.

C'è un modo molto veloce per scoprirlo. In Chrome (o Firefox con il plugin Firebug installato), controlla il menu a discesa console> scripts per vedere tutti gli script caricati. Se non è elencato, non è caricato e il tag di script che vedi nel markup è altrimenti inerte.

Poiché è probabilmente solo una stringa per quanto riguarda le cure PHP, è possibile crearlo come oggetto DOM PHP e inserirlo correttamente (anche se ciò potrebbe essere laborioso). Invece, forse posizionalo alla fine della pagina, subito prima dei tag di chiusura del corpo. (Questa è la posizione preferita per js in ogni caso - dead last, dopo che tutti gli altri elementi della pagina sono stati caricati e sono disponibili per il DOM.)

HTH :)

Problemi correlati