SYLVIA LOBO
BUSINESS ENABLER
My trysts with Jquery Spinner
Challenge after many weeks!!
When I added the spinner from ace-spinner template, the spinner worked beautifully except it bombed during the client demo.
Here is what happened -
1. On load the textbox is created, document.ready calls fuelx spinner on page load -
https://github.com/ExactTarget/fuelux.
Jquery for the same as below -
function initforcastTemplatePage() {
initSpinners();
bindAllSpinnerEvents();
initForCastReportForm();
enableNomineeAutoComplete();
}
bindAllSpinnerEvents calls the + and - signs to add and remove rows respectively on the next element as below -
function bindAllSpinnerEvents() {
$('*[id*=forecast-number-]').each(function () {
var PlusSign = $(this).next().children();
var MinusSign = $(this).prev().children();
//enable save button on form only if forecasted no > 0 or any rows found
$(MinusSign).click(function (e) { //remove row
var cntrl = $(MinusSign);
var courseId = $(cntrl).parents("#CourseGroup").find("#CourseId").val();
var txtboxVal = $(cntrl).parents("#CourseGroup").find('*[id*=forecast-number-]').val();
var oldtxtboxVal = parseInt(txtboxVal)+1;
$(this).parents("#CourseGroup").find('#nomineeRow-' + courseId + '-' + oldtxtboxVal).remove();
enableNomineeAutoComplete();
});
$(PlusSign).click(function (e) { //add row
var cntrl = $(PlusSign);
var Parent = $(cntrl).parents("#CourseGroup");
var courseId = Parent.find("#CourseId").val();
var txtboxVal = Parent.find('*[id*=forecast-number-]').val();
$.ajax({
async: true,
url: 'forcast/CreateNomineeRow',
data: { courseId: courseId, foreCastedNo: txtboxVal },
success: function (response) {
Parent.find("#nominee-table-" + courseId + " > tbody").append(response);
enableNomineeAutoComplete();
},
cache: false,
error: function (response) {
//show error
//unique name check
}
});
});
});
}
But alas it does not stop the mouse wheel on scroll when the spinner textbox is clicked. That set me thinking and after 45 minutes of R&D found a small fix -
document.getElementById(élementid').onwheel = function () { return false; }
TADA!!! Problem solved!!! Hope it helps some one!!