Javascript di potenziamento degli elementi nelle pagine master ASP.NET

StackOverflow https://stackoverflow.com/questions/176171

Domanda

Mi sono imbattuto in un piccolo problema e ho fatto un po' di ricerche, ma ho difficoltà a trovare una risposta/soluzione definitiva.

Fondamentalmente, ho alcuni javascript (creati da una terza parte) che fanno cose strabilianti sugli elementi della pagina per renderli belli.Il codice funziona benissimo su singole pagine (ad es.no master), tuttavia, quando provo ad applicare gli effetti a una pagina di contenuto all'interno di un master, non funziona.

In breve, ho una pagina master che contiene il riferimento allo script principale.Tutte le pagine utilizzeranno lo script, ma i parametri passati ad esso saranno diversi per le pagine di contenuto.

Riferimento allo script della pagina master

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

Pagina singola

<script>
    MakePretty("elementID");
</script>

Come puoi vedere, ho bisogno del riferimento in ogni pagina (quindi nel master) ma gli elementi effettivi che voglio "MakePretty" cambieranno in base al contenuto.

Pagine di contenuti

Ora, poiché la pagina di contenuto non ha un file <head> elemento, ho utilizzato il seguente codice per aggiungerlo alle pagine master <head> elemento:

HtmlGenericControl ctl = new HtmlGenericControl("script");
ctl.Attributes.Add("language", "javascript");
ctl.InnerHtml = @"MakePretty(""elementID"")";
Master.Page.Header.Controls.Add(ctl);

Ora questo non funziona.Tuttavia, se lo sostituisco con qualcosa di semplice come alert("HI!"), funziona tutto bene.Quindi il codice viene aggiunto correttamente, semplicemente non sembra essere sempre eseguito a seconda di ciò che sta facendo..

Ora, dopo aver scavato un po', ho scoperto che la pagina di contenuto's Load viene generato prima delle pagine master, il che potrebbe avere un effetto, tuttavia, pensavo che il javascript sulla pagina fosse caricato/eseguito tutto contemporaneamente?

Perdonami se questa è una domanda stupida, ma sono ancora relativamente nuovo nell'uso di JavaScript, specialmente nello scenario delle pagine master.

Come posso fare in modo che le pagine di contenuto richiamino il codice JavaScript a cui si fa riferimento nella pagina Master?

Grazie per tutto l'aiuto su questi ragazzi, mi aiuterete davvero con questo problema di lavoro.

APPUNTI:

  • RegisterStartupScript e simili non sembrano funzionare a nessun livello..
  • Gli ID di controllo vengono impostati correttamente, anche nell'ambiente MasterPage e vengono visualizzati come previsto.

Mi scuso se tutto ciò non è chiaro, sono davvero stanco quindi, se necessario, commenta se è necessaria una riformulazione/chiarimento.

È stato utile?

Soluzione

Inserisci un ContentPlaceHolder nella sezione head della pagina master, quindi aggiungi un controllo asp:Content nella pagina di contenuto che fa riferimento al segnaposto e inserisci lo script in quel controllo.Puoi personalizzarlo per ogni pagina in questo modo.

Inoltre, il riferimento tramite ID potrebbe non funzionare perché quando utilizzi le pagine master, gli ID di controllo sulla pagina vengono creati automaticamente in base alla struttura del contenitore.Quindi, invece di "elementID" come previsto, potrebbe emettere "ctl00_MainContentPlaceHolder_elementID" Visualizza la tua fonte o usa firebug per ispezionare gli elementi del modulo per vedere quali sono gli ID emessi.

Altri suggerimenti

Non è possibile fare con javascript pulito? -)

- aggiungi qualcosa di simile a questo all'interno del body-tag: 

<script type="text/javascript">
  window.onload = function(){
    MakePretty("elementID");
  }
</script>

A proposito, il tag script deve avere un end-tag: 

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

Perché non usare jQuery per trovare tutti i controlli? Qualcosa del genere: 

$(document).ready(function(){
  $("input[type='text'], input[type='radio'], input[type='checkbox'], select, textarea").each(function(){
    MakePretty(this);
  });
});

In questo modo otterrai tutti gli elementi sulla pagina, puoi aspettare che la pagina sia pronta (quindi non modifichi il DOM in modo illecito). Il selettore jQuery può ottenere gli elementi in un po 'più di un formato specifico se necessario (ad esempio, aggiungere un elemento radice, come l'ID del div del corpo).

Sarebbe anche meglio modificare il metodo MakePretty in modo che l'elemento non l'ID come parametro per ridurre il sovraccarico di elaborazione.

Dopo aver utilizzato le pagine mastro, gli ID dei controlli sul lato client non sono quelli che ritieni siano. Dovresti usare Control.ClientID quando generi lo script.

Quando si utilizzano le pagine mastro, è necessario prestare attenzione all'ID dell'attributo html, poiché .NET modificherà questo valore in quanto deve mantenere gli ID univoci.

Suppongo che il tuo javascript stia applicando gli stili CSS tramite ID, e quando usi le pagine master l'ID è diverso da quello che è nel tuo aspx. Se verifichi che il tuo javascript sia sempre aggiunto, la tua risposta deve tenere conto di quanto segue:

  • SEMPRE imposta l'ID della pagina principale nel caricamento della pagina (this.ID = " myPrefix " ;;)
  • Qualsiasi elemento HTML nella tua pagina principale sarà preceduto dall'id della pagina principale (cioè: nella pagina renderizzata sarà " myPrefix_myDiv ")
  • Qualsiasi elemento HTML nell'ID del segnaposto del contenuto sarà preceduto da un prefisso aggiuntivo (ad esempio myPrefix_ContentPlaceHolderId1_myDiv)

Per favore fatemi sapere se posso chiarire qualcosa. Spero che questo aiuti!

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top