-2

I have an image 

<input type="image" onclick="javascript:form1.ACTION.value='Edit';
                             form1.cin.value='100104213';
                             form1.histSeq.value='85258';                          
                             form1.typeCd.value='BL';
                             form1.RMC_CONFLICT_STATUS.value='';                                 
                             form1.submit(); 
                             return false" 
 alt="Click to edit this record." 
 title="Edit Row" 
 src="/images/editImage.gif" name="editButton">

If you look closely I have some statements which is executed onClick of the image.

Now during the onload I want to associate an event(can be onlick) which should be called before the statements.

I tried with 

$('#grid0').find('#'+(i+1)).find('input:image').on('click',function(){
                                        console.log('Test');    
                                            });

But this is called after the statements.

Cœur
  • 37,241
  • 25
  • 195
  • 267
Sashi Kant
  • 13,277
  • 9
  • 44
  • 71
  • possible duplicate of [jQuery event handlers always execute in order they were bound - any way around this?](http://stackoverflow.com/questions/2360655/jquery-event-handlers-always-execute-in-order-they-were-bound-any-way-around-t) – Adriano Repetti Oct 29 '14 at 11:25
  • 2
    Why can't you `...on('click',function(){console.log('Test'); form1.ACTION.value='Edit'...});` – artm Oct 29 '14 at 11:25
  • Note that you don't need to say `javascript:` in an inline event handler. – nnnnnn Oct 29 '14 at 11:26
  • Probably because the onclick handler on the img-tag is registered earlier than the one added via the script. Maybe add a dirty setTimeout on the img-tag's onclick? Or as @artm suggested, try to combine the handler. – Zaggo0 Oct 29 '14 at 11:27
  • @artm: The reason is, there are multiple images present in one page, and there are around 100 pages where I need to change then. That will be the last option, which I have thought of – Sashi Kant Oct 29 '14 at 11:30
  • 1
    @artm I _guess_ because he wants to _inject_ debugging logs when required, without changing page code but yes...pretty bad habit to put so much code directly in onclick attribute – Adriano Repetti Oct 29 '14 at 11:30
  • @AdrianoRepetti: Yes you got that, They are legacy codes, written years back. – Sashi Kant Oct 29 '14 at 11:34
  • 1
    @SashiKant just follow links in my first comment (if you're using jQuery). Otherwise you may simply replace all existing onclick attributes with a new one where you first log and then execute existing code (previously moved to data-old-onclick). – Adriano Repetti Oct 29 '14 at 11:36
  • Do yourself a huge favor and do not use attribute-based event handlers with jQuery. Just use jQuery event registration. :) – iCollect.it Ltd Oct 29 '14 at 11:36
  • @AdrianoRepetti: Thanks for that, let me try that – Sashi Kant Oct 29 '14 at 11:38

1 Answers1

2

You could get the old onclick value, change the onclick handler, execute your code and eval the the stored old code, somehow like this:

var b = $("#text");
oldOnClick = b.attr("onclick");

var c = document.getElementById("text");
c.onclick = function(){
    alert("Newly Attached");
    eval(oldOnClick); 
};

See http://jsfiddle.net/8bpo4Lk9/

k-nut
  • 3,447
  • 2
  • 18
  • 28