0

I have a very weird problem that i am facing. So currently i have written a rest api code in regard to my requirement.

Basically, this is what i am doing in the code.

Getting Employee Names from a List A( Example) and then filtering the employee names to get unique values out of it.

But, Currently what is happening is, while one of my developers was working on it, she got the code to make it work as shown in the screenshot below. enter image description here

Now, when i try to access the same page, i am getting duplicate values in the employee column as shown in the image below. enter image description here

How is this possible and i would like to know how would you resolve a problem like this?

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js" type="text/javascript"></script>
  <script type="text/javascript">
       $(function(){
var employeeName=$("input[title^='Employee Name']").val();
$("input[title^='Employee Name']").hide();
$("input[title^='Employee Name']").after("<select id='EmployeeField' class='ms-RadioText'><option value=''></option></select>");
$("input[title^='Project Name']").hide();
$("input[title^='Project Name']").after("<select id='ProjectField' class='ms-RadioText'><option value=''></option></select>");

$("#EmployeeField option").each(function() {
    $(this).siblings('[value="'+ $(this).val() +'"]').remove();
});
$("#EmployeeField").change(function(){
    $("input[title^='Employee Name']").val($(this).val());
    var projects=getAllProjects($(this).val());
    $("#ProjectField").html("<option value=''></option>");
    $.each(projects,function(i,project){
        $("#ProjectField").append("<option value='"+project.Project_x0020_Name+"' pdate='"+project.Planned_x0020_Completion_x0020_D+"'>"+project.Project_x0020_Name+"</option>");
    });
    $("#ProjectField option").each(function() {
        $(this).siblings('[value="'+ $(this).val() +'"]').remove();
    });
}); 
$("#ProjectField").change(function(){
    $("input[title^='Project Name']").val($(this).val());
    var pDate=$(this).find("option:selected").attr("pdate");    
    $("input[title^='Planned Completion Date']").val(moment(pDate).format("DD/MM/YYYY"));
});
  })
   function getAllEmployeeNames(){
var results;
$.ajax({
    url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists(guid'4BFF0A20-43A2-4444-881C-18932D468E54')/items?$select=SC_x0020_Team_x0020_Leader/Title&$expand=SC_x0020_Team_x0020_Leader/Id",
    type: "GET",
    async:false,
    headers: {
        "Accept": "application/json;odata=verbose",
    },
    success: function (data) {
        if(data.d.results.length>0){
            results=data.d.results;
        }
    },
    error: function (data) {
    //alert("Error");
    }
});
return results;
 }
 function getAllProjects(employeeName){
var results;
$.ajax({
    url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists(guid'4BFF0A20-43A2-4444-881C-18932D468E54')/items?$select=Project_x0020_Name,Planned_x0020_Completion_x0020_D,SC_x0020_Team_x0020_Leader/Title&$filter=SC_x0020_Team_x0020_Leader/Title eq '"+employeeName+"'&$expand=SC_x0020_Team_x0020_Leader/Id",
    type: "GET",
    async:false,
    headers: {
        "Accept": "application/json;odata=verbose",
    },
    success: function (data) {
        if(data.d.results.length>0){
            results=data.d.results;
        }
    },
    error: function (data) {
    //alert("Error");
    }
});
return results;
    }

    function GetUniqueEmployee(){
    $.ajax( {
        method: 'GET',

        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists(guid'4BFF0A20-43A2-4444-881C-18932D468E54')/items?$select=SC_x0020_Team_x0020_Leader/Title&$expand=SC_x0020_Team_x0020_Leader/Id&$filter=SC_x0020_Team_x0020_Leader/Title ne null&$top=4000",

        contentType: "application/json; odata=verbose",
        headers: {
            "Accept": "application/json; odata=verbose"
        },
        success: function( data ) {
            var arr = [],listItemInfo ;                
            for(var i = 0; i < data.d.results.length; i++){                                 
                 arr.push(data.d.results[i].SC_x0020_Team_x0020_Leader.Title);                   
            }

            arr = $.unique(arr);                
             $.each(arr,function(i,employee){       
            $("#EmployeeField").append("<option selected='selected' value='"+employee+"'>"+employee+"</option>");

                 });                

        },
        error: function(e){
            console.log("Error");
            console.log(e);
        },
    });
}
  GetUniqueEmployee();

  • If you would like help debugging some of your code, it would be very helpful to see the actual code in question. We can't begin to speculate about what might be going wrong without seeing what you are actually trying to do! :) – Dylan Cristy Feb 5 at 15:50
  • Yes, please share the code. – Dylan Cristy Feb 5 at 15:52
  • @DylanCristy Hi, i have added the code in the post, you can take a look into it. – jayant khushalani Feb 5 at 15:59
  • Do not forget to empty the values of dropdown each time you are calling the function. – Ankit Katiyar Feb 6 at 8:14
0

How it is possible:

I think the issue is that you are using jQuery.unique() to try and get the unique employee names.

From the jQuery documentation for unique() (emphasis mine):

Description: Sorts an array of DOM elements, in place, with the duplicates removed. Note that this only works on arrays of DOM elements, not strings or numbers.

How to resolve:

Use some other method to filter out the unique names, and do not use jQuery.unique().

  • but it should have not given the results to my other developer than right? – jayant khushalani Feb 5 at 17:27
  • Theoretically true, however there are other things that could factor in to their getting different results than you: a) are you sure they are running the same code as you, and not a cached version of some older js file that filters for unique names in a different way? Or maybe your version is the older cached version? b) do they have the same permissions to the list that you do? It might be possible that they get different results because the response they get from the ajax call has been security trimmed differently than your response? – Dylan Cristy Feb 5 at 17:38
0

Modify the code as below to check if it works.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var employeeName=$("input[title^='Employee Name']").val();
    $("input[title^='Employee Name']").hide();
    $("input[title^='Employee Name']").after("<select id='EmployeeField' class='ms-RadioText'><option value=''></option></select>");
    $("input[title^='Project Name']").hide();
    $("input[title^='Project Name']").after("<select id='ProjectField' class='ms-RadioText'><option value=''></option></select>");

    var employees=getAllEmployeeNames();
    $.each(employees,function(i,employee){
        $("#EmployeeField").append("<option value='"+employee.SC_x0020_Team_x0020_Leader.Title+"'>"+employee.SC_x0020_Team_x0020_Leader.Title+"</option>");
    }); 
    $("#EmployeeField option").each(function() {
        $(this).siblings('[value="'+ $(this).val() +'"]').remove();
    });
    $("#EmployeeField").change(function(){
        $("input[title^='Employee Name']").val($(this).val());
        var projects=getAllProjects($(this).val());
        $("#ProjectField").html("<option value=''></option>");
        $.each(projects,function(i,project){
            $("#ProjectField").append("<option value='"+project.Project_x0020_Name+"' pdate='"+project.Planned_x0020_Completion_x0020_D+"'>"+project.Project_x0020_Name+"</option>");
        });
        $("#ProjectField option").each(function() {
            $(this).siblings('[value="'+ $(this).val() +'"]').remove();
        });
    }); 
    $("#ProjectField").change(function(){
        $("input[title^='Project Name']").val($(this).val());
        var pDate=$(this).find("option:selected").attr("pdate");    
        $("input[title^='Planned Completion Date']").val(moment(pDate).format("DD/MM/YYYY"));
    });
})
function getAllEmployeeNames(){
    var results;
    $.ajax({
        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists(guid'4BFF0A20-43A2-4444-881C-18932D468E54')/items?$select=SC_x0020_Team_x0020_Leader/Title&$expand=SC_x0020_Team_x0020_Leader/Id",
        type: "GET",
        async:false,
        headers: {
            "Accept": "application/json;odata=verbose",
        },
        success: function (data) {
            if(data.d.results.length>0){
                results=data.d.results;
            }
        },
        error: function (data) {
        //alert("Error");
        }
    });
    return results;
}
function getAllProjects(employeeName){
    var results;
    $.ajax({
        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists(guid'4BFF0A20-43A2-4444-881C-18932D468E54')/items?$select=Project_x0020_Name,Planned_x0020_Completion_x0020_D,SC_x0020_Team_x0020_Leader/Title&$filter=SC_x0020_Team_x0020_Leader/Title eq '"+employeeName+"'&$expand=SC_x0020_Team_x0020_Leader/Id",
        type: "GET",
        async:false,
        headers: {
            "Accept": "application/json;odata=verbose",
        },
        success: function (data) {
            if(data.d.results.length>0){
                results=data.d.results;
            }
        },
        error: function (data) {
        //alert("Error");
        }
    });
    return results;
}
</script>
  • you are not removing duplicates from the Drop down. Thus, this code would definitely give me duplicates in my drop down. – jayant khushalani Feb 7 at 7:37
  • the drop down value shows as undefined. – jayant khushalani Feb 7 at 7:40
  • The $("#EmployeeField option").each(function() { $(this).siblings('[value="'+ $(this).val() +'"]').remove(); }); code not working? – LZ_MSFT Feb 14 at 2:15

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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