views:

467

answers:

2

When I include an 'onClick' attribute in setInnerXTHML() like this:

var innerHtml = '<span>Build Track: Select a city where track building should begin'+
                '<div id="action-end">'+
                '<form>'+
                '<input type="button" value="End Track Building" id="next-phase" onClick="moveTrainAuto();" />'+
                '</form>'+
                '</div></span>';
actionPrompt.setInnerXHTML(innerHtml);
var btn = document.getElementById('next-phase');
btn.addEventListener('click', 'moveTrainAuto');

The 'onClick' gets dropped. I know this from inspecting the element with Firebug. This is what it reveals:

<input id="app148184604666_next-phase" type="button" value="End Track Building"/>

Here is the function called for onClick:

function moveTrainAuto(evt) {
debugger;
  ajax = new Ajax();
  ajax.responseType = Ajax.JSON;
  ajax.ondone = function(data) {
debugger;
    if(data.code == 'UNLOAD_CARGO') {
      unloadCargo();
    } else if (data.code == 'MOVE_TRAIN_AUTO') {
      moveTrainAuto();
    } else if (data.code == 'TURN_END') {
      turnEnd();
    } else {
      /* handle error */
    }
  }
  ajax.post(baseURL + '/turn/move-trains-auto');
}

As you can see, I've tried both 'onClick' and 'addEventListener'. Neither works. Any ideas?

A: 

Instead of passing in the function name, try passing in the function.

btn.onClick = moveTrainAuto;

not

btn.onClick = 'moveTrainAuto';
Mike Samuel
A: 

Have tou found a solution for this Problem in the meantime?

Can you please let us know ;)

Thank's a lot!

Mike