3

I have a .click event in JavaScript, it seems to be working fine in all major browsers except for safari. Code is creating a dialog box that display's an image when the submit button is clicked.

$(document).ready(new function () {
var SpinnerImage = ('<div id="dialog-message"><img src="loading.gif" /></div > ');
$("#ctl00_mainContent_AppPaymentControl1_applicationPaymentControl_payNow").click(function () {
    //show loading gif
    $('body').append(SpinnerImage);
    $("#dialog-message").dialog(
        {
            title: 'Loading... Please Wait'
        });
    });
});

Any help would be appreciated.  

clickbait
  • 2,818
  • 1
  • 25
  • 61
Syed Vasty
  • 31
  • 2
  • Not sure if it will make a difference, but take the `new` off of your function on the first line. It's not necessary – Taplar Jun 26 '18 at 20:32
  • `new function () {` <-- not sure where you learned that. You may want to bind on mousedown. Might be a timing issue with the form submitting? – epascarello Jun 26 '18 at 20:35
  • This might help https://stackoverflow.com/questions/23497825/jquery-click-does-not-work-in-safari – PecoAnnArbor Jun 26 '18 at 21:19
  • @epascarello its not a timing issue cause it works in all other browsers. – Syed Vasty Jun 26 '18 at 21:44
  • @SyedVasty Why do you want to trigger the button click even on page load? – Win Jun 26 '18 at 23:14
  • @Win i dont, i was trying to see if that would fix the problem. It's working on all of the browsers except for safari. I think it's the .click that not working. – Syed Vasty Jun 27 '18 at 12:53
  • If you `alert()` within the `click()` event does the alert show? Also just a tip, you can use `$('[id$=idOfControl]')` to grab controls on pages with master pages so that you dont have to deal with the id mangling. So in this scenario, assuming `payNow` is your control id, you can just use `$('[id$=payNow]')`. – Josh Mein Jun 28 '18 at 16:14
  • @JoshMein I'll give alert() a try. thanks – Syed Vasty Jun 28 '18 at 17:05

1 Answers1

0

See if this works?

1  $(document).ready(function () {
2     var SpinnerImage = $("<div id='dialog-message'><img src='loading.gif' /></div>");
3     $("#ctl00_mainContent_AppPaymentControl1_applicationPaymentControl_payNow").click(function () {
4        //show loading gif
5        $('body').append(SpinnerImage);
6        $("#dialog-message").dialog(
7           {
8              title: 'Loading... Please Wait'
9           }
10       );
11    });
12 });

Corrections:

  • Remove new on line 1
  • Add $ on line 2
  • Fix faulty single- and double- quotes on line 2

You mentioned in a comment that #ctl00_mainContent_AppPaymentControl1_applicationPaymentControl_payNow is an <input> element. Try using the $(element).focus(callback); method instead of $(element).click(callback);

clickbait
  • 2,818
  • 1
  • 25
  • 61