I am trying to replace the JavaScript onclick event handler in ASP.NET that is added to a button control when using validation controls. This is what is output into the HTML from ASP.NET in this scenario:
<input type="image" name="ibSubmit1" id="ibSubmit1" src="button-green-submit.gif" onclick="showProgress1();WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ibSubmit1", "", true, "Group1", "", false, false))" style="border-width:0px;" />
I have looked pretty estensively, and unfortunately there doesn't seem to be a way to modify the function server side before it is injected into the page.
Since I am developing a control and desire it to be non-invasive and self contained, and I am interested in obtaining the validationGroup parameter of the WebForm_PostBackOptions object, it seems that the easiest solution would be to use JavaScript to replace the WebForm_DoPostBackWithOptions function name with my custom wrapper function and leave all of the rest of the parameter information intact - then I can extract the information I am interested in, call my custom functions, and then forward the call on to WebForm_DoPostBackWithOptions.
NOTE: I am using jQuery to build my custom function, so if there is an easier way to do this with jQuery it is an option I will consider.
Here is the code I tried to replace the onclick event handler (not working):
$('[onclick*=WebForm_DoPostBackWithOptions]').each(function() {
var txt = this.onclick;
txt = txt + '';
txt = txt.replace('WebForm_DoPostBackWithOptions','ml_DoPostBackWithOptions');
this.onclick = eval(txt);
});
Using alert(), I verified that the text is being changed correctly, however whether or not I use the eval() function, the onclick handler doesn't seem to recognize it as JavaScript.
I thought of using a regular expression to get the validationGroup value, but this seems like it will be far more elegant and flexible if I can get it working...
Note: If there is a way for my control to interrogate the page it is on to find all of the buttons that will post back (regardless of what type of buttons they are) so I can retrieve the property server-side, this is also something I will consider.
The attribute value is wrapped in a function when the HTML is parsed, so it would be tricky to get the original string back. You can get the string representation of the function, but then you would have to parse out the code inside the function.
Why not just redefine the function that is called? Put this at the end of the page:
<script type="text/javascript">
(function(){
// keep the original
var previous = WebForm_DoPostBackWithOptions;
WebForm_DoPostBackWithOptions = function(options) {
// do what you want with the options here
// then call the original
previous(options);
}
})();
</script>