Interfaccia utente di jQuery “$ (” # datepicker “). datepicker non è una funzione”

Quando uso DatePicker, il plugin dell’interfaccia utente di jQuery, in una pagina .aspx esistente ottengo errori che:

$("#datepicker").datepicker is not a function 

Tuttavia, quando copio e incollo lo stesso codice che crea e usa il datePicker in un file HTML che si trova anche nella stessa directory della pagina aspx, funziona perfettamente. Questo mi porta ad ipotizzare che ci siano alcuni file JS nella pagina aspx che impediscono il caricamento corretto di datePicker o forse i file JS dell’interfaccia utente di jQuery.

Qualcuno può confermare le mie convinzioni o fornire suggerimenti per trovare il colpevole che interferisce con i plugin UI di jQuery?

Ho faticato con un problema simile per ore. Si è poi scoperto che jQuery è stato incluso due volte, una volta dal programma che aggiungevo una funzione jQuery a una volta dal nostro debugger interno.

Se c’è un’altra libreria che sta usando la variabile $, puoi farlo:

 var $j = jQuery.noConflict(); $j("#datepicker").datepicker(); 

Assicurati inoltre che i javascript inclusi siano nell’ordine corretto in modo che la libreria jquery core sia definita prima di jquery.ui. Ho avuto problemi di causa.

Questo errore di solito appare quando ti manca un file dal set dell’interfaccia utente jQuery.

Ricontrolla di avere tutti i file, i file dell’interfaccia utente jQuery, i file CSS e le immagini e che si trovino nella posizione del file / directory collegata correttamente sul tuo server.

Se pensi che ci sia un conflitto puoi usare jQuery.noConflict() nel tuo codice. I dettagli sono nei documenti .

RIFERIMENTO MAGIA – SCORCIATOIE PER JQUERY

Se non ti piace digitare il “jQuery” completo per tutto il tempo, ci sono alcune scorciatoie alternative:

Riassegna jQuery a un’altra scorciatoia var $j = jQuery; (Questo potrebbe essere l’approccio migliore se si desidera utilizzare librerie diverse) Utilizzare la seguente tecnica, che consente di utilizzare $ all’interno di un blocco di codice senza sovrascrivere in modo permanente $:

 (function($) { /* some code that uses $ */ })(jQuery) 

Nota: se si utilizza questa tecnica, non sarà ansible utilizzare i metodi di Prototype all’interno di questa funzione capsulata che prevede che $ sia Prototype $, quindi si sta facendo la scelta di utilizzare solo jQuery in quel blocco. Usa l’argomento per l’evento pronto per DOM:

 jQuery(function($) { /*some code that uses $ */ }); 

Nota: ancora, all’interno di quel blocco non è ansible utilizzare i metodi Prototype

È dalla fine dei documenti e potrebbe esserti utile

Vai per ovvi motivi: stai facendo riferimento bene al file jquery-ui.js?

Prova a utilizzare la scheda di rete di firebug per trovare se è stata caricata o il codice javascript Information \ View della barra degli strumenti di sviluppo Web.

jQuery “$ (” # datepicker “). datepicker non è una funzione”

Ho risolto il problema inserendo i seguenti tre file nella sezione del corpo del modulo alla fine.

     

Hai provato a usare Firebug per 1) a determinare che non ci sono errori Javascript e 2) che l’elemento #datepicker esiste nella pagina?

Molto probabilmente c’è un errore prima della chiamata a datepicker che impedisce l’esecuzione della chiamata a datepicker.

So che questo post è piuttosto vecchio, ma per riferimento ho risolto questo problema aggiornando la versione di datepicker

Vale la pena provare anche questo per evitare ore di debugging.

https://cdnjs.com/libraries/bootstrap-datepicker

Ho appena avuto questo problema e spostato i riferimenti e il codice JS verso la parte inferiore della pagina prima che il correggesse per me.

Controlla anche le autorizzazioni per la directory in cui scarichi i file. Per qualche ragione quando ho scaricato questo, per impostazione predefinita è stato salvato in una cartella senza accesso consentito! Ci sono voluti per sempre per capire quale fosse il problema, ma ho dovuto solo cambiare il permesso per la directory e il suo contenuto – impostandolo in modo TUTTO = LEGGERE SOLO. Funziona alla big ora.

Mi sono imbattuto recentemente in questo problema – il problema era che avevo incluso i file dell’interfaccia utente jQuery nel tag head, ma la libreria Telerik stavo usando jQuery inclusa nella parte inferiore del tag body (apparentemente reinizializzando jQuery e scaricando l’interfaccia utente plugin precedentemente caricati).

La soluzione era scoprire dove era effettivamente incluso jQuery e, successivamente, includere gli script dell’interfaccia utente jQuery.

Ho appena incontrato un problema simile. Quando ho cambiato il mio riferimento di script dai tag auto-chiudenti (cioè, ) ai nodes vuoti (cioè, ) i miei errori sono andati via e Potrei improvvisamente fare riferimento alle funzioni dell'interfaccia utente jQuery.

A quel tempo, non mi ero reso conto che era solo una scoreggia cerebrale di me che non lo chiudevo correttamente per cominciare. (Sto postando questo semplicemente sulla possibilità che qualcun altro che sta incontrando il thread stia avendo un problema simile).

Alcuni file non caricano prima di chiamare.

Ad esempio: il tuo codice:

 <%= javascript_include_tag "distpicker.min" %> <%= javascript_include_tag "distpicker.data.min" %> 

Cambia a questo:

 <%= javascript_include_tag "distpicker.data.min" %> <%= javascript_include_tag "distpicker.min" %> 

Potrei risolvere questo problema rimuovendo il bundle jQuery su _Layout.cshtml

Intestazione

    ... 

footer

  @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/bootstrap") @RenderSection("scripts", required: false) 

Cambia il piè di pagina in

  @Scripts.Render("~/bundles/bootstrap") @RenderSection("scripts", required: false) 

Hai provato a usare $ (“# <% = txtDateElementId.ClientID%>“). Datepicker (); invece di $ (“# txtDateElementId”). datepicker (); quando si seleziona un elemento per ID usando JQuery.