How to Remove Duplicates From Array in Javascript?

Question

Here I have two multiline textboxes and enter some data in two textboxes like txt1 1,1,1,2,2,2,3 txt2 1,2,3,4,5, when i press Filter button it shows the data in thirdtextbox like txt3 4,5 (both the textboxes are having these numbers) My snippet is

<script type="text/javascript">
    function GetDistinctElements(source,source1, target) {           
        var input = source.value.trim().replace(';', ',').split(',');
        var input1 = source1.value.trim().replace(';', ',').split(',');           
        var Array = input.concat(input1);
        var distinctArray = Array.filter(function (item, pos) {              
            return Array.indexOf(item) == pos;
        });           
        target.value = distinctArray.join(',');
    }
</script>

and my controls are

<table border="0" align="left">
    <tr>
        <td>Enter Numbers:</td>
        <td> <asp:TextBox ID="txt1" TextMode="MultiLine" runat="server"></asp:TextBox></td>
        <td>Enter Numbers:</td>
        <td><asp:TextBox ID="txt2" TextMode="MultiLine" runat="server"></asp:TextBox></td>
    </tr>
    <tr>
        <td><input type='button' value='Get Distinct Items' onclick='GetDistinctElements(<%= txt1.ClientID %>,<%= txt2.ClientID %>,<%= txt3.ClientID %>); return false;' /></td>
        <td><asp:TextBox ID="txt3" TextMode="MultiLine" runat="server"></asp:TextBox></td>
    </tr>
</table>

when I tried this snippet, I didn`t get the expected output.

http://stackoverflow.com/questions/4343746/is-there-a-data-structure-like-the-java-set-in-javascript — prime, Jan 25 '15 at 06:48
http://stackoverflow.com/questions/2523436/javascript-implementation-of-a-set-data-structure — prime, Jan 25 '15 at 06:49
*"I didn`t get the expected output."* - You could be a bit clearer about what the expected output actually is. And did you get some other output instead, or an error in your browser's dev console? — nnnnnn, Jan 25 '15 at 06:58
txt1: 1,1,1,2,2,2,3 txt2: 1,2,3,4,5, when i press Filter button it shows the data in thirdtextbox like txt3: 1,2,3 (both the textboxes — user4491399, Jan 25 '15 at 07:03

Koen · Answer 1 · 2015-01-25T08:12:07.707

0

Replace this:

var Array = input.concat(input1);
var distinctArray = Array.filter(function (item, pos) {              
    return Array.indexOf(item) == pos;
});

by this:

var input2 = input.concat(input1);
input2.sort(function(a,b){return a-b});
var prev= null;
var distinctArray = input2.filter(function (item, pos) {              
    if (item == prev){
      return false;
    }
    prev = item;
    return true;
});

edited Jan 25 '15 at 08:12

answered Jan 25 '15 at 07:09

Koen

278
1
7

,thanks for your reply...but it shows two textboxes values in third textbox like t1:1,2,3.t2:1,3,4,5 t3:1,2,3,1,3,4,5 – user4491399 Jan 25 '15 at 07:14
fixed that with adding `input2.sort();` – Koen Jan 25 '15 at 08:04

score 0 · Accepted Answer · answered Jan 25 '15 at 11:28

I got the Answer

 function GetDistinctElements(source,source1, target) {
        // Get the items in your input
        var input = source.value.trim().replace(';', ',').split(',');
        var input1 = source1.value.trim().replace(';', ',').split(',');           
        input1 = input1.filter(function (val) {
            return input.indexOf(val) == -1;
        });
        // Output the result in  target area
        target.value = input1.join(',');

How to Remove Duplicates From Array in Javascript?

2 Answers2