Question

I am creating an application for an ipad and i am doing it using Java. JavaScript. HTML and Rest. I have a list of countries that i want to display in a drop list on one of the page in the application am im trying to use rest to populate this list but when i run the application i am getting nothing in the droplist and safari is giving the error

Assertion failed: (anonymous function) :449

i am gettin this error 8 times with different numbers at the end

here is some of the code that i am using

main.html

<div id="wrapper">
<div id="mainBackground">
     <div id="stflogo"><img src="images/logo.png" width="200" height="186" alt="MyLogo logo" /></div>

<div id="formContainer">
        <h1>Register Your Card</h1>
        <form id="AccountDetailsForm" method="post" data-ajax="false">

                <input  id="tfscCardNumber" type="hidden" name="tfscCardNumber" class="readonly" minlength="2" maxlength="20" readonly="readonly" disabled="disabled"/>


                <p><label id="firstNameLabel" for="firstName" class="displayBlockLabel RequiredField">First Name </label>
                <input id="firstName" type="text" name="firstName" class="required" minlength="2" maxlength="20"/></p>
                <p><label id="lastNameLabel" for="lastName" class="displayBlockLabel RequiredField"> Last Name </label>
                <input id="lastName" type="text" name="lastName" class="required" minlength="2" maxlength="25"/></p>        

                <p><label id="address1Label" for="address1" class="displayBlockLabel RequiredField">Address 1 </label>
                <input id="address1" type="text" name="address1" class="required" minlength="2" maxlength="40"/></p>
                <p><label id="address2Label" for="address2" class="displayBlockLabel">Address 2</label>
                <input id="address2" type="text" name="address2" maxlength="40"/></p>

                <p><label id="cityLabel" for="city" class="displayBlockLabel RequiredField">Town / City </label>
                <input id="city" type="text" name="city" class="required" minlength="2" maxlength="40"/></p>

               <p> <label id="countyLabel" for="county" class="displayBlockLabel RequiredField">County / State </label>
                <input id="county" type="text" name="county" class="required" minlength="2" maxlength="40"/>    </p>

               <p> <label id="postcodeLabel" for="postcode" class="displayBlockLabel RequiredField">Postcode / Zip </label>
                <input id="postcode" type="text" name="postcode" class="required" minlength="2" maxlength="11"/>    </p>                

               <p> <label id="countrySelectionLabel" for="countrySelection" class="displayBlockLabel RequiredField">Country </label>
                <select id="countrySelection" class="required">
                </select> </p>

               <p><label id="telephoneLabel" for="telephone" class="displayBlockLabel RequiredField">Tel Number </label>
                <input id="telephone" type="tel" name="telephone" class="tel number required" minlength="2" maxlength="12"/></p>    
                <p><label id="emailLabel" for="email" class="displayBlockLabel RequiredField">Email </label>
                <input id="email" type="email" name="email" class="email required" minlength="2" maxlength="100"/></p>                                      
                <p><label id="confirmEmailLabel" for="confirmEmail" class="displayBlockLabel RequiredField">Confirm Email </label>
                <input id="confirmEmail" type="email" name="confirmEmail" class="email required" minlength="5" maxlength="100"/></p>    

                <p><label id="passportNumberLabel" for="passportNumber" class="displayBlockLabel RequiredField">Passport Number </label>
                <input id="passportNumber" type="text" name="passportNumber" class="required" minlength="3" maxlength="20"/></p>        
                <p class="tandcnotice">Please Ensure that you have read the Terms &amp; Conditions and Privacy &amp; security Policy</p>

                <p class="tandcCheckbox">
                <input type="checkbox" name="accepttandc" id="accepttandc" class="checkbox" />
                <label for="checkbox" class="accepttandc">I have read the Terms &amp; Conditions</label>
                <p>

                <input class="button" type="submit" value="Submit" data-role="button" data-theme="redbutton"/>
        </form>
     </div><!-- END OF FORM CONTAINER -->
     </div>
</div>
....

appForm.js

$('#wrapper').live("pageshow", function() {
if ( $('#countrySelection')[0].length < 1){

    $.mobile.loadingMessage = "Retrieving Countries";
    $.mobile.showPageLoadingMsg();

    Repository.load('details/countries/all', function(countries){
        $.each(countries, function() {
            $('#countrySelection').append('<option value="' + this.id + '">' + this.name + '</option>').selectmenu('refresh');
        });
        $.mobile.hidePageLoadingMsg();
    });
}

});


$('#wrapper').live("pagecreate", function() {               

$('#AccountDetailsForm select, #AccountDetailsForm input[type!=submit]').focus(function (){
    focusScroller(this);                                                                                   
});
$('#AccountDetailsForm select, #AccountDetailsForm input[type!=submit]').blur(function (){
    if ( $('#accountFormScrollView').data().scrolllistview._sy < $('#accountFormScrollView').data().scrolllistview._maxY){
         $('#accountFormScrollView').data().scrolllistview.scrollTo(0, $('#accountFormScrollView').data().scrolllistview._maxY, 0);
    }
}); 

});           


$(window).resize(function (){
// Android Resize Event needed for the keyboard
});

var focusScroller = function(formElement){
    $(window).scrollTop(0);
    var elementLabel = "#" + formElement.id + "Label";   
    var offSetPosition = $(elementLabel)[0].offsetTop;
    if(formElement.labels === undefined && formElement.id === "countrySelection"){
        // ios4 quirk for select elements
        offSetPosition = 100; 
    }

    scrollTo(0,0,0);
    $('#accountFormScrollView').data().scrolllistview.scrollTo(0, offSetPosition * -1, 0);
}


$('#wrapper"').live("pageshow", function() {
if (getTfscCardNumber() === ''){
    $('#passportNumberLabel').css('display', 'none');
    $('#passportNumber').css('display', 'none'); 
    $('#passportNumber').attr("disabled", true);
}else{
    $('#passportNumberLabel').css('display', 'block');
    $('#passportNumber').css('display', 'block'); 
    $('#passportNumber').attr("disabled", false);
}

loadForm($('#AccountDetailsForm')[0]);
});

i can put up more code if needed but im sure the rest of the code is ok but if anyone wants to look at any other pieces of code just ask

what does this error mean and can anyone see what is going wrong?

Answer 1

This is a bug with Safari and its handling of inputs with type=”tel”. I wouldn’t worry about it.

I was having the same problem and then I found this: https://github.com/jquery/jquery-mobile/issues/2341