Built a custom module to query a database for locations nearby a user-inputted address. Think "store locator" functionality (e.g. http://www.bestbuy.com/site/olspage.jsp?id=cat12090&type=page). I have the module pulling the data out of the DB and into an array that's accessible via JS using:
drupal_add_js(array('retailers' => $retailers), "setting");.
I've also written a function that will access this JS array and pin the markers to the map. The only problem I'm having, is triggering this JS function after the Drupal.settings.retailers value is populated.

Site works like this:
User inputs address, hits submit -> address geocoded and nearest stores pulled into array -> JS function is called to use array of stores to pin markers to the map.

I have confirmed that the Drupal.settings.retailers variable is being updated every time I submit a new address, I just don't know how to call the function to manipulate this data. Any suggestions? Willing to post abbreviated code, if that helps.

Comments

Anonymous’s picture

Think I must be missing something cos it seems you'd just have to call the function to make this work, could you post your code and explain what' not working?

Anonymous’s picture

Sure thing - Module code:

function sbm_locator($form, &$form_state) {

    $form = array();
    $form['address'] = array(
        '#type' => 'textfield',
        '#title' => t('Address'),
    );
    $form['distance'] = array(
        '#title' => t("Select a Distance"),
        '#type' => 'select',
        '#options' => array(
            '10' => '10 Miles',
            '50' => '50 Miles',
            '100' => '100 Miles',
        ),
    );
    $form['submit'] = array(
        '#type' => 'button',
        '#value' => 'Locate',
        '#ajax' => array(
            'callback' => 'sbm_callback',
            'wrapper' => 'map_canvas',
            'effect' => 'fade',
        ),
    );
    $form['changeout'] = array(
        '#type' => 'textfield',
        '#title' => t(''),
        '#value' => "",
        '#prefix' => '<div id="map_canvas" style="width: 50%; height: 300px; float: left">',
        '#suffix' => '</div><div id="sidebar_results" style="width: 50%; float: left;margin-top: -13px;"><ul></ul></div>',
    );
     if (!empty($form_state['values']['address'])) {
        $coords = sbm_geocode($form_state['values']['address']);
        if (empty($coords))
            $retailers = "No results found";
        else {
            $retailers = sbm_find_markers($coords[1], $coords[0], $form_state['values']['distance']);
        }
        drupal_add_js(array('retailers' => $retailers), "setting");
    }
    return $form;
}
function sbm_callback($form, $form_state) {
     return $form['changeout'];
}

JS code - abbreviated:

function addMarkers(){
    var latlng = new google.maps.LatLng(34.397, -75.644);
    var myOptions = {
        zoom: 2,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'),
        myOptions);
    var retailers = Drupal.settings.retailers.split('|');
    //console.log(retailers);
    bounds = new google.maps.LatLngBounds();
    
    for(var i = 0; i < retailers.length-1; i++) {
        if(retailers.length==0) {
            alert('No results found');
            break;
        }
        ...
        createMarker(map, lat, lng, name, ...);

    }  
    
    google.maps.event.addListener(map, 'click');

}
function createMarker(map, lat, lng, name, dist, number, address, alt) {
    var myLatLng = new google.maps.LatLng(lat, lng);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title: name,
        clickable: true,
        id: marker+"-"+number
    });
    bounds.extend(myLatLng);
    map.fitBounds(bounds);  
   ...
}
nevets’s picture

If you implement the js code that uses retailers as a Drupal behavior if I understand correctly things will work as you want. See Managing JavaScript in Drupal 7. You need to use '#attached' in the render array returned by the php callback to add 'retailers' instead of drupal_add_js() for this to work.

Anonymous’s picture

Sorry for the late reply, took a hiatus. It looks like I can use #attached to return a whole JS file, but I can't use it to just call a function from an already added JS file. Am I missing something? I basically just want to make a javascript function call after the postback is over. I could even wire it up to whatever code makes the throbber disappear when the AJAX postback is over.

jaypan’s picture