Isaac
asked on
cascading drop down now clearing
I have implemented a cascading drop-down with two drop down boxes and it works. The problem is that the drop downs don't clear out when a new selection is made, so it grows with current and previous values. I think it's because my array does not clear out. I tried doing used.length=0 but that did not work.
Any help would be appreciated.
Any help would be appreciated.
<tr>
<td>Priority</td>
<td>
<select id="priority">
</select>
</td>
</tr>
<tr>
<td>Station</td>
<td>
<select id="station">
</select>
</td>
</tr>
$(document).ready(function() {
fillDropDown('Project Module');
});
function fillDropDown(list, stVal) {
if (list == "Project Module") {
//The internal name for 'priority' is 'field13'
var endPointUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbyTitle('Project Module')/items?$select=field13";
}else{
if (stVal.length == 1) {
stVal = "0"+stVal;
}
var endPointUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbyTitle('Stations')/items?$select=Title&$filter=priority eq '"+stVal+"'";
}
console.log(endPointUrl);
var headers = {
"accept": "application/json;odata=verbose"
}
jQuery.ajax({
url: endPointUrl,
type: "GET",
headers: headers,
success: function (data) {
console.log(data);
appendOption(data.d.results,list);
},
error: function (err) {
alert("Error Occured:" + JSON.stringify(err));
}
});
}
function appendOption(dataOption,listName){
if (listName == "Project Module"){
var priority = document.getElementById("priority");
}else{
var station = document.getElementById("station");
}
console.log(priority);
var used = [];
var i=0;
dataOption.forEach(function(item) {
if (listName == "Project Module"){
if (used.indexOf(item.field13) == -1) {
var option = document.createElement('option');
option.value = item.field13;
option.innerHTML = item.field13;
i++;
priority.appendChild(option);
used.push(item.field13);
}
}else if (listName == "Stations"){
var option = document.createElement('option');
option.value = item.Title;
option.innerHTML = item.Title;
i++;
station.appendChild(option);
used.push(item.Title);
}
});
}
function passToStation(theSel) {
fillDropDown('Stations',theSel.value);
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks!
ASKER
// do this before start
$("#station").empty();
This just created duplicates. So I left it out.
// do this in loop
$("#station").append(new Option(item.Title, item.Title));