How to use complex json as source for autocomplete

How to use complex json as source for autocomplete

I have a fairly complex json object and I would like to combine arrays of names as source for an autocomplete. My situation is similar to that of a school, so to make it simple I'll make a structure similar to that of classes in a school. I want to get teachers names as source for this input. Any ideas on how to go about doing this? Here is my example:

  1. <script type="text/javascript">

  2. var mynames = { "schoolyear": [ 
  3. {"year":1, "group": [ 
  4. {"value":1, "schoolday":"Tuesday", "teachers_names": {"value":["Mr. A"]} },
  5. {"value":2, "schoolday":"Saturday", "teachers_names": {"value":["Mrs. B"]} },
  6. {"value":3, "schoolday":"Saturday", "teachers_names": {"value":["Mr. C","Mrs. D"]} }
  7. ] },
  8. {"year":2, "group": [ 
  9. {"value":1, "schoolday":"Tuesday", "teachers_names": {"value":["Mr. E"]} },
  10. {"value":2, "schoolday":"Tuesday", "teachers_names": {"value":["Mrs. F","Mr. G"]} },
  11. {"value":3, "schoolday":"Saturday", "teachers_names": {"value":["Mrs. H","Mr. I"]} } 
  12. ] },
  13. {"year":3, "group": [ 
  14. {"value":1, "schoolday":"Saturday", "teachers_names": {"value":["Mrs. J"]} },
  15. {"value":2, "schoolday":"Tuesday", "teachers_names": {"value":["Mr. K","Mrs. L"]} } 
  16. ] },
  17. {"year":4, "group": [
  18. {"value":1, "schoolday":"Saturday", "teachers_names": {"value":["Mr. M","Mrs. N","Mr. O"]} }
  19. ] },
  20. {"year":5, "group": [
  21. {"value":1, "schoolday":"Thursday", "teachers_names": {"value":["Mrs. P","Mr. Q","Mrs. R","Mrs. S","Mr. T"]} }
  22. ] },
  23. {"year":6, "group": [
  24. {"value":1, "schoolday":"Saturday", "teachers_names": {"value":["Mrs. U","Mr. V"]} }
  25. ] },
  26. ] }

  27. $(document).ready(function(){

  28.      $("input#teachernames").autocomplete({
  29.            source: mynames.schoolyear, // how should I access "teachers_names" and build strings from the arrays?
  30.      });

  31. });
  32. </script>

  33. <label for="teachernames">Select teachers:</label><input name="teachernames" id="teachernames" />

Based on the above json object, I would like my autocomplete to look something like this:
                 ┌─────────────────┐
Select teachers: │ M               │
_________________└─────────────────┘_____
| Mr. A                                 |
| Mrs. B                                |
| Mr. C, Mrs. D                         |
| Mr. E                                 |
| Mrs. F, Mr. G                         |
| Mrs. H, Mr. I                         |
| Mrs. J                                |
| Mr. K, Mrs. L                         |
| Mr. M, Mrs. N, Mr. O                  |
| Mrs. P, Mr. Q, Mrs. R, Mrs. S, Mr. T  |
| Mrs. U, Mr. V                         |
-----------------------------------------


Is there any better way of structuring the json object? How would I access such an object to fill the autocomplete with the name arrays?

John R. D'Orazio