ELATED: ELATED.com Site Help http://www.elated.com/ Need help with the PageKits, ActionKits, ImageKits or any other Elated resource? Post your questions here! en-us Fri, 10 Sep 2010 20:30:27 GMT Fri, 10 Sep 2010 20:30:27 GMT http://blogs.law.harvard.edu/tech/rss ELATED.com feeder Re: Tope help http://www.elated.com/forums/topic/4942/#post19139 From: cat


Hi there,

You need to copy and rename the file rather than opening the file and copying the contents.

(I assume from your wording that you are using some version of Windows, so I'm trying to give windows instructions from memory - years since I've actually used windows.)

So you need to:
open the tope folder - using windows explorer
select (rather than open) the index.html file - click it once with your mouse
use ctrl-C to copy the file and then ctrl-V to paste a new file
then I think it's F2 to rename the file. call the copy "tope.xml"
then you can open the new file with notepad to edit (see below if it tries to open in another application...)

Each file extension has a default application to handle (or open) it. (In your case .html is being handled by chrome.) If you need to use a different application to the default (e.g. you need to use a text editor) then you can click the item once and right click to bring up a context menu. In here there should be an option called something like "Open with ..." and then you can choose from a list of applications that can handle that type of file.

Hope that helps!
Cat

--
http://web.soothed.com.au/
Web design for natural therapists

View » | Reply »

]]> Sun, 02 May 2010 00:26:40 GMT http://www.elated.com/forums/topic/4942#post19139 Tope help http://www.elated.com/forums/topic/4942/#post19129 From: artcrator


Hi, last night I went through the step by step three times. Each time something different happened when I got to the testing part. I have been cutting and pasting the source code from the index page that comes up in Chrome. Is this where I am going wrong? The directions seem confusing, because in the beginning I am assuming that index.html is the index Chrome file, and that in order to get the code, I just leaped to going to 'view source' and cut and pasting the code from the Chrome html page. But I have no idea if this is what I am supposed to be doing. The only 'notepad' document is the style.css.
The directions state:
"Now, open the tope folder on your hard drive and find the index.html file. Copy this file to a new file called tope.xml. This will be your Blogger template. Open tope.xml for editing in your favourite text editor (I like to use Notepad on Windows and TextWrangler or vim on the Mac)."
What does it mean to open the index.html file and copy? If it does not mean to open the file in Chrome, then go to the upper right pull down window (in Explorer) and open the "view source" then where would I get the code to copy and paste? And further, "open tope.xml in your favourite text editor" but would the text editor already be open if I was cutting and pasting code?

View » | Reply »

]]> Fri, 30 Apr 2010 02:39:59 GMT http://www.elated.com/forums/topic/4942#post19129 Re: text position http://www.elated.com/forums/topic/873/#post19008 From: laura28


Me too had the same problem for my website and thanks Matt for the solution.

View » | Reply »

]]> Thu, 01 Apr 2010 07:06:57 GMT http://www.elated.com/forums/topic/873#post19008 Re: photoshop crop tool deleted everything http://www.elated.com/forums/topic/4891/#post18851 From: simon


Hi Ashes,

Welcome to the ELATED forums!

It's really hard to diagnose this one without seeing the PSD file to be honest. Even then, it might just be tricky. Could you post the file anywhere for us to download?

Simon

--
ELATED : )
http://www.PageKits.com
Professional Website Templates

View » | Reply »

]]> Wed, 03 Mar 2010 17:23:05 GMT http://www.elated.com/forums/topic/4891#post18851 photoshop crop tool deleted everything http://www.elated.com/forums/topic/4891/#post18841 From: Ashes


I was moving and cropping selections when suddenly instead of cropping the edges, my entire image disappeared and left a blue field. And it won't quit doing this. What did I do wrong?

--
I need help. I must have done something wrong in my Photoshop cs3. I was placing photo selections and cropping them when suddenly, instead of cropping my image disappeared and only blue was left. What happened and how can I make it go back to normal?

View » | Reply »

]]> Tue, 02 Mar 2010 07:16:44 GMT http://www.elated.com/forums/topic/4891#post18841 Re: help needed with Hilite please http://www.elated.com/forums/topic/4858/#post18667 From: simon


Hmm. That's odd - it worked on my local copy here. Can you upload what you have somewhere and post the web address so i can take a look, please?

Simon

--
ELATED : )
http://www.PageKits.com
Professional Website Templates

View » | Reply »

]]> Tue, 26 Jan 2010 10:46:02 GMT http://www.elated.com/forums/topic/4858#post18667 Re: help needed with Hilite please http://www.elated.com/forums/topic/4858/#post18664 From: sandym


Hi again. Thanks for replying so quickly. I tried this (see copy CSS code below) but no, it didn't do it - the text in the promo box is still black.
Would it work if I add a new paragraph style with colour #fff? As you can guess my knowledge is very limited and I really appreciate your help.
Thanks.

#top-promo-right p
{
font-size: 1.2em;
padding: 10px;
colour: #fff;
}

View » | Reply »

]]> Mon, 25 Jan 2010 11:13:51 GMT http://www.elated.com/forums/topic/4858#post18664 Re: help needed with Hilite please http://www.elated.com/forums/topic/4858/#post18659 From: simon


Hi Sandym,

Welcome to ELATED's forums!

You can define the colour for the text in the pink boxes by adding a "color" attribute to the "#top-promo-right p" definition in style.css.

It should then look like this:

#top-promo-right p
{
font-size: 1.2em;
padding: 10px;
color: #fff;
}

That should do it!

Hope that helps,

Simon

--
ELATED : )
http://www.PageKits.com
Professional Website Templates

View » | Reply »

]]> Sat, 23 Jan 2010 19:02:16 GMT http://www.elated.com/forums/topic/4858#post18659 help needed with Hilite please http://www.elated.com/forums/topic/4858/#post18657 From: sandym


Hi, I'm a beginner working on Hilite. I reversed the Pagekit colours (black background/white text) to white background/black text and that's fine except I really liked the original appearance of the white text in the pink promo boxes but don't know what to add or where to change the style sheet to achieve this. I would really appreciate it if someone could tell me what to do. I am using Dreamweaver MX & Photoshop. Thanks.

View » | Reply »

]]> Sat, 23 Jan 2010 17:30:47 GMT http://www.elated.com/forums/topic/4858#post18657 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18625 From: matt


Hi Ted, and welcome!

Your page looks OK to me. The text and button are centred correctly.

Checked on Firefox 3.5 Mac, Safari 4 Mac, IE8 Win.

I guess you fixed it?

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 12 Jan 2010 00:06:09 GMT http://www.elated.com/forums/topic/4562#post18625 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18621 From: Ted


I have used your css for the rollover button and it works great. I have it on an entry (welcome) page where the user clicks on the button to get to get to the next page (pretty normal). There are two lines of text centered in the page, one line above the graphic and one below. I want to get the graphic (button) also centered in the page but am not having any success.

Can you help? I think it is pretty basic but is also beyond me. ;-(

You can see the results so far at http://bcitra.bc.ca, thanks in advance for any help. This is the css that I am using to center the lines of text:

body{
text-align: center;
font-family: "comic sans MS", verdana, arial, sans-serif;
font-size: 1.8em;
background-image: url("images/granite.jpg");
color: #0000ff;
}

Cheers,
Ted

View » | Reply »

]]> Fri, 08 Jan 2010 01:31:28 GMT http://www.elated.com/forums/topic/4562#post18621 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18494 From: matt


Yes, that's correct. That code will centre a block-level element. (In fact you probably don't need the "text-align: center" at all, although it probably won't hurt to leave it in!)

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Mon, 07 Dec 2009 05:54:11 GMT http://www.elated.com/forums/topic/4562#post18494 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18492 From: toastyrat


ok, just found something in my css. But3 had:

Code:
--------------------
margin-left: auto;
margin-right:auto;
--------------------

Which was lining it up to the center.

Whereas But4 didn't. I applied the same css to But4 and it's in the center now.

Is this the right way Matt?

View » | Reply »

]]> Sat, 05 Dec 2009 09:41:06 GMT http://www.elated.com/forums/topic/4562#post18492 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18491 From: toastyrat


Matt, once again u are spot on... Thanks so much, everything works except that it is aligning but3 in the center but isn't aligning but4 in the center... But4 is sticking to the left. here is my code:


Code:
--------------------
            <a style="float: left;" id="prev" href="#" title="Moisture Management"><span>Moisture Management</span></a>
         <div style="float: left; width: 670px; text-align: center;">
         <a id="home" href="index2.html" title="Moisture Management"><span>Moisture Management</span></a>
		 <a id="back" href="ladies.html" title="Moisture Management"><span>Moisture Management</span></a>
    	 </div>
         <a style="float: right;" id="next" href="#" title="Moisture Management"><span>Moisture Management</span></a>
         <div style="clear: both;"> </div>

--------------------


View » | Reply »

]]> Sat, 05 Dec 2009 09:33:48 GMT http://www.elated.com/forums/topic/4562#post18491 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18490 From: matt


Hi toastyrat,

If you put code tags around your text then you can line things up. (I've just added code tags to your post above.)

If I understand what you want to do then your best bet might be to place But3 and But4 inside a div with a fixed width, and use "text-align: center" on the div. Float this div left, and place it between BUTTON1 and BUTTON3, which should also be floated left. The widths of BUTTON1, your div, and BUTTON3 should add up to the width of the container.

eg if your container is 500px wide and each button is 100px wide then you might have:


Code:
--------------------
<a style="float: left;" id="button1" href="#" title="button1"><span>button1</span></a>
<div style="float: left; width: 300px; text-align: center;">
  <a id="but3" href="#" title="but3"><span>but3</span></a>
  <a id="but4" href="#" title="but4"><span>but4</span></a>
</div>
<a style="float: left;" id="button2" href="#" title="button2"><span>button2</span></a>
<div style="clear: both;"> </div>
--------------------


Not tested this but it should work!

Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Sat, 05 Dec 2009 08:53:52 GMT http://www.elated.com/forums/topic/4562#post18490 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18488 From: toastyrat


Matt thanks again for the help... One more question:

The floats are working great, but i have a bit of a challenge now. I have four buttons i need to align, 2 are on either side of the page like this:


Code:
--------------------
BUTTON1                                                                                                             BUTTON2
--------------------


So the float left and right sorts that out. But then i have the other two buttons in the middle of button1 & 2 stacked on top of one another. But 3 and 4 together make the height of the first 2 buttons.


Code:
--------------------
BUTTON1                                              But3                                                          BUTTON2
                                                             But4
--------------------


I can't get these in a straight row.

I just realised that once this is posted it doesn't show the buttons examples as i have laid them out. If u press edit it'll show them...

Sorry i know this isn't very clear, it's very difficult to explain without showing u the images. If u don't understand i'll try explain it better.

Thanks!

[Edited by matt on 05-Dec-09 02:41]

View » | Reply »

]]> Fri, 04 Dec 2009 11:30:47 GMT http://www.elated.com/forums/topic/4562#post18488 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18480 From: matt


No problem toastyrat. Feel free to ask if you need any more help!

Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 02 Dec 2009 22:18:09 GMT http://www.elated.com/forums/topic/4562#post18480 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18475 From: toastyrat


Matt you're a machine, that's very much!

View » | Reply »

]]> Wed, 02 Dec 2009 08:43:29 GMT http://www.elated.com/forums/topic/4562#post18475 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18473 From: matt


Hi toastyrat,

Do you mean the "active link" outline? You can turn it off with "outline: none":

http://css-tricks.com/removing-the-dotted-outline/

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 01 Dec 2009 19:52:52 GMT http://www.elated.com/forums/topic/4562#post18473 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post18472 From: toastyrat


I've been using this method and it's working great, but i have just found one problem that only seems to occur in Firefox and older versions of IE... When you click on the image a purple box appears around the edge of the image.

Does any one know why and how to get rid of that?

View » | Reply »

]]> Tue, 01 Dec 2009 06:58:21 GMT http://www.elated.com/forums/topic/4562#post18472 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18461 From: matt


Hi perlprofesional,

Please put code markers around your code (the top-right icon above the edit box) - it makes it much easier to read!

Couple of problems I spotted right away:

1. You shouldn't have the <html><head><script type="text/javascript"> ... </head></html> stuff around your JavaScript code in your .js file. JavaScript code files should contain pure JavaScript code - nothing else.

2. You shouldn't use double-slashes (\\) in your JavaScript if it's in a separate .js file. You only need the double-slashes if you're including the JavaScript code directly within your Perl script.

Hope that helps!
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 25 Nov 2009 23:20:48 GMT http://www.elated.com/forums/topic/4808#post18461 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18459 From: perlprofesional


Please find the modified code below. Now, once I click the EPM_value.CGI, the page with correct date is coming first time correctly. then once i give any value and click submit or enter...it is changing to $date with blank values. After that, the validation part is working properly.

I have used two new lines to load js files as below.

<script src='formvalidator.js'></script> and <body onLoad='initTable("table0");' bgcolor="#C0C0C0">

Script Name - EPM_value.CGI



Code:
--------------------
#!/usr/bin/perl -w
#Program to create EPM value addition.

#use strict;
use CGI;
use CGI::Carp qw(warningsToBrowser fatalsToBrowser);
$query=new CGI;

my $date=`date +%m/%d/%Y`;

my $original_time=$query->param('original_time');
my $new_time=$query->param('new_time');
my $saved_time=($original_time - $new_time);
my $num_of_events=$query->param('num_of_events');
my $time_reduction=($saved_time * $num_of_events * 52);
my $repeat_savings=$query->param('repeat_savings');
my $one_savings=$query->param('one_savings');
my $total_savings=($repeat_savings + $one_savings);

if ( $original_time =~ /^d+$/ && $new_time =~ /^d+$/ ){
        my $saved_time=($original_time - $new_time);
}

print "Content-type: text/html\n\n";
print <<"EOF";
<html>
<script src='formvalidator.js'></script>
<title>EPM_value_add_log</title>
<h1 align=center>EPM VALUE ADDITION LOG</h1>
<hr/>
<body onLoad='initTable("table0");' bgcolor="#C0C0C0">
<p align=center style="font-size:20px;"><b>Please Provide the Value Addition Details: <input type="button" value="Back" onClick="history.go(-1)"></p>
<form action='EPM_value_add_log.CGI' method='post' onsubmit='return formValidator()'>
<p align=center>Today's Date:$date</p>
<h3>Project Details:</h3>
<table cellpadding=20>
<tr><td><b>Project:
<select name="project_name">
<option value="NA_ASG_EFS">NA_ASG_EFS</option>
<option value="WW_ASG_IBD">WW_ASG_IBD</option>
<option value="WW_IMASG_L1">WW_IMASG_L1</option>
<option value="WW_ER_ASG">WW_ER_ASG</option>
<option value="WW_AI_HST_L1">WW_AI_HST_L1</option>
<option value="NA_ASG_RCMCL1">NA_ASG_RCMCL1</option>
<option value="NA_ASG_RCMC">NA_ASG_RCMC</option>
</td>
<td><b>Year:
<select name="year">
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
</td>
<td><b>Status:
<select name="status">
<option value="Indevelopment">Indevelopment</option>
<option value="Idea">Idea</option>
<option value="Scripted Testing">Scripted Testing</option>
<option value="Testing">Testing</option>
<option value="Implemented">Implemented</option></td>
<td><b>Originator:<input type='text' id='user'/></td>
</tr>
<tr><td><b>Team:
<select name="team">
<option value="EFS">ERS</option>
<option value="ER">ER</option>
<option value="FID">FID</option>
<option value="IBD">IBD</option>
<option value="MSID">MSID</option>
<option value="MSPA">MSPA</option>
<option value="MSPM">MSPM</option>
<option value="MM">MM</option>
<option value="R-MW">R-MW</option>
<option value="SCALE">SCALE</option>
<option value="L1">L1</option>
<option value="CRISK">CRISK</option>
<option value="Custody">Custody</option>
<option value="AAG">AAG</option>

</td>
<td><b>QTR:
<select name="quater">
<option value="QTR1">QTR1</option>
<option value="QTR2">QTR2</option>
<option value="QTR3">QTR3</option>
<option value="QTR4">QTR4</option>
</td>
<td><b>Category:
<select name="category">
<option value="Script">Script</option>
<option value="Automation">Automation</option>
<option value="Event Elimination">Event Elimination</option>
<option value="Script/Webpage">Script/Webpage</option>
<option value="Tool Development">Tool Development</option>
<option value="Webpage">Webpage</option>
<option value="Webpage Automation">Webpage Automation</option>
<option value="Webpage Script">Webpage Script</option>
<td><b>Date_Submitted:<input type='text' id='date'/> (MM/DD/YYYY)</td></tr>
</table>
<hr/>
<h3>Other Details:</h3>
<table cellpadding=10>
<tr><td><b>Time Required To Create(In Mins): <input type="text" size=3 name="req_time" id="req_time"/></td>
<td><b>Original Time/Event(In Mins): <input type="text" size=3 name="original_time" id="org_time"/></td>
<td><b>New Time/Event(In Mins): <input type="text" size=3 name="new_time" id="new_time"/></td></tr>
<td><b>Number Of Events/Week: <input type="text" size=3 name="num_of_events" id="num_events"/></td>
<td><b>Repeatable Process Savings($$$): <input type="text" size=3 name="repeat_savings" id="rep_save"/></td>
<td><b>One Time Savings($$$): <input type="text" size=3 name="one_savings"/ id="onet_save"></td></tr>
<tr><td><b>Assumed Benifit Value(Point Value): <input type="text" size=3 name="value_point" id="value_point"/></td></tr>
</table>
<hr/>
<h3>Project Description:</h3>
<textarea rows="10" cols="80"></textarea>
<h3>Benefit To Customer:</h3>
<textarea rows="10" cols="80"></textarea>
<br/><br/>
<input type="submit" value="Submit"/>
</form>
<p>Result=$saved_time, $time_reduction, $total_savings</p>
</body>
</html>
EOF
--------------------


********
.js file - formvalidator.js ,,, I have double slash (\\) in three places..........



Code:
--------------------
<html>
<head>
<script type="text/javascript">
function formValidator(){
        var user = document.getElementById('user');
        var date = document.getElementById('date');
        var req_time = document.getElementById('req_time');
        var org_time = document.getElementById('org_time');
        var new_time = document.getElementById('new_time');
        var num_events = document.getElementById('num_events');
        var rep_save = document.getElementById('rep_save');
        var onet_save = document.getElementById('onet_save');
        var value_point = document.getElementById('value_point');

        if(isAlphabet(user, "Please Enter Valid Name")){
                if(dateCheck(date, "Please Enter the Date in the Given Format")){
                        if(timeCheck(req_time, "Please Enter Time in Mins - Time Required To Create")){
                                if(timeCheck(org_time, "Please Enter Time in Mins - Original Time/Event")){
                                        if(timeCheck(new_time, "Please Enter Time in Mins - New Time/Event")){
                                                if(timeCheck(num_events, "Please Enter No. of Events")){
                                                        if(amountCheck(rep_save, "Please Enter The Amount for Repeatable Process Savings")){
                                                                if(amountCheck(onet_save, "Please Enter The Amount for One Time Savings")){
                                                                        if(timeCheck(value_point, "Please Enter The Correct Value Point")){
                                                                                return true;
                                                                        }
                                                                }
                                                        }
                                                }
                                        }
                                }
                        }
                }
        }
        return false;
}

function amountCheck(elem, helperMsg){
        var amountCalc = /[0-9\\.]/;
        if(elem.value.match(amountCalc)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}

function timeCheck(elem, helperMsg){
        var timeCalc = /^[0-9]{1,3}$/;
        if(elem.value.match(timeCalc)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus(); // set the focus to this input
                return false;
        }
        return true;
}

function dateCheck(elem, helperMsg){
        var numericExpression = /^[0-9]{1,2}\\/[0-9]{1,2}\\/[0-9]{4}$/;
        if(elem.value.match(numericExpression)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}

function isAlphabet(elem, helperMsg){
        var alphaExp = /^[a-zA-Z]+/;
        if(elem.value.match(alphaExp)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}

</head>
</html>
--------------------



Thanks.

[Edited by matt on 25-Nov-09 17:17]

View » | Reply »

]]> Wed, 25 Nov 2009 16:38:50 GMT http://www.elated.com/forums/topic/4808#post18459 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18444 From: matt


Hi perlprofesional,

It should work OK provided you use double quotes (or miss out the quotes entirely). Can you post your new code please, and I'll take a look?

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 24 Nov 2009 01:58:51 GMT http://www.elated.com/forums/topic/4808#post18444 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18443 From: perlprofesional


Hi Matt,

thanks for the info. I have created a seperate .js file and invoked it as below. It's working(form Validation) for both syntax - print <<"EOF"; & print <<'EOF'; But the called variable is not showing the value still.........instead, its showing as $date. Please assist me.

View » | Reply »

]]> Mon, 23 Nov 2009 20:19:32 GMT http://www.elated.com/forums/topic/4808#post18443 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18436 From: perlprofesional


Thanks Matt for your excellent info..let me try and get back to you.

View » | Reply »

]]> Thu, 19 Nov 2009 15:08:53 GMT http://www.elated.com/forums/topic/4808#post18436 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18434 From: matt


(I put code markers around your code to make it easier to read!)

For one thing, you have an escaping issue. For example, your JavaScript contains lines like this:


Code:
--------------------
        var amountCalc = /[0-9\.]/;
--------------------


You've escaped your dot in the JavaScript with a backslash (\). However, Perl also uses a backslash for escaping. This results in your JavaScript actually being output like this:


Code:
--------------------
        var amountCalc = /[0-9.]/;
--------------------


(Run your Perl script then view source in your web browser to see what I mean.)

The solution is to double-escape the backslash in all cases, eg:


Code:
--------------------
        var amountCalc = /[0-9\\.]/;
--------------------


Frankly though, you'd be better off moving all your JavaScript functions into separate .js files, thereby avoiding the problem altogether.

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 18 Nov 2009 23:32:48 GMT http://www.elated.com/forums/topic/4808#post18434 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18431 From: perlprofesional


It is a lengthy one, I have cut shorted few things and changed..........I have used double quotes here....form validation funtionality is not working....I have given isAlphabet function for "Originator" option to get the name without any numericals but it's just accepting everything if Iuse double quotes..no alert message.........but its showing the date value correctly.

But if I use single quotes....am alert message for getting numerical input for "Originator" but the value of date is $date.


Code:
--------------------
#!/usr/bin/perl -w
#Program to create EPM value addition.

#use strict;
use CGI;
use CGI::Carp qw(warningsToBrowser fatalsToBrowser);
$query=new CGI;

my $date=`date +%m/%d/%Y`;

print "Content-type: text/html\n\n";
print <<"EOF";
<html>
<title>EPM_value_add_log</title>
<head>
<script type="text/javascript">
function formValidator(){
        var user = document.getElementById('user');
        var date = document.getElementById('date');
        var req_time = document.getElementById('x_time');
        var org_time = document.getElementById('xx_time');
        var new_time = document.getElementById('xxx_time');
        var num_events = document.getElementById('y');
        var rep_save = document.getElementById('yy');
        var onet_save = document.getElementById('yyy');
        var value_point = document.getElementById('xyxy');

        if(isAlphabet(user, "Please Enter Valid Name")){
                if(dateCheck(date, "Please Enter the Date in the Given Format")){
                        if(timeCheck(req_time, "Please Enter Time in Mins - Time Required To Create")){
                                if(timeCheck(org_time, "Please Enter Time in Mins - Original Time/Event")){
                                        if(timeCheck(new_time, "Please Enter Time in Mins - New Time/Event")){
                                                if(timeCheck(num_events, "Please Enter No. of Events")){
                                                        if(amountCheck(rep_save, "Please Enter The Amount for Repeatable Process Savings")){
                                                                if(amountCheck(onet_save, "Please Enter The Amount for One Time Savings")){
                                                                        if(timeCheck(value_point, "Please Enter The Correct Value Point")){
                                                                                return true;
                                                                        }

                                                                }
                                                        }
                                                }
                                        }
                                }
                        }
                }
        }
        return false;
}

function amountCheck(elem, helperMsg){
        var amountCalc = /[0-9\.]/;
        if(elem.value.match(amountCalc)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}

function timeCheck(elem, helperMsg){
        var timeCalc = /^[0-9]{1,3}$/;
        if(elem.value.match(timeCalc)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus(); // set the focus to this input
                return false;
        }
        return true;
}

function dateCheck(elem, helperMsg){
        var numericExpression = /^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{4}$/;
        if(elem.value.match(numericExpression)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}

function isAlphabet(elem, helperMsg){
        var alphaExp = /^[a-zA-Z]+/;
        if(elem.value.match(alphaExp)){
                return true;
        }else{
                alert(helperMsg);
                elem.focus();
                return false;
        }
}
</script>
</head>

<h1 align=center>XXXXXX</h1>
<hr/>
<body bgcolor="beige">
<p align=center style="font-size:20px;"><b>Please Provide the XXX Details:</p>
<form onsubmit='return formValidator()'>
<p align=center>Today's Date:$date</p>
<h3>Project Details:</h3>
<table cellpadding=20>
<tr><td><b>Project:
<select name="project_name">
<option value="xx">xx</option>
<option value="xx">xx</option>
</td>
<td><b>Year:
<select name="year">
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
</td>
<td><b>Status:
<select name="status">
<option value="xx">xxx</option>
<option value="xxx">xxx</option>
<td><b>Originator:<input type='text' id='user'/></td>
</tr>
<td><b>QTR:
<select name="quater">
<option value="QTR1">QTR1</option>
<option value="QTR2">QTR2</option>
<option value="QTR3">QTR3</option>
<option value="QTR4">QTR4</option>
</td>
<td><b>Date_Submitted:<input type='text' id='date'/> (MM/DD/YYYY)</td></tr>
</table>
<hr/>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
EOF
--------------------


[Edited by matt on 18-Nov-09 17:24]

View » | Reply »

]]> Wed, 18 Nov 2009 16:55:22 GMT http://www.elated.com/forums/topic/4808#post18431 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18428 From: matt


There shouldn't be any problem with JavaScript inside tags when using the double-quote heredoc syntax. Can you post your code so I can take a look?

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 18 Nov 2009 10:38:55 GMT http://www.elated.com/forums/topic/4808#post18428 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18424 From: perlprofesional


Thanks Matt for your info. Please help me out on the below query.

Currently I am facing problem using syntax...I am using as below.

if I use --- print <<'EOF'; in CGI program --- am not able to supply variable inside HTML tags if I use single quotes .....Eg. $input (the value of $input is not displaying in HTML page.its just diplaying $input).

If I use --- print <<"EOF"; ---- If I use double quotes...the above condition is working but am not able to use Javascript inside HTML Tags........(Eg. Form Validation is not working).

I want to use both above ( need to pass Variable successfully and use Javascript for form validation).

Please help me out.

Thanks in advance.

View » | Reply »

]]> Tue, 17 Nov 2009 16:48:35 GMT http://www.elated.com/forums/topic/4808#post18424 Re: Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18418 From: matt


Hi again perlprofesional, and welcome to ELATED!

The best bet is probably to practise writing some useful database-driven Perl scripts. Once you start using CGI.pm and the DBI for real-world projects then you'll find that your knowledge expands pretty rapidly!

A great reference book for Perl in general is Programming Perl, AKA "The Camel Book":

http://oreilly.com/catalog/9780596000271

It's quite technical so I wouldn't recommend it for absolute beginners, but it sounds like you're over the first hurdles now.

Hope that helps!

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 17 Nov 2009 06:34:27 GMT http://www.elated.com/forums/topic/4808#post18418 Perl CGIDBI http://www.elated.com/forums/topic/4808/#post18415 From: perlprofesional


Hi, I am new for Perl & Perl CGI/DBI module. I have managed to learn the basics of both. Can anyone suggest how could I start my career in this. Let me know what material I can use to learn further. Thanks in advance.

View » | Reply »

]]> Mon, 16 Nov 2009 18:27:30 GMT http://www.elated.com/forums/topic/4808#post18415 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post18089 From: matt


Hi Caroline,

First question: Your font size issue is because some of your text is enclosed in paragraph (<p> ... </p>) tags and some of it isn't. eg on http://www.blascanto.com/v2-music_es.html you have forgotten to add a closing </p> tag after your Flash movie embed, causing the browser to assume that the rest of your text is inside a paragraph. Since paragraph elements have a specific font size set in the CSS then this causes text inside a paragraph to have a smaller font size to non-paragraph text:


Code:
--------------------
/*
	Standard paragraph style
*/

p
{
	color: #333;
	font-size: 0.7em;
	padding: 10px 0 10px 0;
}
--------------------


In fact, from a semantic point of view, you probably should have all your text in paragraphs, rather than separating them with <br> tags as you have done.

It also would be a good idea to go through your HTML and fix the errors, eg:

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.blascanto.com%2Ftest.html&charset=%28detect+automatically%29&doctype=Inline&group=0&user-agent=W3C_Validator%2F1.654

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.blascanto.com%2Fv2-music_es.html&charset=%28detect+automatically%29&doctype=Inline&group=0

(I know it looks like there's a lot of errors but the validator often reports several "errors" for the same problem, so they shouldn't take long to fix.)

I'd recommend fixing these problems and putting all your text in paragraphs, then you should find that the pages display OK with consistent font sizes.

As a workaround, you could move the font-size property from the 'p' rule (shown above) into the content-wrapper rule:


Code:
--------------------
#content-wrapper
{
	width: 100%;
	min-height: 200px;
	font-size: 0.7em;
}
--------------------


(Personally I would do this anyway as I prefer having a global font size.)

Second question: If you want to stop the image repeating horizontally then you need to change:


Code:
--------------------
/* Header */
#header-wrapper
{
	width: 100%;
	height: 350px;
	background-color: #333;
	background-image: url(../images/v2-index2.png);
        background-repeat: repeat-x;
}
--------------------


to:


Code:
--------------------
/* Header */
#header-wrapper
{
	width: 100%;
	height: 350px;
	background-color: #333;
	background-image: url(../images/v2-index2.png);
        background-repeat: no-repeat;
}
--------------------


Hope that helps!
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 30 Sep 2009 05:37:19 GMT http://www.elated.com/forums/topic/4566#post18089 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post18087 From: dubenko_33


Hey Matt,

Thanks for that help, it's done the trick

Though I've just found another problem that I really can't understand !!

If you look at this page :

http://www.blascanto.com/v2-music_es.html

The writing is alot bigger than on the index page (test.html)
It's like this on every new page I've made, but not on the test.html page that I've been working on. I haven't changed the css ...
If you see on the page above ^^^ the writing is big at the top of the page but not at the bottom of the page or on the right hand column

I've looked through the code but I can't see the problem ..


And also, do you know what code I would need to write to make the top image fit to every page in different web browsers. I use IE and it looks fine but my friend uses a different browser (I think it's google chrome) and he says the image is repeating, and I've checked on Mozilla and you can see it slightly repeating at one end. I've looked for a code on the internet but I can't find one to work with images.

Thanks,

Caroline

View » | Reply »

]]> Tue, 29 Sep 2009 20:12:55 GMT http://www.elated.com/forums/topic/4566#post18087 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post18082 From: matt


Hi Caroline,

You could try modifying the "header-wrapper" div tag in each page as follows:


Code:
--------------------
<div id="header-wrapper" style="background-image: url(myimage.png);">
--------------------


The 'style' attribute should override the background image set in the CSS file.

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 29 Sep 2009 12:45:14 GMT http://www.elated.com/forums/topic/4566#post18082 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post18079 From: dubenko_33


Hey Matt,

I've basically finished my new design for the site. I've been working on just one page as all the pages are going to be the same HTML etc. The problem is I want a different image on each page (the big image at the top) and the coding is in the CSS. I could try it myself but I really don't want to ruin what has already been made. Can you help me out with this please ? It would be better if the coding for the images was in the HTML and not the CSS, if that is possible ?

http://www.blascanto.com/test.html
http://www.blascanto.com/style_fresh.css

Thank you so much for your help Matt !

Caroline.

[Edited by dubenko_33 on 28-Sep-09 19:25]

View » | Reply »

]]> Tue, 29 Sep 2009 00:24:12 GMT http://www.elated.com/forums/topic/4566#post18079 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17805 From: matt


No problem, Caroline! If you have any more questions, please feel free to ask.

Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Wed, 26 Aug 2009 08:48:03 GMT http://www.elated.com/forums/topic/4566#post17805 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17803 From: dubenko_33


A BIG THANK YOU MATT, you have been a great help !!

Thank you, thank you,

Caroline.

View » | Reply »

]]> Wed, 26 Aug 2009 05:27:40 GMT http://www.elated.com/forums/topic/4566#post17803 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17794 From: matt


Hi Caroline,

Put the image as a background image in the "header" element (you seem to have deleted the CSS for this):

#header
{
width: 970px;
height: 211px;
margin: 0 auto 0 auto;
position: relative;
background-image: url(your-image-url);
background-repeat: repeat-x;
background-position: 0 100px;
}

Adjust the values as necessary...

To put an image in the content part, add an img tag inside the "content" div (or inside one of the inner divs such as "left-column" or "right-column").

To remove the whitespace you can remove the "promo-wrapper" div from the HTML (which you no longer seem to be using):

<!-- Start Promo Wrapper -->
<div id="promo-wrapper">

<!-- Start Promos & Page Title Proper -->
<div id="promo">

<h1></h1>

</div>
<!-- End Promos & Page Title Proper -->


</div>
<!-- End Promo Wrapper -->

Cheers,
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Tue, 25 Aug 2009 05:25:24 GMT http://www.elated.com/forums/topic/4566#post17794 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17792 From: dubenko_33


Thanks Matt, thats done the job

Im sorry if I am asking too much, but I really love this pagekit but its hard because there is so much information in the css.

I promise I have only 2 more questions !!

Firstly now that I have the background pattern done, where would I need to put the code for an image to be within the grey part ? And within the width of the content of the website ?

And just one simple thing, between the grey part and the word 'Noticias' there is alot of white space, which part of the code controls that ?

Thanks again

Caroline.

View » | Reply »

]]> Mon, 24 Aug 2009 18:41:28 GMT http://www.elated.com/forums/topic/4566#post17792 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17787 From: matt


Hi Caroline,

Just change:

#header-wrapper {
background-color:#333333;
background-image:url(../images/bg_floral_medium.png);
background-repeat:repeat-x;
...

to:

#header-wrapper {
background-color:#333333;
background-image:url(../images/bg_floral_medium.png);
background-repeat:repeat;
...

This will make the background repeat in all directions, not just left-to-right.

Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Mon, 24 Aug 2009 05:27:04 GMT http://www.elated.com/forums/topic/4566#post17787 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17785 From: dubenko_33


Hi Matt, Im having abit of trouble putting a background in the header part, if you look at the site :

http://www.blascanto.com/test.html

It seems that the background is only filling about half of the grey part. Ive tried to add the background to #header and h1#logo but that doesn't fill the grey part either ... where am I going wrong ??

Thanks,

Caroline.

View » | Reply »

]]> Sun, 23 Aug 2009 16:47:32 GMT http://www.elated.com/forums/topic/4566#post17785 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17784 From: dubenko_33


Yes thank you

View » | Reply »

]]> Sun, 23 Aug 2009 16:20:03 GMT http://www.elated.com/forums/topic/4566#post17784 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17783 From: matt


Hi Caroline,

Your menu is positioned on the right side of the header, so its position is controlled by the #header width (800px). The header and menu do in fact line up with your #content div. The problem is that the stuff inside your #content div (#left-column-page and #right-column) don't add up to 800px (inc padding/spacing).

So to solve the problem, increase the widths of #left-column / #left-column-page and #right-column until they are wide enough to fill your whole #content area.

Did that make sense?!
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Sun, 23 Aug 2009 16:18:54 GMT http://www.elated.com/forums/topic/4566#post17783 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17782 From: dubenko_33


Hi Matt, thanks for the help, its great.

One last thing can you tell me which part of the code if for the position of the menu at the top because it doesnt seemed to have lined up with the rest of the site on the right hand side. What do I need to change in the code ?

And about the header image, which part of the code needs to be changed to make it in line with the site with the new dimensions, I think Ive set it to 800px wide

Thanks again,

Caroline.

View » | Reply »

]]> Sun, 23 Aug 2009 15:36:47 GMT http://www.elated.com/forums/topic/4566#post17782 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17781 From: matt


Hi Caroline,

To change the overall width of the page content you'll need to adjust the following values:

#header
{
width: 970px;

#promo
{
width: 970px;

#content
{
width: 970px;

#footer
{
width: 970px;

Once you've done that then you'll need to alter the widths of the elements within the page so that everything fits nicely into the new page width:

div.promo-item
{
float: left;
width: 290px;

div#left-column
{
width: 290px;

div#middle-column
{
width: 290px;

div#right-column
{
width: 310px;

That's for the homepage. The inner pages work in a similar way.

If you want a header image that fills the entire browser window then you're either going to have to make a very wide image (say, over 2000 pixels wide) or repeat the image. Either way you'll probably want to place it as a background image of the #header-wrapper element:

#header-wrapper
{
width: 100%;
height: 211px;
background-color: #333;
background-image: url(../images/header_bg.gif);
background-repeat: repeat-x;
}


You might need to remove the background image from the #header element too:

#header
{
width: 770px;
height: 211px;
margin: 0 auto 0 auto;
position: relative;
background-image: url(../images/header_bg_internal.gif);
background-repeat: repeat-x;
background-position: 0 100px;
}

Link colours: this is due to a bug in the PageKit:

a:hover
{
color: #000000;
font-size: 1.0em;
text-decoration: underline;
}


a:visited
{
color: #88ca35;
font-size: 1.0em;
text-decoration: none;
}

To fix the problem, swap these 2 rules around:

a:visited
{
color: #88ca35;
font-size: 1.0em;
text-decoration: none;
}


a:hover
{
color: #000000;
font-size: 1.0em;
text-decoration: underline;
}


Hope that helps!
Matt

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Sun, 23 Aug 2009 08:20:30 GMT http://www.elated.com/forums/topic/4566#post17781 Re: 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17780 From: dubenko_33


Another thing that I can't seem to fix is the links in the main text. They don't seem to change color when you hover the mouse on them, but in the CSS the hover color is set to black.

View » | Reply »

]]> Sun, 23 Aug 2009 03:41:01 GMT http://www.elated.com/forums/topic/4566#post17780 'Fresh' Pagekit Problem http://www.elated.com/forums/topic/4566/#post17779 From: dubenko_33


Hi, Ive decided that I want to have a new style for my site and I decided to use the fresh pagekit, Ive already changed some things around but because there is abit of editing required in the CSS Im struggling with other things.

What I would like to change is the width of the page, but not the background parts i.e. the grey and the white

And I would also like to put an image in the 'whole' of the grey part (until I resize the width of the page ^^^) apart from the menu at the top

Here is the page :
www.blascanto.com/test.html

CSS :
www.blascanto.com/style_fresh.css

THANKS in advance

Caroline

View » | Reply »

]]> Sun, 23 Aug 2009 03:05:39 GMT http://www.elated.com/forums/topic/4566#post17779 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post17769 From: matt


You're welcome - glad it worked

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Sat, 15 Aug 2009 03:32:24 GMT http://www.elated.com/forums/topic/4562#post17769 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post17768 From: toastyrat


Hey Matt

Thats great! Thanks so much. All working really well.

View » | Reply »

]]> Fri, 14 Aug 2009 21:54:42 GMT http://www.elated.com/forums/topic/4562#post17768 Re: Question from tutorial http://www.elated.com/forums/topic/4562/#post17767 From: matt


Floats should do the trick:

<a style="float: left;" id="emailUs" href="#" title="Email Us"><span>Email Us</span></a>
<a style="float: left;" id="anotherButton" href="#" title="Another Button"><span>Another Button</span></a>
<div style="clear: both;"> </div>

Does that help?

Glad you liked the tut

--
Matt Doyle
ELATED - Helping people make websites since 1997!
http://www.elated.com/

View » | Reply »

]]> Fri, 14 Aug 2009 14:57:54 GMT http://www.elated.com/forums/topic/4562#post17767