10 Replies - 676 Views - Last Post: 09 September 2008 - 06:02 PM

#1 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

A few questions

Post icon  Posted 07 September 2008 - 11:30 PM

Hey guys I have a few questions which I guess you could consider very basic, but I've been searching for half an hour and don't seem to be getting anywhere.

I'm trying to teach myself some Javascript, mostly using a book I've bought. It has a bunch of exercises after each chapter, but no answers so the ones I don't get have me totally stumped.

First thing I'm having trouble with is wanting to create a link that when you click it, some XHTML is loaded.
The link I have is:
<a href="#" onclick="displayRegistrationForm()">Click here for registration</a></p>

but I'm not sure what to use as the Javascript. I'm wanting to display a bunch of text fields/buttons so the pretend user can register. My book has:

function displayRegistrationForm()
{
var strHTML = "Registration Form";
document.getElementById('content').innerHTML = strHTML;
}

But I can't make any sense of this.

Could someone please help me out?
Thanksssss! :ph34r: :crazy:

Is This A Good Question/Topic? 0
  • +

Replies To: A few questions

#2 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

Re: A few questions

Posted 08 September 2008 - 03:24 AM

Nevermind, I eventually got it. To anyone interested:

<span id = 'quiz'>
<h2>Now try our wonderful Beijing Olympic Quiz!</h2>
<p>Did you enjoy the Beijing Olympics?<br /><br />
It's time for reviewing facts on the Beijing Olympics.<br /><br />
To try this quiz, you need to provide your profile for generating a personal certificate.<br />
<a href="#" onclick="displayRegistrationForm()">
Click here for registration</a></p>
</div>
</span>


function displayRegistrationForm()
{
var strHTML = "Registration Form";
document.getElementById('quiz').innerHTML = strHTML;
}


Is how I did it!
Was This Post Helpful? 0
  • +
  • -

#3 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

Re: A few questions

Posted 08 September 2008 - 03:40 AM

Okay, so I haven't quite. I was a little ahead of myself, haha.

It seems I can't put all the HTML I need into strHTML. I need to put in two text fields and two buttons. Does anyone know how I can do this?
Was This Post Helpful? 0
  • +
  • -

#4 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1138
  • View blog
  • Posts: 7,110
  • Joined: 07-September 06

Re: A few questions

Posted 08 September 2008 - 05:32 AM

One thing to remember is that you can't use linebreaks in javascript strings, that breaks them. Then you will need to make sure you use only single quotes ' or backslashed quotes \" inside of tags to avoid errors.

Here is an example:

var strHTML = "Register:<br /><input type=\"text\" value=\"Test\" /> &lt;&lt; Username<br />Password: <input type=\"password\" /><br /><br /><input type=\"submit\" value=\"Submit BTN\" />";


It gets really jumbled this way, but at least javascript understands that it is a string and not broken.

HTH
Was This Post Helpful? 0
  • +
  • -

#5 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

Re: A few questions

Posted 08 September 2008 - 04:17 PM

Aahhh, I totally forgot about that! Thankyou so much BetaWar, I'm sure that's why it wasn't displaying anything. I'll test it when I get home.
Was This Post Helpful? 0
  • +
  • -

#6 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1138
  • View blog
  • Posts: 7,110
  • Joined: 07-September 06

Re: A few questions

Posted 08 September 2008 - 07:21 PM

No problem, just glad to have helped out :)
Was This Post Helpful? 0
  • +
  • -

#7 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

Re: A few questions

Posted 08 September 2008 - 08:05 PM

Ahaha, you always seem to be helping me. I've tried thanking you a few times but for some reason I get the error message "Unable to thank user". Do I not have enough posts or something?

I'm stuck on something else now. I'm trying to validate the users' input, and that has worked fine so far. But now I'm trying to add a function that makes sure the user has a '@' and '.' in their email address field, the problem is the function isn't doing anything. :blink:

I can't see anything wrong with it:
function displayRegistrationForm()
{
var strHTML = "<h2>Registration for Beijing Olympic Quiz:</h2><br />Fill in the following form: <br /><form action=\"\" name=\"regForm\" method=\"post\" id=\"regForm\">Name <input type=\"text\" name=\"name\" /><br />Email <input type=\"text\" name=\"email\"/><br /><br /><input type=\"button\" id=\"btSubmit\" value=\"Submit Query\" onclick=\"validateSubmission()\" /><br /><input type=\"button\" value=\"Reset\" onclick=\"java script:document.regForm.reset();\" /></form>";
document.getElementById('quiz').innerHTML = strHTML;
}


function validateSubmission()
{
var errorString = "";
var valid = true;

	if (document.regForm.name.value == "" && document.regForm.email.value == "")
	{
		errorString = "You haven't filled out your name or email address";
		alert ("The following errors occured: \n" + errorString);
		valid = false;
	}
	else if (document.regForm.name.value == "")
	{
		errorString = "You haven't filled out your name";
		alert ("The following errors occured: \n" + errorString);
		valid = false;
	}
	else if (document.regForm.email.value == "")
	{
		errorString = "You haven't filled out your email address";
		alert ("The following errors occured: \n" + errorString);
		valid = false;
	}
	
	if (validateEmail(document.getElementById('email'))==true)
	{
		window.alert("Your email address is valid");
	}
	else
	{
		window.alert("Your email address does not appear to be valid");
	}

	return valid;
}

function validateEmail(formObj)
{
var email = formObj.value;

	if(email.search("@")==-1 || email.lastIndexOf(".")==-1)
	{
		return false;
	}
	else
	{
		return true;
	}
}


Can anyone see what might be wrong in that? Thanks!
Was This Post Helpful? 0
  • +
  • -

#8 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1138
  • View blog
  • Posts: 7,110
  • Joined: 07-September 06

Re: A few questions

Posted 08 September 2008 - 09:21 PM

Here is a simple email validation script (from google)

function echeck(str) {

		var at="@"
		var dot="."
		var lat=str.indexOf(at)
		var lstr=str.length
		var ldot=str.indexOf(dot)
		if (str.indexOf(at)==-1){
		   alert("Invalid E-mail ID")
		   return false
		}

		if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
		   alert("Invalid E-mail ID")
		   return false
		}

		if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
			alert("Invalid E-mail ID")
			return false
		}

		 if (str.indexOf(at,(lat+1))!=-1){
			alert("Invalid E-mail ID")
			return false
		 }

		 if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
			alert("Invalid E-mail ID")
			return false
		 }

		 if (str.indexOf(dot,(lat+2))==-1){
			alert("Invalid E-mail ID")
			return false
		 }
		
		 if (str.indexOf(" ")!=-1){
			alert("Invalid E-mail ID")
			return false
		 }

 		 return true					
	}


I have a more accurate one that uses regex, but that is somewhere in my desktop (am on my laptop) so I will have to find it later and post it then.

Hope that helps for now though.
Was This Post Helpful? 0
  • +
  • -

#9 skin__  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 37
  • Joined: 20-May 08

Re: A few questions

Posted 09 September 2008 - 04:58 AM

Thanksssss BetaWar. That was perfect, I managed to integrate that into what I'm doing perfecting. I have another question now.. (hopefully the last!) this time regarding cookies.

I need to create a cookie so that when the user enters their name it saves it to the cookie, and then on the next pages gives them a little welcome message ("Hello, " + whateverTheirNameIs).

I have no experience with cookies, so I'm just experimenting at the moment, but this is what I have so far:

function createCookie(cookie_name, cookie_value, days)
{
	document.cookie = cookie_value;
	alert(document.cookie)

}


This function is called like this:
createCookie(document.regForm.name.value, document.regForm.name.value, 5);


After my validation functions have determined there are no errors in the email/name fields. The problem that alert in the createCookie function returns two values, whatever is in the 'name' field and then one that's always 'undefined'. What is this undefined value!?

Also, how would I go about extracting the 'name' value from the cookie and using it to greet the user?

I can post the whole .js file if my post is too hard to follow. Any help would be greatly appreciated!
Was This Post Helpful? 0
  • +
  • -

#10 BetaWar  Icon User is offline

  • #include "soul.h"
  • member icon

Reputation: 1138
  • View blog
  • Posts: 7,110
  • Joined: 07-September 06

Re: A few questions

Posted 09 September 2008 - 03:21 PM

The problem you are having is that cookies take a cookie name and a value, not just a value.

The second (undefined) value is the cookie value.

What you need to do is something like so:

document.cookie = "name="+cookie_value;


You could also do cookies like so:

setCookie("name", cookie_value, days);


Then, when you are wanting to read out the value (get the cookie) you can do that like so:

getCookie("name");


For more information on cookies take a look at this website:
http://w3schools.com/js/js_cookies.asp

Hope that helps.
Was This Post Helpful? 0
  • +
  • -

#11 skin_  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 33
  • Joined: 05-April 08

Re: A few questions

Posted 09 September 2008 - 06:02 PM

View Postskin_, on 7 Sep, 2008 - 11:30 PM, said:

Hey guys I have a few questions which I guess you could consider very basic, but I've been searching for half an hour and don't seem to be getting anywhere.

I'm trying to teach myself some Javascript, mostly using a book I've bought. It has a bunch of exercises after each chapter, but no answers so the ones I don't get have me totally stumped.

First thing I'm having trouble with is wanting to create a link that when you click it, some XHTML is loaded.
The link I have is:
<a href="#" onclick="displayRegistrationForm()">Click here for registration</a></p>

but I'm not sure what to use as the Javascript. I'm wanting to display a bunch of text fields/buttons so the pretend user can register. My book has:

function displayRegistrationForm()
{
var strHTML = "Registration Form";
document.getElementById('content').innerHTML = strHTML;
}

But I can't make any sense of this.

Could someone please help me out?
Thanksssss!

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1