Jquery change event working in mozzila but not in crome - javascript

The change is not firing on dropdownlist item change in Google Chrome.
The same script is working perfectly in Firefox.
I have used ui.dropdown and I'm trying to bind to the change event.
This is the code from my script Dropdown.js
(function ($, undefined) {
$.widget("ui.Dropdown", {
options: {
defaultLabel: "Select...",
dontDisplay: false
},
_create: function _create() {
var self = this;
var element = self.element;
var options = self.options;
// Element is a select element
element.wrap("<div class='sc-dropdown'></div>");
var parent = options.parent = element.parent();
if (options.dontDisplay) {
parent.addClass("sc-incompleteDropdown");
return;
}
element.addClass("ui-helper-hidden-accessible");
var selectedValue = element.val() || "";
var list = $("<ul class='sc-dropdownOptions'></ul>");
// Generate dropdown using options in select
$("option", element).each(function (i, o) {
o = $(o);
var html = o.text();
var value = o.attr("value");
var label = o.data("label")
var desc = o.data("description");
if (value) {
list.append("<li data-label='" + label + "' data-value='" + value + "' class='sc-dropdownMainOption " + (selectedValue == value ? "sc-selected " : "") + (desc ? "sc-dropdown-hasDescription " : "") + "'>" + html + (desc ? "<div class='sc-dropdown-description'>" + desc + "</div>" : "") + "</li>");
}
});
var label = $(".sc-selected", list).data("label");
if (!label || label == "undefined") {
label = $(".sc-selected", list).html();
}
parent.append("<div class='sc-selectedDetail'>" + (label || options.defaultLabel) + "</div>");
parent.append(list);
parent.append("<div class='sc-graphics'></div>");
var isVisible = parent.css("display") != "none";
parent.css("display", "inline-block");
if (!isVisible) {
parent.hide();
}
$(document).bind("click", { self: self }, self._click);
$(parent).bind("change", { self: self }, self._change);
$(element).bind("focus", { self: self }, self._focus);
$(element).bind("blur", { self: self }, self._blur);
},
refresh: function refresh() {
var self = this;
var element = self.element;
var options = self.options;
if (options.dontDisplay) {
return;
}
var parent = options.parent;
var selectedValue = element.val() || "";
var list = $(".sc-dropdownOptions", parent);
list.empty();
$("option", element).each(function (i, o) {
o = $(o);
var html = o.html();
var value = o.attr("value");
var label = o.text();
list.append("<li data-label='" + label + "' data-value='" + value + "' class='sc-dropdownMainOption " + (selectedValue == value ? "sc-selected'" : "") + "'>" + html + "</li>");
});
$(".sc-selectedDetail", parent).html($(".sc-selected", list).data("label") || $(".sc-selected", list).html() || "");
},
disable: function disable() {
var self = this;
var element = self.element;
var options = self.options;
var parent = options.parent;
parent.addClass("sc-disabled");
element.attr("disabled", "disabled");
$(".sc-dropdownOptions", parent).slideUp();
},
enable: function enable() {
var self = this;
var element = self.element;
var options = self.options;
var parent = options.parent;
parent.removeClass("sc-disabled");
element.removeAttr("disabled");
},
_click: function _click(event) {
var self = event.data.self;
var element = self.element;
var options = self.options;
var parent = options.parent;
if (parent.is(".sc-disabled") || options.dontDisplay) {
return;
}
var target = $(event.target);
var list = $(".sc-dropdownOptions", parent);
if (target.parents(".sc-dropdown")[0] == parent[0]) {
if (target.is(".sc-selectedDetail") || target.parents(".sc-selectedDetail").length
|| target.is(".sc-graphics") || target.parents(".sc-graphics").length) {
if (list.is(":visible")) {
list.slideUp();
} else {
list.slideDown();
}
} else if (target.is("li:not(.sc-selected)") || target.parents("li:not(.sc-selected)").length) {
var item = target.is("li.sc-dropdownMainOption", parent) ? target : target.parents("li.sc-dropdownMainOption", parent);
element.val(item.data("value"));
$(".sc-selected", list).removeClass("sc-selected");
item.addClass("sc-selected");
$(".sc-selectedDetail", parent).html(item.data("label") || item.html());
list.slideUp();
element.change();
} else {
list.slideUp();
}
element.focus();
} else {
list.slideUp();
}
},
_change: function _change(event) {
var self = event.data.self;
var element = self.element;
var options = self.options;
var parent = options.parent;
if (options.dontDisplay) {
return;
}
var target = $(event.target);
var value = target.val();
var list = $(".sc-dropdownOptions", parent);
var item = $("li.sc-dropdownMainOption[data-value='" + value + "']", parent);
$(".sc-selected", list).removeClass("sc-selected");
item.addClass("sc-selected");
var label = item.data("label");
if (!label || label == "undefined") {
label = item.html();
}
$(".sc-selectedDetail", parent).html(label);
},
_focus: function _focus(event) {
var self = event.data.self;
var element = self.element;
var options = self.options;
var parent = options.parent;
parent.addClass("sc-focus");
},
_blur: function _blur(event) {
var self = event.data.self;
var element = self.element;
var options = self.options;
var parent = options.parent;
parent.removeClass("sc-focus");
}
});
}(jQuery));

Related

Boolean for each question with array list

one var with multiples "selected" question relates to "employee".
When open the system will show up all question, whatever I pressed the button will show me an employee and I will select one (ex: Brian for the first question) and will select "positive".
When I click on my second question, Brian is already selected. HERE is my problem.
Should be select only in one question and is making flag for all question.
anything wrong with the boolean?
var resultHandler = function(){
currentQuestion = this;
$('#details-name').text(currentQuestion.question);
$('#projectPopUp').show();
};
var cancel = function() {
//do nothing for now
}
var commenthandler = function() {
var value = $("#" + this.id + "-comment").val();
this.comments = value;
$("#" + this.id + "-comment").val(value);
};
var names = [];
// bt select ppl
var nameList = function (){
for (var i = 0; i < employees.length; i++) {
var name = employees[i];
var id = i;
var data = {
id: 'e' +id,
name: name
};
names.push(data);
$('#detailsgrid tbody').append(Utils.processTemplate("#popupPersonTemplate tbody", data));
$("#" + data.id + "-status").text('Select');
$("#" + data.id + "-status").click(statusHandler.bind(data));
}
};
var statusHandler = function(){
var previousResult = this.inspectionResult;
var answerIndex = answers.indexOf(previousResult);
/** -1 is if the answer is not found if not found defaults to first answer
* else it gets the next answer
*/
console.log('Answer Index: ' + answerIndex);
if (answerIndex == -1) {
console.log('Answer index is -1');
answerIndex = 0;
this.active = 'false';
updateActiveStatus(this);
} else {
answerIndex = (answerIndex + 1) % answers.length;
}
var currentResult = answers[answerIndex];
this.inspectionResult = currentResult;
$("#" + this.id + "-status").text(currentResult);
// commentvisibilitymanager(this);
};
var buildQuestionnaire = function(){
parseInitialDataHolder();
for (var i = 0; i < ARRAY_OF_QUESTIONS.length; i++){
var id = ARRAY_OF_QUESTIONS[i].code;
if (id && typeof id != 'undefined'){
id = id.replace('.', '-');
};
var data = {
id: id,
question: ARRAY_OF_QUESTIONS[i].question,
inspectionResult: "", //defaultResults
employee_results: [],
active: true
};
var initialdata = initialdataholder[id];
if(initialdata) {
data = initialdata;
}
dataholder.push(data);
if (typeof ARRAY_OF_QUESTIONS[i].header == 'undefined') {
$('#questionsTable tbody').append(Utils.processTemplate("#rowTemplate tbody", data));
$("#" + id + "-inspectionResult").text(data.inspectionResult || 'Select');
$("#" + id + "-inspectionResult").click(resultHandler.bind(data));
updateActiveStatus(data);
commentvisibilitymanager(data);
}
else {
$('#questionsTable tbody').append(Utils.processTemplate("#sectionRowTemplate tbody", data));
}
}
}
//to close the popup
var closePopup = function() {
$('#projectPopUp').hide();
};
$(document).ready(function() {
buildQuestionnaire();
nameList();
});

I'm getting this error Uncaught TypeError: this.getElements is not a function

I look into a few answers but I'm not getting any results, I'm trying to fix this issue "Uncaught TypeError: this.getElements is not a function". This part of the code, full code in the link.
var SIDEBAR = new function() {
this.on = function(nameElement){
this.menu = nameElement;
return this;
};
/*more code*/
this.getElements = function() {
/*more code*/
return [];
};
/*more code*/
this.addElements = function() {
var elementsData = this.getElements();
/*more code*/
};
}();
var sid = SIDEBAR.on('test');
sid.load();
Full code: https://jsfiddle.net/e6shbnsu/
The value of this is determined by how a function is called.
this will point to window in setTimeout. Use .bind to have specified values as this context.
The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.
function inElectron() {
return navigator.userAgent.indexOf("Electron") != -1;
}
var dataManager = {
getItem: function(key, local) {
if (inElectron() || local == 1)
return localStorage.getItem(key);
else
return sessionStorage.getItem(key);
},
setItem: function(key, item, local) {
if (inElectron() || local == 1)
localStorage.setItem(key, item);
else
sessionStorage.setItem(key, item);
}
};
var SIDEBAR = new function() {
this.on = function(nameElement) {
this.menu = nameElement;
return this;
};
this.load = function() {
this.currentElement = 0;
this.refreshElements();
};
this.setAddElementName = function(name) {
this.addElementName = name;
};
this.setNewElementName = function(name) {
this.newElementName = name;
};
this.getElements = function() {
var elementsData = dataManager.getItem(this.getDataKey);
if (typeof elementsData !== 'undefined' && elementsData !== null) {
return JSON.parse(elementsData);
}
return this.getPreloadData();
};
this.setDataKey = function(key) {
this.dataKey = key;
};
this.getDataKey = function() {
if (this.dataKey) {
return this.dataKey;
}
return "SideBar" + this.menu;
};
this.setPreloadData = function(dataArray) {
this.preloadData = dataArray;
};
this.getPreloadData = function() {
if (typeof this.preloadData !== 'undefined' && this.preloadData !== null) {
return this.preloadData;
}
return [];
};
this.getCurrentElement = function() {
var elementsData = getElements;
return elementsData[currentElement];
};
this.refreshElements = function() {
window.setTimeout(function() {
this.clearElements();
}.bind(this), 1);
//outer `this` context is bound to the handler
window.setTimeout(function() {
this.addElements();
}.bind(this), 2);
};
this.deleteElement = function() {
var newArr = [];
var elementsData = this.getElements();
for (var i = 0, l = elementsData.length; i < l; i++) {
if (i != index) {
newArr.push(elementsData[i]);
}
}
dataManager.setItem(this.getDataKey, JSON.stringify(newArr));
};
this.addElements = function() {
var elementsData = this.getElements();
var menuNode = document.getElementById(this.menu);
console.log(elementsData);
for (var i = 0; i < elementsData.length; i++) {
var li = document.createElement("li");
var div = document.createElement("div");
li.value = i;
div.classList.add("list");
var p = document.createElement("p");
p.id = "textBlock";
p.style.display = "inline";
p.setAttribute("contentEditable", false);
p.appendChild(document.createTextNode(elementsData[i].name));
div.appendChild(p);
var obj = getObject();
console.log(obj);
div.onclick = function(e) {
e.stopImmediatePropagation();
if (this.querySelector("#textBlock").contentEditable == "false") {
this.currentElement = this.parentNode.value;
elementsData = this.getElements();
document.getElementById("prompt").innerHTML = elementsData[this.parentNode.value]["data"];
document.querySelector("#wrapper").classList.toggle("toggled");
}
};
var span2 = document.createElement("span");
span2.id = "deleteMode";
span2.classList.add("glyphicon");
span2.classList.add("glyphicon-minus");
span2.onclick = function(e) {
e.stopImmediatePropagation();
deleteItem(this.parentNode.parentNode.value);
window.setTimeout(this.refreshElements, 1);
};
span2.style.display = "none";
div.appendChild(span2);
var span = document.createElement("span");
span.id = "editMode";
span.classList.add("glyphicon");
span.classList.add("glyphicon-pencil");
span.onclick = function(e) {
e.stopImmediatePropagation();
// get href of first anchor in element and change location
for (var j = 0; j < menuNode.length; j++) {
menuNode[j].classList.add("disabled");
}
this.style.display = "none";
this.parentNode.querySelector("#deleteMode").style.display = "";
this.parentNode.classList.add("editableMode");
this.parentNode.classList.remove("disabled");
var textBlock = this.parentNode.querySelector("#textBlock");
textBlock.setAttribute("contentEditable", true);
this.placeCaretAtEnd(textBlock);
textBlock.onkeydown = function(e) {
if (e.keyCode == 13) {
e.stopImmediatePropagation();
var text = this.innerHTML.replace(" ", '');
text = text.replace("<br>", '');
if (text.length > 0) {
this.innerHTML = text;
elementsData[this.parentNode.parentNode.value]['name'] = text;
dataManager.setItem("IFTeleprompterScripts", JSON.stringify(elementsData));
for (var j = 0; j < menuNode.length; j++) {
menuNode[j].classList.remove("disabled");
}
this.parentNode.classList.remove("editableMode");
this.setAttribute("contentEditable", false);
this.parentNode.querySelector("#editMode").style.display = "";
this.parentNode.querySelector("#deleteMode").style.display = "none";
} else {
return false;
}
} else if (e.keyCode == 8) {
if (textBlock.innerHTML.length - 1 === 0) {
textBlock.innerHTML = " ";
}
}
return true;
};
return false;
};
div.appendChild(span);
li.appendChild(div);
scriptsNode.appendChild(li);
}
var li = document.createElement("li");
var div = document.createElement("div");
var span2 = document.createElement("span");
span2.id = "addMode";
span2.classList.add("glyphicon");
span2.classList.add("glyphicon-plus");
div.appendChild(span2);
var p = document.createElement("p");
p.id = "textBlock";
p.style.display = "inline";
p.setAttribute("contentEditable", false);
if (typeof this.addElementName !== 'undefined' && this.addElementName !== null)
p.appendChild(document.createTextNode(" " + this.addElementName));
else
p.appendChild(document.createTextNode(" Add " + this.menu));
div.appendChild(p);
li.onclick = function(e) {
e.stopImmediatePropagation();
var newPushElementName = "New " + this.menu;
if (typeof this.addElementName !== 'undefined' && this.addElementName !== null) {
newPushElementName = this.addElementName;
}
elementsData.push({
"name": newPushElementName,
"data": ""
});
dataManager.setItem(this.getDataKey, JSON.stringify(elementsData));
this.refreshElements();
};
li.appendChild(div);
menuNode.appendChild(li);
};
this.placeCaretAtEnd = function(el) {
el.focus();
if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined") {
var range = document.createRange();
range.selectNodeContents(el);
range.collapse(false);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
} else if (typeof document.body.createTextRange != "undefined") {
var textRange = document.body.createTextRange();
textRange.moveToElementText(el);
textRange.collapse(false);
textRange.select();
}
};
}();
var sid = SIDEBAR.on('test');
sid.load();
<ul class="sidebar-nav" id="test">
</ul>

jQuery text() and html() method not working on Chrome

After some calculation I am trying to display the results in a table. I tried using .text() and .html() method but none of them working fine on Chrome (FF is perfectly fine).
1) .html() - Doesn't display anything on Chrome
2) .text() - Returns false string
Here is my JS function.
populateHomeGrid: function(categories, day) {
var eventsForTimer = [];
$.each(categories, function(index, value) {
// categoryId -> {raceNumber : event, ...}
var categoryName = value.name, categoryId = value.categoryId,
mapOfEvents = [], maxNumberOfEvents = 0;
// subcategories
$.each(value.categories, function(index, category) {
var mapOfOneCategory = {}, mapSize = 0;
$.each(category.events, function(index, event) {
var raceNumber = event.raceNumber;
mapOfOneCategory[raceNumber] = event;
mapSize++;
});
if (mapSize > maxNumberOfEvents) maxNumberOfEvents = mapSize;
mapOfEvents.push(mapOfOneCategory);
})
maxNumberOfEvents = maxNumberOfEvents;
// drawing main category
var tableId = "home_grid_" + day + "_" + categoryId,
table = $('<table id="' + tableId + '" cellspacing="0" cellpadding="0" width="100%" class="racing_tables" />')
.appendTo($('#' + day))
var tr = $('<tr class="gray"/>')
.appendTo(table)
.append($('<td valign="middle" width="20%"/>')
.append($('<h2/>').html(categoryName)))
for (var i = 1; i <= maxNumberOfEvents; i ++) {
tr.append($('<td valign="middle" />')
.append($('<p/>').html(i)))
}
// drawing sub categories
$.each(mapOfEvents, function(index, event) {
// Drawing row
var firstRow = true, categoryTr;
for (var i = 1; i <= maxNumberOfEvents; i++) {
if (firstRow) {
categoryTr = $('<tr class="white"/>').appendTo(table)
var categoryHolder = $('<td/>').appendTo(categoryTr),
categoryName = $('<p/>').appendTo(categoryHolder)
firstRow = false;
}
if (typeof event[i] != 'undefined') {
categoryName.html(event[i].categoryName);
var categoryId = event[i].categoryId;
(function(i) {
var a = $('<a/>')
.click(function() {racingNavigation.showLocationAndRaceNumber(categoryId, i)})
.data('event', event[i])
.appendTo($('<td />')
.appendTo(categoryTr))
if (racingNavigation.updateHomeCellInfo(a)) eventsForTimer.push(a);
})(i)
}
else {
categoryTr.append($('<td />'))
}
}
})
});
// Setting the counter to update the closing events
var intervalId = setInterval(function() {
$.each(eventsForTimer, function (index, value) {
if (racingNavigation.updateHomeCellInfo(value) == null) {
window.clearInterval(intervalId);
}
})
}, 5000);
intervalIdsForUpdatingHomeGrid.push(intervalId);
},
Function call to racingNavigation.updateHomeCellInfo
updateHomeCellInfo: function(a) {
var info = '', redClass = false,
event = $(a).data('event');
// Killing the interval
if (typeof event == 'undefined') return null;
var timeUtc = event.timeUtc,
status = event.status,
neededForTimer = false;
if (status == 'expired' || status == 'telephone') info = closed;
else if (date.hourDifference(timeUtc) < 1 && date.minDifference(timeUtc) < 1 && date.secDifference(timeUtc) < 2 && (status == 'live' || status == 'run' )) info = closed;
else if (event.result != null) {
var position = 1;
$.each(event.result.winPlaceResults, function() {
var finishingPosition = this.finishingPosition,
selectionNumber = this.selectionNumber;
if (parseInt(finishingPosition) == position) {
info += selectionNumber.toString();
position++;
}
if (position != 4) info += ', ';
if (position == 4) return false;
})
}
else {
neededForTimer = true;
if (date.hourDifference(timeUtc) > 0) {
info = date.formatTime(new Date(timeUtc));
}
else {
info = date.minDifference(timeUtc);
if (info <= 5) redClass = true;
info = date.minDifference(timeUtc) + ' ' + min;
}
}
if (redClass) $(a).parent().addClass('red')
else $(a).parent().removeClass('red');
$(a).html(info);
return neededForTimer;
},
At the end of my second function I am displaying the result $(a).html(info);
where as info contains different element based on the calculations.Default info is set to CLOSED which is defined in another file as var closed = "CLOSED".
I am expecting the table should display string CLOSED when all the different conditions are invalid. Both .text() and .html() method works fine on FF but not on Chrome as explained in the beginning.

How to remotely simulate a dropdown selection

I have several dropdown select menus where a selection of the first changes the options of the second and a selection on the second changes the options of the third, and so on.
I would like to remotely simulate a change (i.e. without the user clicking in the select menu) in the dropdown menu which will activate the Javascript to set the next dropdown's options.
Just setting the value of the select menu - document.getElementById('...').value='....' - does not stimulate the Javascript events on the dropdowns.
Note: I do not have access to the Javascript controlling the select menus nor do I know which trigger it looks for on the select menus (I am assuming "onselect").
I am using Javascript and the jQuery library. I need the solution to, of course, work cross browser.
Here is the whole js code (seems to be in prototype) that sets the listeners for the dropdowns:
/**************************** CONFIGURABLE PRODUCT **************************/
Product.Config = Class.create();
Product.Config.prototype = {
initialize: function(config){
this.config = config;
this.taxConfig = this.config.taxConfig;
this.settings = $$('.super-attribute-select');
this.state = new Hash();
this.priceTemplate = new Template(this.config.template);
this.prices = config.prices;
this.settings.each(function(element){
Event.observe(element, 'change', this.configure.bind(this))
}.bind(this));
// fill state
this.settings.each(function(element){
var attributeId = element.id.replace(/[a-z]*/, '');
if(attributeId && this.config.attributes[attributeId]) {
element.config = this.config.attributes[attributeId];
element.attributeId = attributeId;
this.state[attributeId] = false;
}
}.bind(this))
// Init settings dropdown
var childSettings = [];
for(var i=this.settings.length-1;i>=0;i--){
var prevSetting = this.settings[i-1] ? this.settings[i-1] : false;
var nextSetting = this.settings[i+1] ? this.settings[i+1] : false;
if(i==0){
this.fillSelect(this.settings[i])
}
else {
this.settings[i].disabled=true;
}
$(this.settings[i]).childSettings = childSettings.clone();
$(this.settings[i]).prevSetting = prevSetting;
$(this.settings[i]).nextSetting = nextSetting;
childSettings.push(this.settings[i]);
}
// Set default values - from config and overwrite them by url values
if (config.defaultValues) {
this.values = config.defaultValues;
}
var separatorIndex = window.location.href.indexOf('#');
if (separatorIndex != -1) {
var paramsStr = window.location.href.substr(separatorIndex+1);
var urlValues = paramsStr.toQueryParams();
if (!this.values) {
this.values = {};
}
for (var i in urlValues) {
this.values[i] = urlValues[i];
}
}
this.configureForValues();
document.observe("dom:loaded", this.configureForValues.bind(this));
},
configureForValues: function () {
if (this.values) {
this.settings.each(function(element){
var attributeId = element.attributeId;
element.value = (typeof(this.values[attributeId]) == 'undefined')? '' : this.values[attributeId];
this.configureElement(element);
}.bind(this));
}
},
configure: function(event){
var element = Event.element(event);
this.configureElement(element);
},
configureElement : function(element) {
this.reloadOptionLabels(element);
if(element.value){
this.state[element.config.id] = element.value;
if(element.nextSetting){
element.nextSetting.disabled = false;
this.fillSelect(element.nextSetting);
this.resetChildren(element.nextSetting);
}
}
else {
this.resetChildren(element);
}
this.reloadPrice();
// Calculator.updatePrice();
},
reloadOptionLabels: function(element){
var selectedPrice;
if(element.options[element.selectedIndex].config){
selectedPrice = parseFloat(element.options[element.selectedIndex].config.price)
}
else{
selectedPrice = 0;
}
for(var i=0;i<element.options.length;i++){
if(element.options[i].config){
element.options[i].text = this.getOptionLabel(element.options[i].config, element.options[i].config.price-selectedPrice);
}
}
},
resetChildren : function(element){
if(element.childSettings) {
for(var i=0;i<element.childSettings.length;i++){
element.childSettings[i].selectedIndex = 0;
element.childSettings[i].disabled = true;
if(element.config){
this.state[element.config.id] = false;
}
}
}
},
fillSelect: function(element){
var attributeId = element.id.replace(/[a-z]*/, '');
var options = this.getAttributeOptions(attributeId);
this.clearSelect(element);
element.options[0] = new Option(this.config.chooseText, '');
var prevConfig = false;
if(element.prevSetting){
prevConfig = element.prevSetting.options[element.prevSetting.selectedIndex];
}
if(options) {
var index = 1;
for(var i=0;i<options.length;i++){
var allowedProducts = [];
if(prevConfig) {
for(var j=0;j<options[i].products.length;j++){
if(prevConfig.config.allowedProducts
&& prevConfig.config.allowedProducts.indexOf(options[i].products[j])>-1){
allowedProducts.push(options[i].products[j]);
}
}
} else {
allowedProducts = options[i].products.clone();
}
if(allowedProducts.size()>0){
options[i].allowedProducts = allowedProducts;
element.options[index] = new Option(this.getOptionLabel(options[i], options[i].price), options[i].id);
element.options[index].config = options[i];
index++;
}
}
}
},
getOptionLabel: function(option, price){
var price = parseFloat(price);
if (this.taxConfig.includeTax) {
var tax = price / (100 + this.taxConfig.defaultTax) * this.taxConfig.defaultTax;
var excl = price - tax;
var incl = excl*(1+(this.taxConfig.currentTax/100));
} else {
var tax = price * (this.taxConfig.currentTax / 100);
var excl = price;
var incl = excl + tax;
}
if (this.taxConfig.showIncludeTax || this.taxConfig.showBothPrices) {
price = incl;
} else {
price = excl;
}
var str = option.label;
if(price){
if (this.taxConfig.showBothPrices) {
str+= ' ' + this.formatPrice(excl, true) + ' (' + this.formatPrice(price, true) + ' ' + this.taxConfig.inclTaxTitle + ')';
} else {
str+= ' ' + this.formatPrice(price, true);
}
}
return str;
},
formatPrice: function(price, showSign){
var str = '';
price = parseFloat(price);
if(showSign){
if(price<0){
str+= '-';
price = -price;
}
else{
str+= '+';
}
}
var roundedPrice = (Math.round(price*100)/100).toString();
if (this.prices && this.prices[roundedPrice]) {
str+= this.prices[roundedPrice];
}
else {
str+= this.priceTemplate.evaluate({price:price.toFixed(2)});
}
return str;
},
clearSelect: function(element){
for(var i=element.options.length-1;i>=0;i--){
element.remove(i);
}
},
getAttributeOptions: function(attributeId){
if(this.config.attributes[attributeId]){
return this.config.attributes[attributeId].options;
}
},
reloadPrice: function(){
var price = 0;
var oldPrice = 0;
for(var i=this.settings.length-1;i>=0;i--){
var selected = this.settings[i].options[this.settings[i].selectedIndex];
if(selected.config){
price += parseFloat(selected.config.price);
oldPrice += parseFloat(selected.config.oldPrice);
}
}
optionsPrice.changePrice('config', {'price': price, 'oldPrice': oldPrice});
optionsPrice.reload();
return price;
if($('product-price-'+this.config.productId)){
$('product-price-'+this.config.productId).innerHTML = price;
}
this.reloadOldPrice();
},
reloadOldPrice: function(){
if ($('old-price-'+this.config.productId)) {
var price = parseFloat(this.config.oldPrice);
for(var i=this.settings.length-1;i>=0;i--){
var selected = this.settings[i].options[this.settings[i].selectedIndex];
if(selected.config){
var parsedOldPrice = parseFloat(selected.config.oldPrice);
price += isNaN(parsedOldPrice) ? 0 : parsedOldPrice;
}
}
if (price < 0)
price = 0;
price = this.formatPrice(price);
if($('old-price-'+this.config.productId)){
$('old-price-'+this.config.productId).innerHTML = price;
}
}
}
}
all the select menus have the class "super-attribute-select"
For this
<select name="blah">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
You would
$('select[name="blah"]').val(3).trigger('change');
Don't know if you're looking for .trigger('select'); or trigger('onselect'); but I've never used those.
Demo
Somethinkg like this may work:
$('select option[value=yourValue]').click();
Or:
$('select').find('option[value=yourValue]').attr('selected', 'selected').end().trigger('onselect');

SetSelectedRange Spread.NET javascript issue

I'm trying to add functionality to Spread.NET control where it will permit a hold shift-click to select a range of cells in ASP.
I'm creating the event onActiveCellChanged to call the selectRange function on execution
var shiftPressed = false;
var newSelect = true;
window.pageLoad = function init() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
if (ss.addEventListener != null) {
ss.addEventListener("ActiveCellChanged", selectRange(), false);
} else if (ss.attachEvent != null) {
ss.attachEvent("ActiveCellChanged", selectRange());
}
else {
FpSpread1.onActiveCellChanged = selectRange;
}
}
Here is the selectRange function.
function selectRange() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
var swap;
if (shiftPressed == true) {
var initRow = document.getElementById('RowCoord').value;
var initCol = document.getElementById('ColCoord').value;
var SecRow = getRow();
var SecCol = getCol();
newSelect = false;
var rCount = Math.abs(SecRow - initRow) + 1;
var cCount = Math.abs(SecCol - initCol) + 1;
if (initRow > SecRow)
initRow = SecRow;
if (initCol > SecCol)
initCol = SecCol;
//alert(initRow + ' ' + initCol);
alert(initRow + ' ' + initCol + ' ' + rCount + ' ' + cCount);
ss.SetSelectedRange(initRow, initCol, rCount, cCount);
}
else {
document.getElementById('RowCoord').value = 0;
document.getElementById('ColCoord').value = 0;
newSelect = true;
}
}
And this is how I'm determining whether shift is being held.
function aKeyDown(event) {
if (event.keyCode == 16) {
shiftPressed = true;
var col = getCol();
var row = getRow();
if (newSelect) {
document.getElementById('RowCoord').value = row;
document.getElementById('ColCoord').value = col;
}
}
}
function aKeyUp(event) {
if (event.keyCode == 16) {
shiftPressed = false;
}
}
function getRow() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
ret = ss.ActiveRow;
if (ret == undefined)
ret = ss.GetActiveRow;
return ret;
}
function getCol() {
var ss = document.getElementById('<%=FpSpread1.ClientID %>');
ret = ss.ActiveCol;
if (ret == undefined)
ret = ss.GetActiveCol;
return ret;
}
The SetSelectedRange in the select range function will work if my initial cell is a,1. However, if it's any other cell, it'll select the entire row and column.
Here is my <div> tag:
<FarPoint:FpSpread onkeydown="aKeyDown(event)" onkeyup="aKeyUp(event)" ID="FpSpread1"...
In image 1, My initial cell was (a,3) and I held shift and clicked on (b,4)
In image 2, it works. As long as I start at cell (a,1)
I needed to parseInt the row and column values.
function getRow() {
var ss = document.getElementById(spd);
ret = ss.ActiveRow;
if (ret == undefined)
ret = ss.GetActiveRow();
return parseInt(ret);
}
function getCol() {
var ss = document.getElementById(spd);
ret = ss.ActiveCol;
if (ret == undefined)
ret = ss.GetActiveCol();
return parseInt(ret);
}

Categories