Question

I am having an issue with jQuery and all browsers. What is happening is that I click somewhere and the options are refreshing.

To create the select drop down I am using the following code.

function yearselect(){
            setTimeout(function() {
                        var minOffset = 0, maxOffset = 5;
                        var yearSelector = $('select[name=year]');
                        var thisYear = new Date().getFullYear();
                        //var select = $('<select name="year" id="yyyy" class="formbox dobselect">');

                        for (var i = minOffset; i <= maxOffset; i++) {
                            var year = thisYear + i;
                            $('<option></option>')
                            .attr('label', year)
                            .attr('value', year)
                            .html(year)
                            .appendTo(yearSelector);
                        }


                    },900); 
}

If someone would be able to tell me what I am doing wrong that would be great.

The form is being created by jQuery:

function newbusinesslead(){

$("#menuarea").html('<div id="backmain" class="backbg">Back</div><div id="nav" class="backbgright">New Business Lead</div>'+
                    '<form id="newbusinesslead">'+
                    '<div id="leftform" class="line-height"></div><div id="rightform"></div>'+
                    '</form>');

$("#leftform").html('Trading Name: <input name="tradingname" id="tradingname" class="formbox"/><br/>'+
                    'Web URL: <input name="website" id="website" class="formbox"/><br/>'+
                    'Address: <input name="address" id="address" class="formbox"/><br/>'+
                    'Send Email: <select name="sendemail" id="sendemail" class="formbox stateselect"><option value="1">Yes</option><option value="0">No</option></select><br/>'+
                    'Which Email: <select name="whichemail" id="whichemail" class="formbox emailselect"></select><br/>'+
                    'Call Back: <select name="callback" id="callback" class="formbox stateselect"><option value="1">Yes</option><option value="0">No</option></select><br/>');

$("#rightform").html('Phone No: <input name="phonenumber" id="phonenumber" class="formbox"/><br/>'+
                    'Email: <input name="email" id="email" class="formbox"/><br/>'+
                    'State: <select name="state" id="state" class="formbox stateselect"></select><br/>'+
                    'Postcode: <input name="postcode" id="postcode" class="formbox"/><br/>'+
                    'Call Back Date: <select name="day" class="formbox dobselect"></select><select name="month" class="formbox dobselect"></select><select name="year" id="yyyy" class="formbox dobselect"></select><br/>'+
                    'Call Back Time: <select name="hh" class="formbox timeselect"></select>:<select name="mm" class="formbox timeselect"></select><select name="ampm" class="formbox timeselect"><option value="am">am</option><option value="am">pm</option></select><br/>');


$("#newbusinesslead").append('<button id="savenewbusinesslead" class="blackbutton menuwidth">Save</button>'+
                              '<button id="continuenewbusinesslead" class="blackbutton continuewidth right">Continue</button>');

yearselect();
dayselect();
monthselect();
stateselect();
timeselect("hh");
timeselect("mm");
sendwhichemail(1);

}

Answer 1

I found the error – OOPS i had the form the same ID class as a click event. So it looked like the select was refreshing but the whole form was… OOPS

TIP: Check that you have no click functions or same ID