Category: JavaScript

5 Tips for Finding Amazing React Components

5 Tips for Finding Amazing React Components

One of the most important parts of building scaleable systems quickly is to find work that others have done and use it as part of our system. Using packages others built and assembling it with your business rules and logic is a lot like putting together pieces of Lego but following your instructions.

One of my favourite parts of React is that there’s usually hundreds of small open source components that can be used and usually easily modified to suit my needs. For example, there’s dozens of really well done date/time pickers that usually require no effort to put into place. Continue reading

5 Reasons to Use Node.js on Your Next Project

5 Reasons to Use Node.js on Your Next Project

JavaScript has forever changed the way that websites are built. Even in it’s early days, it was being used to validate forms before data was submitted to servers. In the last 5 to 10 years, we no longer needed to do full page refreshes because of JavaScript which made the web feel faster and more responsive. Continue reading

Awesome Resources for Learning Salesforce Lightning

Resources for Learning Salesforce Lightning

At Dreamforce 2014, Salesforce announced they were changing the Salesforce User Interface to make it simpler to use. The new User Interface is called Salesforce Lightning. In my blog post, What is Salesforce Lightning I cover a lot more about what it is and how development differs from using Apex and Visualforce.

If you don’t have any experience with JavaScript, it will make programming Salesforce Lightning a lot more difficult. I strong recommend having a look at my blog post Resources for Learning JavaScript before you dive into learning Salesforce Lightning because JavaScript is what’s used predominantly in the controller now.

In the last two years or so, there’s been a steady increase in the number of resources that have become available for learning lightning. I launched my first lightning component as part of an AppExchange product about a year ago and have been doing lots of lightning, react and node development since then. I believe that all Salesforce Developers will need to learn and master javascript to avoid becoming irrelevant and unemployable in the next couple of years. Continue reading

Using Promises in Salesforce Lightning

Using Promises in Salesforce Lightning

It’s no secret that Salesforce Lightning is changing the way we develop for Salesforce. At Dreamforce 2014, Salesforce introduced Salesforce Lightning and it is proving to change a lot of things we do on the platform and I’m sure it will make things a lot better for users in the long term. If you aren’t already familiar with Salesforce Lightning then you need to read my post called What is Salesforce Lightning. Continue reading

What is a Self Invoking Function

What is a Self Invoking Function

In JavaScript, it’s common to hear lots of strange terminology without a lot of description around what it is or what it does. I want to try and demystify what a self invoking function is and why you should consider them and the times when maybe you shouldn’t consider them. Continue reading

Why JavaScript

Why JavaScript

In the earlier days of the web, there was a battle between two scripting languages VBScript and JavaScript. VBScript, thankfully, eventually died and JavaScript became the dominant language for making really easy to use and interactive websites.

In the years since, JavaScript has become more and more used. Backend code can be written in basically any language, even in JavaScript, but the client side will almost always require a developer with some JavaScript knowledge. Every industry has a lot of javascript and some are even rewriting core functionality to use more. Surprisingly, even large banks and credit card companies are beginning to use JavaScript or Node in big ways. PayPal has been rewriting very large parts of their code base to make it more scalable and usable. Continue reading

How to Use Reduce on JavaScript Arrays

In functional programming, being able to reduce is one of the fundamental concepts. Reduce is used to iterate through the values in an array and condense all of the values into a single value. Usually the value is a sum of all of the elements.

Normally, you would want to use a reduce method when you want to sum all of the values in an array and then use the total for some operation. For example, it might make sense to use a reducer when you want to get the total number of items in a shopping cart and determine the tax or determine how many items a customer purchased. Continue reading

Detecting Inactivity in JavaScript

Detecting Inactivity in JavaScript

In a lot of web applications, it can be really useful to detect whether the user is still active or not. For example, when a user is no longer active it can make a lot of sense to automatically log the user out or remind them that they’re about to be logged out. Continue reading

How to merge Objects together in JavaScript

How to Merge Objects in JavaScript

Merging objects together in JavaScript isn’t very difficult although there’s quite a few different ways that it can be done.

Note, I’m not covering deep cloning for the sake of simplicity although this can be easily done through most of these different methods.

Continue reading

5 Resources for Learning JavaScript

5 Resources for Learning JavaScript

Traditionally when somebody said JavaScript, they were talking about a language that just did stuff on the client side like form validation or the occasional animation or UI enhancement. For years now, JavaScript has been all of the rage. Most new technology startups are now using JavaScript on the frontend, and on their backend services. Continue reading

Salesforce Developers Need to Learn JavaScript Today

Salesforce Developers Need to Learn JavaScript Today

Over the years, it’s been possible for Salesforcce Developers to avoid needing to learn JavaScript because things could usually be done through a combination of apex and visualforce. If you don’t know JavaScript and you are a Salesforce Developer, you need to really consider finishing this post and learning JavaScript. Continue reading

JavaScript IsNumeric Function

In the past, there’s been so many times I needed to tell if an object was numeric. With the below function, it’s very easy to tell if an item is numeric.

 //return false if blank, null, undefined or NaN.
 function isNumeric(v) {
   if (v == null || v == undefined || v== '') {
      return false;
   }
                        
   return !isNaN(v) && isFinite(v);
 }

If your project is already using jQuery, you could always use jQuery.IsNumeric()

Dealing With Dates in JavaScript

Dealing With Dates in JavaScript

Dates and DateTimes are difficult to deal with in most languages. The Date object is a datatype that’s built in the JavaScript language. In JavaScript, the biggest problem is that the browsers aren’t overly consistent in the way they have implemented the Date object and its APIs. Continue reading

Disabling Caching on All AJAX in jQuery

It’s no secret that many of us that use javascript regularly love jQuery because it handles a lot of the cross browser issues and makes our lives so much easier.

The .ajax function makes use of caching by default, but we can override this by creating a function called .ajaxSetup and adding cache: false in the function.

$.ajaxSetup ({
    cache: false
});

You can of course take advantage of this and create even more verbose .ajax calls. 😉

How to Add CSS & JavaScript to a Magento CMS Page

Magento is an insanely flexible system that has a lot of potential, but of course with this flexibility comes a lot of learning.

Adding a JavaScript file and a CSS file to a specific CMS page isn’t very difficult. We should always consider adding the JavaScript file or CSS file to the theme if we’re going to use it on more than one specific page. Continue reading

jQuery Mobile: Page Blank

jQuery Mobile is an absolutely amazing javascript framework that can easily assist developing mobile friendly websites. jQuery Mobile is easily summarized by its authors to: “Delivering top-of-the-line JavaScript in a unified User Interface that works across the most-used smartphone web browsers and tablet form factors.”

After adding jQuery Mobile to my first application, I discovered the page wasn’t rendering anything. When using firebug I determined that the body class had “ui-mobile-rendering” attached to it. The ui-mobile-rendering could occur in a few cases: javascript has died for some reason, or you have forgot to include a div with data-role=”page”.

The documentation for the jQuery Mobile framework is very good, but navigating through it on a pc isn’t exactly a great user experience. I hadn’t seen this page till I started really digging into the framework’s documentation and some of the different javascript forums.

Hope this helps.

Component returned failure code: 0x805e000a

Error: uncaught exception: [Exception… “Component returned failure code: 0x805e000a [nsIXMLHttpRequest.open]”
nsresult: “0x805e000a ()”

AdBlock interferes with the XmlHTTPRequest object and is known to sometimes break the way jQuery functions especially if the url triggers some sort of url filter.

You have a few options to resolve the solution:

  • suggest that users turn off AdBlock if the class called global_message exists.
  • Change the url posting or geting from.

Book Review: jQuery in Action

jQuery in Action, First Edition is written by Bear Bibeault and Yehuda Katz and is probably the simplest and easiest to understand programming book available. Target reader is somebody that already is using javascript in projects and is looking to push the limits of their web applications by using jQuery and many of it’s great plugins.

I found the book and its appendices to be extremely well written. I found the examples to be superbly written and extremely usable in my projects: there aren’t a lot of examples on basic things like selectors but there are a ton of great examples on much more advanced concepts. An additional feature that I found really helpful was the interactive lab exercises that begin around chapter two.

As a reference, which I don’t think was the primary intent, it would be difficult to use the book as some of the API is randomly spread throughout the book. The random spread does make the book a lot better though, because each chapter definitely builds well upon the previous chapter.

I completely recommend this book and can only imagine that the Second Edition improves upon the First Edition. I haven’t really found much negative about the book other than wishing the API wasn’t spread out so much, but the index is very good.

jQuery + PHP to parse XML

jQuery is very well suited for cross browser JavaScript development, but I bet you didn’t know jQuery is also fairly well suited to parsing XML. I often use jQuery to send XMLHttpRequests and then parse the XML returned by a PHP script on the server and then manipulate the return in some way. I won’t really cover exactly what to do with it because this is so dependent on the purpose of your data.

Parsing the XML isn’t overly difficult with jQuery and will allow you to truly use the power of AJAX and eliminate a lot of the complexity with JavaScript. Of course, getElementByTagName and getAttribute aren’t exactly 100% cross browser compatible, and jQuery is pretty much 100% of the time.

Things to Remember

  • PHP must set the content-type to be specified as text/xml or application/xml as seen in the following code example.
  • If you are using .ajax() you must ensure that the dataType is “xml” or you won’t be able to parse the data returned.


<?php
header ("Content-Type: text/xml");
?>

<your_xml_content>
<site ID="1" >
<Title>BRCline Consulting</Title>
<url>www.brcline.com</url>
</site>
</your_xml_content>

<script type="text/javascript" >
$(document).ready(function(){
$.ajax({
type: "GET",
url: "yourURLHere.php",
dataType: "xml",
success: function(xml) {

}
});
});
</script>

Further Reading
jQuery often has a ton of plugins that can increase the flexibility and decrease the amount of time you spend on writing your own “utility” code. One such plugin available to reduce the amount of time spent on writing utility code for parsing XML/RSS feeds is jFeed.