Hey kids, here's a neat solution, which you can use nearly everywhere. This is a JS/jQuery version, but it wouldn't be hard to port it to a plain JS or any other library:
if ($.browser.msie) { var buttons = $('form button[name]');
$('#buttonSurrogateFor_' + $(this).attr('name')).removeAttr('disabled');//Enable the surrogate that corresponds to this button
$(this).closest('form').find('button').removeAttr('name');//Prevent all buttons submitting values.
}); }) }
The script should be run onDOMReady, and finds all buttons with a name attribute within a form. It creates a surrogate hidden input for each, and extracts the actual value from the IE only OuterHTML property (not the value reported by IE - this returns the innerHtml of the button).
When the button is clicked, the surrogate is enabled (simulating sending only the value of the clicked button), and all the buttons in the form have their names removed, so they aren't submitted at all.
From my quick testing, this produces exactly the same GET/POST content you'd expect from a browser that gets it right.
It does assume that your form is going to request a new page from the server - where removing the button names doesn't cause a problem. If you're using AJAX, you could rename the name attributes to 'nameTemp', and change them back when you're done.
Comment
Hey kids, here's a neat solution, which you can use nearly everywhere. This is a JS/jQuery version, but it wouldn't be hard to port it to a plain JS or any other library:
if ($.browser.msie) {
var buttons = $('form button[name]');
buttons.each(function(){
$(this)
.after('<input type="hidden" id="buttonSurrogateFor_' + $(this).attr('name') + '" name="' + $(this).attr('name') + '" value="' + this.outerHTML.match(/value="([^"]*)"/i)[1] + '" disabled="disabled"/>')
.click(function() {
$('#buttonSurrogateFor_' + $(this).attr('name')).removeAttr('disabled');//Enable the surrogate that corresponds to this button
$(this).closest('form').find('button').removeAttr('name');//Prevent all buttons submitting values.
});
})
}
The script should be run onDOMReady, and finds all buttons with a name attribute within a form. It creates a surrogate hidden input for each, and extracts the actual value from the IE only OuterHTML property (not the value reported by IE - this returns the innerHtml of the button).
When the button is clicked, the surrogate is enabled (simulating sending only the value of the clicked button), and all the buttons in the form have their names removed, so they aren't submitted at all.
From my quick testing, this produces exactly the same GET/POST content you'd expect from a browser that gets it right.
It does assume that your form is going to request a new page from the server - where removing the button names doesn't cause a problem. If you're using AJAX, you could rename the name attributes to 'nameTemp', and change them back when you're done.