I'm pretty new in our develepors team.
I need some strong arguments and/or "pitfall" examples, so my boss will finally understand the advantages of Unobtrusive JavaScript, so that he, and the rest of the team, stops doing things like this:
<input type="button" class="bow-chicka-wow-wow"
onclick="send_some_ajax(); return false;" value="click me..." />
and
<script type="text/javascript">
function send_some_ajax()
{
// bunch of code ... BUT using jQuery !!!
}
</script>
I suggested using a pretty common pattern:
<button id="ajaxer" type="button">click me...</button>
and
<script type="text/javascript">
// since #ajaxer is also delivered via ajax, I bind events to document
// -> not the best practice but it's not the point....
$(document).on('click', '#ajaxer', function(ev) {
var $elem = $(this);
ev.preventDefault();
});
The reason why my boss (and others) do not want to use this approach is that the Event-Inspection in FireBug (or Chrome Dev Tools) isn't simple anymore, e.g. with
<input type="text" name="somename" id="someid" onchange="performChange()">
he can immediately see what function executes on change-event and jump right to it in a huge JS file full of spaghetti-code.
In the case of Unobtrusive JavaScript the only thing he would see is:
<input type="text" name="somename" id="someid" />
and he has no idea whether some events, if any, were bound to this element and which function will be triggered.
I was looking for a solution and found it:
$(document).data('events') // or .. $(document).data('events').click
but, this "approach" caused it to take "too long ..." to find out which function fires on which event, so I was told to stop bind events like that.
I'm asking you for some examples or strong advantages or any other kind of suggestions for "Why we should use UJS"
UPDATE: suggestion to "change the job" is not an ideal solution.
UPDATE 2: Ok, I've not only suggested to use jQuery event-binding, I did so. After I wrote all Event-Delegation, the Boss came to me and asked me, why am I doing event delegation with different approach and approach he dind't know
I mentioned some obvious benefits, like - There are 15 input-fields and all of then have an onchange event (not only, some of them have also onkeyup) So it's more pragmatic to write this kind of event-delegation ones for ALL input-fields, instead of doing it 15 times, especially if all of the HTML will be rendered with PHP's echo -> echo '... <input type="text" id="someid" ... />...'
js-this-class-do-somethingclass, so, you can easily CTRL+F for it in the code.