Question

J'ai donc téléchargé select2, je l'ai "installé" en le mettant dans mon dossier puis je l'ai chargé sur mon site lorsque je vérifie la console (où je peux voir tous les scripts en cours de chargement), je peux voir le fichier select2.js

Je suis allé voir leur documentation, je l'ai copié et ajouté $("#e9").select2();

Cependant, lorsque je charge la page, j'obtiens l'erreur suivante :

TypeError: $(...).select2 is not a function


$("#e9").select2();

Quelqu'un d'autre a-t-il vécu quelque chose comme ça ?

Informations supplémentaires, voici mon script :

    jQuery(document).ready(function(){
    var max_amount = parseFloat($('#max_amount').val());
    $( "#item_amount" ).keyup(function() {
           if($(this).val() > max_amount){
            $(this).val( max_amount);
        }
        if( /\D/.test($(this).val()) ){
            alert('Må kun indeholde tal!');
            $(this).val('');
        }
        if($(this).val()== '0'){
            alert('Må ikke være 0!');
            $(this).val('');
        }
    });
    $("#e1").select2();

});
function addToBasket(){
    var amount = $('#item_amount').val();
    if(amount == ""){
        amount = 1;
    }

    if(amount > 0){
    $.ajax({
        type: 'POST',
        url: myBaseUrl + 'Products/addItemToBasket',
        dataType: 'json',
        data: {
            id: window.location.pathname.substring(window.location.pathname.lastIndexOf('/') + 1),
            amount: amount
        },
        success: function (data) {
            var urlToBasket = myBaseUrl+'Products/basket';
            var newAmount = parseInt(amount)
            var price = data[0]['Product']['pris'];
            var id = data[0]['Product']['id'];
            var dat = data;
            var tmp_basket_html = $('#basket_amount').html();
           if($('#basket_amount').html() !== " Tom"){
              $('#shopping_table_body').append(
                  "<tr id='"+id+"'>" +
                      "<td class='image'>" +
                      ""+
                      "</td>" +
                      "<td class='name'>" +
                      " "+data[0]['Product']['name'] +
                      "</td>"+
                      "<td class='quantity'>" +
                      "x "+amount +""+
                      "</td>"+
                      "<td class='total'>" +
                      ""+price*amount+
                      "</td>" +
                      ""+
                      "<td class='remove'>" +
                      "<input class='icon-remove' type='button' onclick='removeItemFromBasket("+id+")'>"+
                      "</td>"+
                      "</tr>"
              );
           }else{
               $("#shopping_menu").append(
                   "<ul class='dropdown-menu topcartopen'>"+
                       "<li id='basket_list'>"+
                      "<table id='shopping_table'>"+
                        "<tbody id='shopping_table_body'>"+
                       "<tr id='"+id+"'>" +
                       "<td class='image'>" +
                       ""+
                       "</td>" +
                       "<td class='name'>" +
                       " "+data[0]['Product']['name'] +
                       "</td>"+
                       "<td class='quantity'>" +
                       "x "+amount +""+
                       "</td>"+
                       "<td class='total'>" +
                       ""+price*amount+
                       "</td>" +
                       ""+
                       "<td class='remove'>" +
                       "<input class='icon-remove' type='button' onclick='removeItemFromBasket("+id+")'>"+
                       "</td>"+
                       "</tr>"+
                       "</table>"+
                       "</li>"+
                       "<div class='well pull-right'>"+
                       "<input type='button' onclick='goToBasket()' class='btn btn-success' value='Tjek ud'>"+
                       "</div>"+
                       "</ul>"

               )
           }
            updateTotal(amount,price);
            updateBasketAmount();
        }
    });
    }
    Notifier.success('Vare tilføjet', 'Tilføjet'); // text and title are both optional.
}
function updateTotal(amount, price){
    var price = parseFloat(price);
    var oldValue = parseFloat($('#basket_total_cost').html());
    var newPrice = amount*price+oldValue;
    $('#basket_total_cost').html(newPrice);
}
function updateBasketAmount(){
   var tmp =  $('#basket_amount').html();
    if(!isNaN(tmp)){
   var oldAmount = parseInt(tmp.substr(0,2));
    var i = oldAmount + 1;;
    $('#basket_amount').html(
        ""+i+" vare(r)"
    );
    }else{
        $('#basket_amount').html(
            "1"+" vare(r)"
        );
    }
}
function goToBasket(){
    window.location.href = myBaseUrl+'Products/basket';
}
Était-ce utile?

La solution

J'avais ce problème lorsque j'ai commencé à utiliser Select2 avec XCrud.Je l'ai résolu en désactivant Xcrud de charger JQuery, c'était une seconde fois et le chargement sous la balise du corps.Assurez-vous donc que JQuery n'est pas chargé deux fois sur votre page.

Autres conseils

Cette erreur soulève si vos fichiers JS dans lesquels vous avez limité le Select2 avec Select Box se chargent avant que Select2 js fichiers. Veuillez vous assurer que les fichiers doivent être dans cet ordre comme ..

  • jQuery
  • SELECT2 JS
  • Votre JS

avait le même problème.Trier en différé Chargement Select2

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js" defer></script>

J'étais également confronté à la même question et notification que cette erreur s'est produite parce que le sélecteur sur lequel j'utilise Select2 n'existait pas ou n'a pas été chargé.

Assurez-vous que $ ("# sélecteur") existe en faisant

if ($("#selector").length > 0)
   $("#selector").select2();

J'ai utilisé la version jQuery Slim et j'ai reçu cette erreur.En utilisant la version de JQuery normale, le problème a été résolu.

Mettre config.assets.debug = false dans config/environments/development.rb.

Le problème est assez vieux, mais je vais mettre une petite note lorsque j'ai passé quelques heures aujourd'hui à enquêter une même question. Après avoir chargé une partie du code SELECT2 de manière dynamique2 n'a pas pu fonctionner dans une nouvelle boîte de sélection avec une erreur "$ (...). Select2 n'est pas une fonction".

J'ai trouvé que dans Select2.js non emballé, il existe une ligne qui l'empêche de reproduire la fonction principale (dans ma version 3.5.4, il est aligné 45):

if (window.Select2 !== undefined) {
    return;
}

Alors je viens de le commenquer là-bas et j'ai commencé à utiliser Select2.js (au lieu de la version minifiée).

//if (window.Select2 !== undefined) {
//    return;
//}

Et il a commencé à fonctionner très bien, bien sûr, il peut maintenant faire le traitement plusieurs fois perdre la performance, mais j'en ai besoin de toute façon.

J'espère que cela aide, Vladimir

Vous pouvez faire référence à deux scripts jQuery qui donnent l'erreur ci-dessus.

Pour moi, select2.min.js le fichier a fonctionné au lieu de select2.full.min.js.J'ai défini manuellement les fichiers que j'ai copiés à partir du dossier dist dont j'ai obtenu page github.Assurez-vous également d'en avoir un jQuery(document).ready(...) définition et fichier jquery importés avant le fichier select2.

Pour les débutants comme moi, qui finissent sur cette question: cette erreur se produit également si vous essayez d'appeler .Celler2 () sur un élément récupéré à l'aide de PURE JavaScript et n'utilisez pas JQuery.

Ceci échoue avec la "Select2 n'est pas une fonction" Erreur:

document.getElementById('e9').select2();

Ceci fonctionne:

$("#e9").select2();

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top