How to select multiple values in dropdowns in datatable for Sharepoint 13 list?

Question

I have a list in SharePoint 13. The list is customized using Data table.Currently I have three filters with dropdown option. I want to select multiple option in the dropdown and show the result in the list. Below is the code used:

<div class="" style="float:right; padding:0px 5px 5px 0px;"><a href="javascript:resetFilters()">Reset filters</a></div>
<br/><br/>

<table width="100%" cellpadding="0" cellspacing="0" border="0" class="display" id="theResults">
<thead>

<th width="20%">Date</th>

<th width="20%">Category</th>

<th width="60%">Title and description</th>
</thead>
</table>

<script type="text/javascript">

function loadTable(theFilter,flag) {
if(theFilter != '&$filter=') { 
theFilter += " and ";
} 
theFilter += "Category ne ''";
//theFilter += "$orderby=Date";
// theFilter += "(SupportType eq 'none')&$orderby=sortorder";

var call = $.ajax({
url: strURL + theFilter,
type: "GET",
dataType: "json",
headers: {
   Accept: "application/json;odata=verbose"
}
});

call.done(function (data,textStatus, jqXHR) {
if(flag==true) {
   for (i = 0; i < fieldlist.length; i++) {
                  $( 'select[name="' + fieldlist[i][0]+ '"]' ).append( createFilters(data,fieldlist[i][0]) );        
   }
}
$('#theResults').dataTable({
   "bDestroy": true,
   "bProcessing": true,
   "sScrollY": "800px",
   "aLengthMenu": [[20, 40, 60], [20, 40, 60]],
   "iDisplayLength": 20,
   "aaData": data.d.results,
   "aaSorting": [[0, 'desc']],
   "aoColumns": [


      { "mData": "Date", "sDefaultContent": "" },
       //{ "mData": "Country_x0020_of_x0020_Origin", "sDefaultContent": "" },
       { "mData": "Category", "sDefaultContent": "" },
       //{ "mData": "Industry", "sDefaultContent": "" },
        { "mData": "Title0", "sDefaultContent": "" },
   ]
});
});

call.fail(function (jqXHR,textStatus,errorThrown) {
alert("Error retrieving Tasks: " + jqXHR.responseText);
});
}

var fieldlist = [ ["Country_x0020_of_x0020_Origin","Source"], ["Category"], ["Industry","Industry/Sector"] ]


var filterField = "";
var filterText = "";

/* SharePoint list URL*/
var strURL = "list_URL')/items?$top=1000";

builddropdowns();
filterPipeline();

</script>

You can check the below answer: sharepoint.stackexchange.com/questions/130111/… — SP 2022
– SP 2022, Commented Apr 17, 2020 at 16:44

Dylan Cristy · Accepted Answer · 2020-04-17 22:57:43Z

I don't see your <select> elements anywhere, although I'm guessing that maybe they get added dynamically in the builddropdowns() function?

Certainly you do end up with some <select> elements at some point because you are selecting them with the line:

$( 'select[name="' + fieldlist[i][0]+ '"]' ).append( createFilters(data,fieldlist[i][0]) );

You could add the multiple attribute to the <select>s to get native HTML support for multiple selections, which would look like

<select id="mySelect" name="mySelect" multiple>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

although that will change the rendering of the control from a drop-down menu to a kind of scrollable small textbox. You can see how that looks by going here and clicking the "try it yourself" button.

However, you are clearly already using jQuery, so you could consider using the jQuery plug-in library Chosen to get much slicker multiple select controls.

Thank you for the response. However, the dropdown does not show up on the page. I added the <Select> tag where the <script> tag ends. Not sure if I am adding it at the correct place :(. — Naidi
– Naidi, Commented Apr 20, 2020 at 15:11

Stack Exchange Network

How to select multiple values in dropdowns in datatable for Sharepoint 13 list?

1 Answer 1

Linked

Hot Network Questions

How to select multiple values in dropdowns in datatable for Sharepoint 13 list?

1 Answer 1

Linked

Related

Hot Network Questions