0

I'm having a slight issue with jquery on IE.

My Internet Explorer version is 11 and the page has been built using a Bootstrap template that should be compatible with all browsers. It works perfectly fine on Firefox, Safari and Chrome. In the head section I have a

<meta http-equiv="X-UA-Compatible" content="IE=edge">

and also

<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

On my IE console it states that with
<input value="Send" class="btn btn-primary" onclick="sendCall()">
'sendCall' is not defined.

I have been looking for the same problem around to find a solution with $.Post in jquery but what i got mostly is that the problem has nothing to do with that, as it works fine but maybe on how it should be stated for IE. Could someone help me writing it correctly?

Here is my html:

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">¿Cuándo te llamamos?</h4>
      </div>
      <div class="modal-body">
        <form id="callForm" name="sentMessage">
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="Name *" id="name" name="name" required data-validation-required-message="Please enter name" autocomplete="on">
                        </div>
                        <div class="form-group">
                            <input type="tel" class="form-control" placeholder="Phone *" id="phone" name="phone" required data-validation-required-message="Please enter phone number" autocomplete="on">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="dd/mm/yyyy *" id="date" name="date" required data-validation-required-message="please entter a date" autocomplete="on">
                        </div>
                        <div class="input-group bootstrap-timepicker timepicker">
                            <input id="timepicker1" name="timepicker1" type="text" class="form-control input-small" data-minute-step="30" data-default-Time="current" data-show-Meridian="false">
                            <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
                        </div>
                        <br>
                        <br>
                    </div>
                    <div class="clearfix"></div>
                    <div class="col-lg-12 text-center">
                        <div id="success"></div>
                        <input value="Send" class="btn btn-primary" onclick="sendCall()">
                    </div>
                </div>
            </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

<script> function sendCall()
{
    //the following url is where the form is sent to
    var petition = $.post( "http://www.myweb.com/Call.php", $( "#callForm" ).serialize() )
    .done(function( data ) {
        $('#success').html(data);
      })
    .fail(function() {
        alert( "error, action failed..." );
      });
}
</script>
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339

0 Answers0