Store a list from a view in template language into a javascript array

[Coulson Thabo Kgathi]

Hi guys

how can i Store a list from a view in template language into a javascript array


this is how i pass the list from the django view

(The List that i am trying to store in javascript is the household_list)

views.py 
------------

def plot_ward_points(request):
    """Plot points of a selected ward.

    Filter points to plot by sending coordinates of a selected ward only to the households.html template.

    **Template:**

    :template:`mochudi_map/templates/household.html`
    """
    households_found = False
    selected_ward = request.POST.get('ward')
    selected_icon = request.POST.get('marker_icon')
    netbooks = Producer.objects.all().order_by('name')
    households = Household.objects.filter(ward=selected_ward)
    household_list = []
   
    for household in households:
        lon = household.lon
        lat = household.lat
        sid = str(household.household_identifier)
       
        household_list.append([lon, lat, sid])
   
    print household_list
   
   
    for household in households:
        lon = household.lon
        lat = household.lat
        sid = str(household.household)
       
    if households:
        households_found = True
    return render_to_response(
        'households.html', {
            'household_list': household_list,
            'netbooks': netbooks,
            'wards': get_wards_list(),
            'households_found': households_found,
            'selected_ward': selected_ward,
            'selected_icon': selected_icon,
            'icons': ICONS
       },
            context_instance=RequestContext(request)
    )


this is how i was trying to store the list in the template


in the template
----------------------


<script>
var house_list = {{household_list}};


for (var i=0;i<house_list.length;i++){
            var house=house_list[i];
           
            for (var j=0;j<house.length;j++){
             
                  var point = new google.maps.LatLng(house[0], house[1]);
                  var marker = new google.maps.Marker({
                         position: point,
                         title: "click for household information",
                         map: map,
                     });
       
       
                var sid = "house[2]";
       
               //call blindInfoWindow function to create an information window for each marker
               bindInfoWindow(marker, map, infoWindow, "Household identifier: \n" +sid);
           
            }
     
               
     }
</script>


this does not seem to be working though