1

I am trying to attach the select2 to a choice field named: Filters. The functionality i'm interested in is the search function it provides.

This is my code, but I can't get it to work? Please help

 <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
 <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices-2014.02.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('Filters').select2();
});
              </script>

Thanks!

UPDATE - SOLUTION

The thing that was causing my problem was that i had several script editors on the newform, and all of them were referencing the jquery. When referencing more than one on the same page it causes select2 to not load.

This is the code that worked for me:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> 

<script type="text/javascript">
$(document).ready(function() {
$('[title=Filters]').select2();
});
</script>

closed as off-topic by Gaurravs, Christoffer, Karthik Jaganathan, MHeld, Waqas Sarwar MVP Nov 29 '18 at 17:40

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Programming questions not specific to SharePoint are off-topic here, but can be asked on Stack Overflow." – Gaurravs, Christoffer, Karthik Jaganathan, MHeld, Waqas Sarwar MVP
If this question can be reworded to fit the rules in the help center, please edit the question.

1

First of all, I think it's required to include jquery before select2. In order to apply select2 on your desired select field, you must target it with its title attribute like so:

$('[title=Filters]').select2();

You may right-click and inspect-element to be sure your field has that name.

Not the answer you're looking for? Browse other questions tagged or ask your own question.