Jump to content

Recommended Posts

I'm trying to create 'my own' (read: bits copied from a variety of sources) JavaScript library. I've decided to use a namespace methodology similar to that of the YUI library. Unfortunately, it looks like I have something weird going on with my naming. Everything will make more sense after I show the relevant pieces of code.

 

My HTML is a simple form with one input used to test if the validation function I've incorporated is working. So, its code is:

<html>
<head>
  <title>JavaScript Library Test</title>
  <script type="text/javascript" src="js/MPlib.js"></script>
  <script type="text/javascript">
     window.onload = function()
     {
        var inputForm = document.getElementById("inputForm");

        inputForm.onsubmit = validate;

        function validate()
        {
           if(!MP.Form.Validate.validateEmail(this.elements["email"])) // <-- line giving me the error
           {
               alert("E-mail entry not valid!");
           }
        }
     }
  </script>
</head>

<body>

<form id="inputForm" name="form" action="#" method="POST">
  E-mail: <input name="email" type="text" />
  <input name="submit" type="submit" value="submit" />
</form>

</body>
</html>

 

I get an error on the line I commented above. Specifically, the error occurs after I click submit. It is:

Error: MP is not defined

Source File: http://www.nightslyr.com/jstest.html

Line: 14

 

This is odd, as MP is defined (although it, itself, is empty). Here's the relevant library code (apologies for the spacing...it looks like Notepad++'s tabs don't copy over):

/**
*This is my first attempt at building a JavaScript library.
*While most of my code will use a pre-existing library (YUI, Scriptaculous, JQuery, Prototype, or Moo.fx), 
*I still have other helper functions I'd like to use.
*
*Date: May 12, 2008
*/

/**
*Global namespace
*/

var MP = {};

//-----------------------------------------------------------------------------------------------

/**
*Form namespace
*/

MP.Form = {};

//-----------------------------------------------------------------------------------------------

/**
*Form handling/validation namespace.
*/

MP.Form.Validate =
{
/**
 *Function to see if a required input has had information entered into it.
 *
 *@elem - element we're checking.
 *@getInputsByName - helper function.
 *@original - from John Resig's book Pro JavaScript Techniques
 */

 checkRequired = function(elem)
 {
	if(elem.type == "checkbox" || elem.type == "radio")
	{
		return getInputsByName(elem.name).numChecked;
	}
	else
	{
		return elem.value.length > 0 && elem.value != defaultValue;
	}
}

//-----------------------------------------------------------------------------------------------

/**
 *Helper function to find all input elements that have a specific name (good for those pesky checkboxes and radio buttons).
 *
 *@name - name of the elements we're looking for.
 *@original - from John Resig's book Pro JavaScript Techniques.
 */

 getInputsByName = function(name)
 {
	//The array of input elements that will be matched.
	var results = [];

	//Counter to keep track of how many have been checked.
	results.numChecked = 0;

	//Find all input elements in the document.
	var inputs = document.getElementsByTagName("input");

	for(var i = 0; i < inputs.length; i++)
	{
		//Find all inputs that have the name we're looking for.
		if(inputs[i].name == name)
		{
			//Add it to the array
			results.push(input[i]);

			//Remember how many of the fields have been checked, if any
			if(input[i].checked)
			{
				results.numChecked++;
			}
		}
	}

	return results;
}

//-----------------------------------------------------------------------------------------------

/**
 *Function that validates an e-mail address.
 *
 *@elem - the element whose value we're checking.
 */

validateEmail = function(elem)
{
	return elem.value == '' || /^[a-z0-9_+.-]+\@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/i.test(elem.value);
}

//-----------------------------------------------------------------------------------------------

/**
 *Function that validates an inputed URL.
 *
 *@elem - the element whose value we're checking.
 */

validateURL = function(elem)
{
	return elem.value == '' || !elem.value = 'http://' || /^https?:\/\/([a-z0-9-]+\.)+[a-z0-9]{2,4}.*$/i.test(elem.value);
}

//-----------------------------------------------------------------------------------------------

/**
 *Other validation functions to be added later.
 */
};

 

I fail to see how MP is not defined. Unfortunately the alert isn't firing at all, so I'm at a bit of a loss. Please help.

 

EDIT: While I'm here, I have another issue.  I have the following error in my library code:

missing : after property id

http://www.nightslyr.com/js/MPlib.js

Line 34

 

The code is:

MP.DOM =
{
/**
 *Function to get/set element attributes.
 *It normalizes those tricky cases of 'for' = 'htmlFor' and 'class' = 'className'.
 *
 *@elem - element we're accessing
 *@name - name of the style
 *@value - value of what we're setting (if any)
 *
 *@original - From John Resig's book Pro JavaScript Techniques
 */

handleAttr = function(elem, name, value) // <-- error here
{
	//Make sure a valid name was provided
	if(!name || name.constructor != String)
	{
		return '';
	}

	//Figure out if the name was one of the weird naming cases
	name = {'for' : 'htmlFor', 'class' : 'className'}[name] || name;

	//If the user is setting a value, also
	if(typeof value != 'undefined')
	{
		elem[name] = value

		//If we can use setAttribute

		if(elem.setAttribute)
		{
			elem.setAttribute(name, value);
		}
	}

	//Return the value of the attribute
	return elem[name] || elem.getAttribute(name) || '';
}

//-----------------------------------------------------------------------------------------------

/**
 *Function to create a new DOM element.
 *It normalizes XHTML and HTML element creation.
 *
 *@elem - type of element we're creating
 *@original - from John Resig's book Pro JavaScript Techniques
 */

createElem = function(elem)
{
	return document.createElementNS ? document.createElementNS('http://www.w3.org/1999/xhtml', elem) : document.createElement(elem);
}
};

 

Firefox's console tells me it's between the '=' and function(...).  I can't figure out why it's choking on it, though.

Link to comment
https://forums.phpfreaks.com/topic/105311-solved-homebrew-library-problems/
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.