Event Binding Question in Grid Application

Scriptcase 8 Discussion
#1

I have create a Grid Application with a modal form linked to it for editing purposes.
This code works in onApplicationInit, but not in onScriptInit:

?>
<script src="<?php echo sc_url_library(‘prj’, ‘mylib’, ‘libfile.js’); ?>" /></script>
<script>$(document).ready(function() {myfunction();});</script>
<?

Function defined in project library (mylib / libfile.js):

function myfunction() {
$(‘body’).on(‘click’, ‘.classtobind’, function(e) {
// Do something here
});
}

When the grid refreshes (modal linked form returns on Save), the event bound to the body (and the JS library file) is lost. I am trying to add the library back and rebind to the body. It seems as if only the onScriptInit and onHeader events fire on grid refresh.

Any suggestions on how to accomplish this?

#2

If it works onScriptInit or onHeader, why you do want to force to use onAppInit?

#3

It works only inside onApplicationInit. So the first time the grid generates, all is good, When I edit a grid row (pencil icon, opens a modal form) and then save the form, the grid refreshes. I lose the binding to the body onclick event. So, the grid is no longer doing what I want. If I place the same code in onScriptInit, it doesn’t work even the first time. If I place the code in both, it works the first time (onApplicationInit) but not after a grid refresh (onScriptiInit).

If a a grid refresh generated an onApplicationInit event, my life would be so easy!

#4

OK, well I solved my own problem. Thought I would post the answer in case someone else needed this.

I moved the entire code out of onApplicationInit and onScriptInit and placed it inside onHeader. Works when the grid initializes and works when the grid refreshes after returning from a linked form.

Something else I learned was that injecting javascript in SC events can insert code in the HTML structure that technically violates W3C rules (thanks SO). In my case, I was inserting inside a table, so technically, proper HTML would dictate wrapping the script inside <tr><td></td></tr>. <script> is valid inside <td>, but not <tr>. My code ran without needed to wrap the script, but someone else might find that necessary.

Something that I would like to see in SC is the addition of these events:

beforeHeadClose - just before the closing </head> tag
beforeBodyClose - just before the closing </body> tag

so that we can properly work with css and javascript. If I missed this feature somehow, please save me from myself!