Magento checkout jquery function null error - magento

I'm getting error TypeError: $(...) is null and TypeError: $(...).visible is null.
In onepage checkout jquery function which is if($('checkout-step-shipping').visible() || $('checkout-step-shipping_method').visible())
Please let me know what may cause this problem
function styleRegionInterval() {
if (!intervalInit) {
styleRegion = setInterval(styleRegionInput, 500);
intervalInit = true;
}
}
function styleRegionInput() {
if($('checkout-step-shipping').visible() || $('checkout-step-shipping_method').visible()) {
clearInterval(styleRegion);
intervalInit = false;
shippingRegionUpdater.update();
}
}
Some days before i had removed shipping method but my checkout was working fine without it.
There is same on billing or register page of checkout to continue button as function calls there.

Try using jQuery('checkout-step-shipping').visible() instead of $('checkout-step-shipping').visible().
Your could should look like:
function styleRegionInterval() {
if (!intervalInit) {
styleRegion = setInterval(styleRegionInput, 500);
intervalInit = true;
}
}
function styleRegionInput() {
if(jQuery('checkout-step-shipping').visible() || jQuery('checkout-step-shipping_method').visible()) {
clearInterval(styleRegion);
intervalInit = false;
shippingRegionUpdater.update();
}
}

Related

Circular dependencies in Titanium/ RequireJs

I have some circular dependencies in my Titanium application like so:
index.js
var Auth = require('Auth')
Auth.js
var PopUp = require('PopUp');
function isLoggedIn() {
// some logic e.g. return userName !== null
};
function authorise() {
if (isLoggedIn()) {
return true;
} else {
return PopUp.authorise();
}
}
PopUp
var Auth = require("Auth");
function authorise() {
// some code asking user to login
}
function showSecurePopUp() {
if (Auth.isLoggedIn()) {
// show secure pop up
}
}
As you can see we have a circular dependency. Auth needs PopUp and PopUp needs Auth.
This creates a circular dependency and thus the following error message:
[ERROR] [iphone, 10.3.3, 192.168.0.64]
Type: RangeError
Message: Maximum call stack size exceeded.
File: /iphone/Auth.js.js
Line: 24
How can I solve the issue of circular dependencies in a Titanium Alloy app?
I think this could be the way, you do the following changes in you project and this should solve the problem.
Alloy.js
var Auth = require("Auth");
var PopUp = require('PopUp');
Index.js
Auth.authorise();
Auth.js
var isLoggedIn = function() {
// some logic e.g. return userName !== null
Ti.API.info('isLoggedIn');
return false;
};
exports.authorise = function() {
if (isLoggedIn()) {
Ti.API.info('authorize isloggedIn');
return true;
} else {
Ti.API.info('authorize not logged In');
return PopUp.authorise();
}
};
exports.isLoggedIn = isLoggedIn;
PopUp.js
exports.authorise =function () {
// some code asking user to login
Ti.API.info('authorize funcition popup ' + Auth.isLoggedIn());
};
function showSecurePopUp() {
if (Auth.isLoggedIn()) {
// show secure pop up
Ti.API.info('isLoggedIn show secure popup');
}
}
Let me know if this works fine and if this is what you wanted. Also if you have some other approach that solves the problem, then let me know that also.
Good Luck & Cheers
Ashish Sebastian

AJAX getting onChange to work

I have set up a form where the user can comment by entering their name, email and comment.
I want to run a validation on the input once the user leaves the #name field, but I can't get it to work please help.
$(document).ready(function() {
$('#name').on("change", function () {
var name = $('input[name=name]');
if (name.val()=='') { //A regex check will be added later on to check for invalid caracters
name.addClass('hightlight');
$('#name_error').show();
var error = true;
} else {
name.removeClass('hightlight');
$('#name_error').hide();
}
if ($(error).length) {
return false;
}
});
});
$('#name').focusout(function() {
//code
});
if you want it to trigger on leave than you can use:
$('#name').blur(function() {
//your code
}
Refer here: http://api.jquery.com/blur/
if you want to trigger on change than:
$('#name').change(function() {
//your code
}
Refer here:http://api.jquery.com/change/
You can use focusout instead of change
$(document).ready(function () {
$('#name').focusout(function () {
var name = $('input[name=name]');
if (name.val() == '') { //A regex check will be added later on to check for invalid caracters
name.addClass('hightlight');
$('#name_error').show();
var error = true;
} else {
name.removeClass('hightlight');
$('#name_error').hide();
}
if ($(error).length) {
return false;
}
});
});

multiple knockout validators on an observablearray

I tried to define multiple custom validation rules under a observable array, I was referring to https://github.com/ericmbarnard/Knockout-Validation/wiki/Custom-Validation-Rules.
Following is my observablearray with the validation calls:
this.WeeklyData = ko.observableArray([]).extend({
validation: [
{
validator : fminIncrements,
message: 'use 15 min increments'
},
{
validator: ValidateMinMax,
message: "Invalid min/max value"
}
]
});
var ValidateMinMax = function (valueArray) {
var check = true;
ko.utils.arrayFirst(valueArray, function (value) {
if (parseInt(value.Val(), 10) < 0 || parseInt(value.Val(), 10) > 168) {
check = false;
return true;
}
});
return check;
};
var fminIncrements = function (valueArray) {
var check = true;
ko.utils.arrayFirst(valueArray, function (value) {
if (parseInt(value.Val(), 10) % 15 !== 0) {
check = false;
return true;
}
});
return check;
};
when I do this only the first rule fires. I debugged, and it doesn't even hit the second one. Any idea?
Thanks in advance for any help.
I believe its because you are using the ko.utils.arrayFirst(). If you use the ko.utils.arrayForEach() instead to check for every case then it shouldn't return at the first occurrence.

AJAX - Return responseText

I've seen the myriad threads sprawled across the Internet about the following similar code in an AJAX request returning undefined:
AJAX.onreadystatechange = function() {
if(AJAX.readyState == 4) {
if(AJAX.status == 200) {
var response = AJAX.responseText;
return response;
}
else {
window.alert('Error: ' + AJAX.status);
return false;
}
}
};
I know that I'm supposed to "do something with" responseText like writing it to the HTML. The problem: I don't have that luxury. This bit of code is intended to be inside of a generic method for running fast AJAX requests that way all the code for making an AJAX request doesn't have to written out over and over again (~40×) with the chance of a minor problem here or there that breaks the application.
My method HAS to explicitly return responseText "or else." No writing to HTML. How would I do this? Also, I'd appreciate a lack of plugs for JQuery.
What I'm looking for:
function doAjax(param) {
// set up XmlHttpRequest
AJAX.onreadystatechange = function() {
if(AJAX.readyState == 4) {
if(AJAX.status == 200) {
var response = AJAX.responseText;
return response;
}
else {
window.alert('Error: ' + AJAX.status);
return false;
}
}
};
// send data
}
...
function doSpecificAjax() {
var param = array();
var result = doAjax(param);
// manipulate result
}
Doing a little research I came across this SOF post:
Ajax responseText comes back as undefined
Based on that post, it looks like you may want to implement your ajax method like this:
function doRequest(url, callback) {
var xmlhttp = ....; // create a new request here
xmlhttp.open("GET", url, true); // for async
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4) {
if (xmlhttp.status == 200) {
// pass the response to the callback function
callback(null, xmlhttp.responseText);
} else {
// pass the error to the callback function
callback(xmlhttp.statusText);
}
}
}
xmlhttp.send(null);
}
Then, you can call that method like this...
doRequest('http://mysite.com/foo', function(err, response) { // pass an anonymous function
if (err) {
return "";
} else {
return response;
}
});
This should return the responseText accurately. Let me know if this doesn't give you back the correct results.

e.preventDefault(); behaviour not working in Firefox?

I have this basic function for handling the key event, everything works great. However, in Firefox 9.0.1 it seems I can't prevent the default event which is showing of bookmarks.
Is there any solution to prevent the default behaviour in FF?
$(document).keydown(function(evt) {
if (evt.which == 66 && evt.ctrlKey) {
if (evt.preventDefault) {
evt.preventDefault();
} else {
evt.returnValue = false;
}
alert("Ctrl+B pressed");
return false;
}
});
Seems like some sort of bug regarding alert. Try this:
$(document).keydown(function(evt) {
if (evt.which == 66 && evt.ctrlKey) {
if (evt.preventDefault) {
evt.preventDefault();
} else {
evt.returnValue = false;
}
console.log("Ctrl+B pressed");
return false;
}
});
Doesn't open the Bookmarks Toolbar for me now. I assume you don't actually want to alert do you? I think you can just call your method as long as it doesn't contain an alert.

Resources