Two button submit breaks other events on page (mootools)
I am wanting to use two button form and created the following which works. It however breaks any other events on the page but I can't figure out why. Is there a better way?
window.addEvent('domready', function() {
$('vote1').addEvent('click',function() {
new Element('input', {
'type': 'hidden',
'name': 'winner',
'id': 'vote1id',
'value': 'vote1'
}).inject($('voterform'));
$('vote_wrapper').setStyle('display','none');
});
$('vote2').addEvent('click',function() {
new Element('input', {
'type': 'hidden',
开发者_StackOverflow中文版 'name': 'winner',
'id': 'vote2id',
'value': 'vote2'
}).inject($('voterform'));
$('vote_wrapper').setStyle('display','none');
});
$('voterform').addEvent('submit', function(e) {
e.stop();
var log = $('v_wrapper').empty().addClass('loader');
this.set('send', {onComplete: function(response) {
log.removeClass('loader');
$('v_wrapper').set('html', response).set("tween", {duration: 2500}).setOpacity(0).fade(1);
}});
this.send();
});
});
In the code above if $('vote1') or $('vote2') are links or form buttons you will want to modify your code as follows to prevent the default action from occurring:
$('vote1').addEvent('click',function(e) {
e.stop();
new Element('input', {
'type': 'hidden',
'name': 'winner',
'id': 'vote1id',
'value': 'vote1'
}).inject($('voterform'));
$('vote_wrapper').setStyle('display','none');
});
$('vote2').addEvent('click',function(e) {
e.stop();
new Element('input', {
'type': 'hidden',
'name': 'winner',
'id': 'vote2id',
'value': 'vote2'
}).inject($('voterform'));
$('vote_wrapper').setStyle('display','none');
});
精彩评论