Databases
StackOverflow2013
Postsdbo
POHaving trouble with JS object literal setup
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHaving trouble with JS object literal setup
    text
    copied!<p>So I've setup my first JS design pattern - but I've run into an issue.</p> <p>Here is my code on fiddle: <a href="http://jsfiddle.net/jrutter/CtMNX/" rel="nofollow">http://jsfiddle.net/jrutter/CtMNX/</a></p> <pre><code>var emailSignup = { 'config': { // Configurable Options 'container': $('#email-signup'), 'emailButton': $('#email-submit'), 'emailInput': $('#email-input'), 'brontoDirectAddURL': 'URL', 'brontoListID': '0bbc03ec000000000000000000000003287b', }, 'init': function (config) { // stays the same // provide for custom configuration via init() if (config &amp;&amp; typeof (config) == 'object') { $.extend(emailSignup.config, config); } // Create and/or cache some DOM elements emailSignup.$container = $(emailSignup.config.container); emailSignup.$button = $(emailSignup.config.emailButton); emailSignup.$input = $(emailSignup.config.emailInput); emailSignup.$brontoURL = emailSignup.config.brontoDirectAddURL; emailSignup.$brontoList = emailSignup.config.brontoListID; // Add email track to drop image pixel into for submission emailSignup.$container.append('&lt;div class="email-error"&gt;&lt;/div&gt;'); emailSignup.$container.append('&lt;div class="email-track"&gt;&lt;/div&gt;'); // Call getEmaile emailSignup.getEmail(emailSignup.$button, emailSignup.$input); // make a note that the initialization is complete emailSignup.initialized = true; }, 'getEmail': function ($button, $input) { // click event emailSignup.$button.click(function () { // get the val var $emailVal = $(emailSignup.$input).val(); // Call validateEmail console.log($emailVal); emailSignup.validateEmail($emailVal); return false; }); }, 'validateEmail': function ($emailVal) { var $emailRegEx = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; //console.log($emailVal); if ($emailVal == '') { $(".email-error").html('&lt;p&gt;You forgot to enter an email address.&lt;/p&gt;'); } else if (!$emailRegEx.test($emailVal)) { $(".email-error").html('&lt;p&gt;Please enter a valid email address.&lt;/p&gt;'); } else { $(".email-error").hide(); emailSignup.submitEmail($emailVal); } }, 'submitEmail': function ($emailVal) { $(".email-track").html('&lt;img src=' + emailSignup.$brontoURL+'&amp;email='+$emailVal+'&amp;list1=' + emailSignup.$brontoList + '" width="0" height="0" border="0" alt=""/&gt;'); }, </code></pre> <p>};</p> <p>Its a function to add a subscriber to an email list via bronto - it works perfectly when the script is included on the page and the init function is setup on the page too. But when I include the script in a shared header and try to fire the function from the document-ready, it doesnt seem to be working.</p> <p>Also, if I try to pass in a 'container' - that also is breaking the script. Not sure what Im doing wrong? But if I pass in the URL - that does work!</p> <pre><code>$(function () { emailSignup.init({ 'brontoDirectAddURL':'URL','container':'#email-signup' }); }); </code></pre> <p>Any advice would be greatly appreciated!</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload