asked on

Struggling getting Jquery sort and unique to work

Hi,
I have a dropdown html select box, which lists some values from an array pulled in from MySql, the following jquery code sorts this select dropdown into alphabetical order, here's the code:

$(document).ready(function() { 

    var options = $('select.whatever option');
    var arr = options.map(function(_, o) {
        return {
            t: $(o).text(),
            v: o.value
        };
    }).get();
    arr.sort(function(o1, o2) {
        return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0;
    });
    options.each(function(i, o) {
        console.log(i);
        o.value = arr[i].v;
        $(o).text(arr[i].t);
    });
});

Open in new window

The dropdown select box is called "Whatever" - this works great in that they are sorted, however I now want to only list the unique values. How can I edit the Jquery code so no duplicates exist?

Thanks

Julian Hansen

Question - why are you not sorting this using your db query?

Julian Hansen

After reading your question again why not pull the distinct values and sort them when you pull them from the DB
Something like this?

SELECT DISTINCT(listboxvalue) FROM table ORDER BY listboxvalue

Open in new window

ASKER CERTIFIED SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

damianb123

ASKER

Hi julianH,
I can't do the distinct against the SQl statement, due to the way the select statement is created via an exploded array to separate comma separated values..... I tried this, but couldn't get it to work like this:

$(document).ready(function() { 

    var options = $('select.whatever option');
	var lastvalue = '';
    var arr = options.map(function(_, o) {
        return {
            t: $(o).text(),
            v: o.value
        };
    }).get();
    arr.sort(function(o1, o2) {
        return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0;
    });
    options.each(function(i, o) {
        console.log(i);
        o.value = arr[i].v;
        $(o).text(arr[i].t);
    });
	
	var lastvalue = '';
options.each(function(i, o) {
  console.log(i);
  if (lastvalue != arr[i].v]) {
    o.value = arr[i].v;
    $(o).text(arr[i].t);
    lastvalue = arr[i].v;
  }
});
});

Open in new window

Can you help?

Thanks

Julian Hansen

When you say it does not work - can you give more details?

The code posted does work in the tests I have done here. What happens on your side - do you get an error?

Do you have a link to a page where we can see the code in action?

damianb123

ASKER

Hi julianH,
With the above code added, all it does is removes the sorting, and jumbles all the values up - so both the sort and unique don't work. This is the full page code, without your code - this works just as a sort, but lists the duplicates. Can you show me where your new code should be added?

<?php			
mysql_connect('localhost', 'cst13', 'V7]!8S1AP8');
mysql_select_db('cst13_db');

$sql = "SELECT Doctors FROM maindata WHERE Doctors != ''";
$result = mysql_query($sql) or die(mysql_error()); 

?>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

<script type='text/javascript'>



$(document).ready(function() { 

    var options = $('select.whatever option');
    var arr = options.map(function(_, o) {
        return {
            t: $(o).text(),
            v: o.value
        };
    }).get();
    arr.sort(function(o1, o2) {
        return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0;
    });
    options.each(function(i, o) {
        console.log(i);
        o.value = arr[i].v;
        $(o).text(arr[i].t);
    });
});

</script>

<?php
echo "<select class='whatever' name='DoctorID' size='1' style='font-family: Arial; font-size: 20pt; border:solid 1px #000000; border-width: 1px'>";
   echo "<option selected='selected' value='allgps'>-- See all GPs --</option>";
   while ($list = mysql_fetch_assoc($result)) {
  
	$doctors = array_filter( explode(",", $list['Doctors']), 'strlen' );
     
      foreach($doctors as $docs) {
		  
         echo "<option value='$docs'>$docs</option>";
      } 

   } 
echo "</select>";
?>

Open in new window

You can see the page working with the sort, here:

http://www.comparedrs.com/dropdown.php

Thanks for your help.

Julian Hansen

You are welcome.