|
HTML - Onchange Problems
I have some problems making a converter on my site, so I thought to post here. I think it would be better for me to include the scripts.
For example, <FONT SIZE=+1>F: </FONT><INPUT type="text" name="F" value="32" onChange="C.value = (this.value - 2 )"> <FONT SIZE=+1>C: </FONT><INPUT type="text" name="C" value="0" onChange="F.value = (this.value + 2)"> <BR><FONT SIZE=+1>O: </FONT><INPUT type="text" name="O" value="0" onChange=" ???" > If I want to include another onChange property for the "C:" script, like say on change, O.value =(this.value * 2), how do I include this inside the C: string? Also, if I want O: value to be of a certain value (eg. 50) when C.value is 10, what should I put inside the O: script and C: script? Thank you in advance Similar TutorialsI have very simple HTML with javaScript as below, I don't know why there is a error, can you help me? Code: <HTML>
<HEAD>
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
<SCRIPT language="javascript">
function add(type) {
//Create an input type dynamically.
var element = document.createElement("input");
//Assign different attributes to the element.
//element.setAttribute("type", type);
//element.setAttribute("value", type);
//element.setAttribute("name", type);
var foo = document.getElementById("fooBar");
//Append the element in page (in span).
foo.appendChild(element);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<H2>Dynamically add element in form.</H2>
Select the element and hit Add to add it in form.
<BR/>
<SELECT name="element" onChange="add("button")">
<OPTION value="button">Button</OPTION>
<OPTION value="text">Textbox</OPTION>
<OPTION value="radio">Radio</OPTION>
</SELECT>
<INPUT type="button" value="Add" onclick="add(document.forms[0].element.value)"/>
<span id="fooBar"></span>
</FORM>
</BODY>
</HTML>
I am very new to using PHP, so the question is: Have an existing HTML web page which has a call to a PHP file to send out email using the form tag and on submit. Wrote a PHP file to get a variable from HTML page, query mysql database and would like to send information back to existing HTML and refresh the HTML page. Is it possible to call this PHP file from the OnChange of the input tag of the variable from HTML page. If not, how can it be called? this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html there are several things I would like to happen. 1. the right collumn background to be where the right collumn should be(so other links in navbar) 2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see) 3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does. 4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle. 5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns? don't worry about the colors I will be changing them soon Hi Folks, I've got my form dynamically generating text fields (which are contained in a form which is in another) and other objects and now I want to give them the "onchange" attribute. I have a lot of code so I'll keep it as small as possible. Here is the function that generates text fields function createText( inputForm, txtName, txtValue, txtWidth ) { var newTxt = document.createElement( "INPUT" ); inputForm.appendChild( newTxt ); newTxt.name = txtName; newTxt.setAttribute( "STYLE", "position:relative; left:20px; width:" + txtWidth + "px;"); newTxt.type = "TEXT"; newTxt.value = txtValue; newTxt.id = txtName; newTxt.onchange = "some_function( this.value )"; return newTxt; } The function for responsible for creating the form is: function createNewForm() { // Main form is a global reference to the main body mainForm = document.getElementById( "adminForm" ); var profileForm = document.createElement( "FORM" ); mainForm.appendChild( profileForm ); profileForm.method = "POST"; profileForm.name = "Profile"; profileForm.id = "ProfileForm"; return profileForm; } This function calls the profile creation form and specifies the objects that will appear on the form. function profileForm() { // Delete and reassign current form if( currentForm != "") deleteForm( currentForm ); currentForm = "ProfileForm"; var newProForm = createNewMenuForm(); newProForm ( menuForm, "Item1", "data1", 140 ); newProForm ( menuForm, "Item2", "data2", 140 ); newProForm ( menuForm, "Item3", "data3i", 140); return newProForm; } I've seen examples of objects being created by JavaScript and they work just fine. Anyone have any suggestions or have an idea where I can find some more info? Thanks! Hi, I have a problem with validating Strict XHTML 1.0 ... The tag: "option" doesn't have an attribute: "onchange" in currently active versions.[XHTML 1.0 Strict]... Is there a way around this? Here's the code:. <select name="birth_month" onchange="form_d('yes');" size="1" style="width:8em"> <option<?php echo empty($a_birth_month)?' selected="selected"':''?> value="" onchange="form_d('yes');" >Month</option> Thanks Only another million pages to go. OK, so, this is realy starting to bug me, i have spent an hour maby 2 on this but nothing has worked, the problem is that i want an inner LEFT side bar and a RIGHT side content box inside a box on the right, if you dont get what i mean, the website is http://brett.unixpod.com/test/index.html And the CSS stylesheet http://brett.unixpod.com/test/css/home.css ok, the text and stuff that is circled in white, i want moved up so that it is aligned with the text on the left, I want the stuff in the circle moved to the top of the big box its in, falong with that little box of text I WANT THE STUFF IN THE CIRCLE MOVED TO THE TOP OF THE BIG BOX ITS IN, ALONG WITH THAT LITTLE BOX OF TEXT Hi, I am facing some problem. I am currently doing a html template. But I don't seem to be able to solve the gap problem I am facing (View my snapshot), can anyone help me? Thanks alot! Snapshot file: http://i49.tinypic.com/3t3eo.jpg HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles.css" rel="stylesheet" type="text/css">
<title>Darren Ng - Future Pilot</title>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo">
<h1><a href="index.html"><span>Darren's</span> Website</a></h1>
<table><tr> <ul id="menu">
<li><a class="current" href="#">Home</a></li>
<li><a href="#">Practice</a></li>
<li><a href="#">Attorneys</a></li>
<li><a href="#">Accidents</a></li>
<li><a href="#">News</a></li>
<li><a href="#">About Us</a></li>
</tr></table></div>
<div class="clr"></div>
</div>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<td align="center" valign="middle"><table width="1000" height="550" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td width="1000" height="360" align="center"><img src="images/header.gif" width="1000" height="360" hspace="0" vspace="0" border="0" align="top" usemap="#MapMap"></td>
</tr>
CSS File: Code: body {
font: .74em Tahoma, Verdana, Sans-Serif, Arial;
color: #7f7f7f;
background-image: url('images/bodypixel.gif');
background-repeat: repeat;
}
h1 { font: normal 5em "Trebuchet MS", Helvetica, Arial; }
p { margin: 0 0 15px; line-height: 1.6em; }
a { outline: 0; color: #304D6F; text-decoration: none; }
li { list-style: none; }
li a, img { display: block; }
img { outline: 0; border: 0; }
#wrapper { width: 984px; margin: auto; }
.clr { clear: both; }
#logo { float: left; padding: 30px 15px; }
#logo h1 a { color: #fff; }
#logo h1 a span { color: #808080; }
#menu { height: 44px; padding: 5px 0 0 4px; }
#menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
#menu li a { color: #888; margin: 0 50px 0 0; }
#menu li a:hover { color: #fff; }
#menu li a.current { color: #fff; }
Hey guys I have coded my site and so far it works fine in IE7 and IE6 but IE5.1 it not center in the page the nav has moved to the top of the page. See screenshots. Whats wrong with IE5.1 to make my site move so much and how do I fix the problem. Cheers EDIT: Sorry guys the screenshot below with the site off to the left is IE5.1 take a look at this and can anyone tell be why it does this in ie it look fine in firefox and safari http://nathanoconnor.co.uk/kartingchampionships/site/ thanks Hi everyone, I recently landed myself a job as a web manager. It's been a long time since I done it however, as I've had children to bring up and so on - i'm a bit rusty but getting through it okay. I've hit a snag however and I'm wondering if anyone can help me... The website i'm charged with watching over works completely fine bar one problem, and its not even a big problem - just a bit annoying. One of the images, when opened in Chrome, floats to the left when it is supposed to be central. This is the only image to do this on the website in any browser. Has anyone got any tips for me? Can anyone suggest how i fix the problem i have here with IE? HTML Code: <body> <div id="container"> <div id="header"> <img src="images/thePlacePromotion.jpg" alt="The Place Promotion Agency for Gloucestershire" width="960" height="80" /> </div> <div id="middle"> <a href="http://www.glosfirst.co.uk"><img src="images/Middle.jpg" alt="We're building a new website, meanwhile here's a link to the current Gloucestershire First website." width="960" height="578" border="0" /></a> </div> <div id="bottom"> <a href="http://www.glosfirst.co.uk"><img src="images/slogan.jpg" alt="We're building a new website, meanwhile here's a link to the current Gloucestershire First website." width="960" height="80" border="0" /></a> </div> </div> </body> CSS is: Code: body {
background-color: #96be3f;
}
#container {
width: 970px;
background-color: #96be3f;
height:auto;
margin: auto;
}
#header {
width: 960px;
padding: 20px auto;
margin: auto;
}
#middle {
width: 960px;
height: 567px;
margin: auto;
}
#bottom {
width: 960px;
height: 80px;
margin: auto;
}
the top header on IE is over to the right! Thanks Hurley I am very new to html editing but trying to work my way around. I have made my website in Dreamweaver and everything looks correct on dreamweaver and on firefox but when opened in IE, everything on my page becomes centered an underlined. The first item on the page is centered and underlined but the coding ends there. Not sure what I did wrong. Thank you in adavance for any help. My OS is windows 7 64bit and have installed: - internet explorer 9 - Mozilla Firefox - Google Chrome My website is getting displayed correctly on Firefox and Chrome but is a bit of a mess on IE9 If you could have a look and let me know if there is anything I could do, would be much appreciated. Here is one page of my site that is bothering me: http://www.dashony.com/Solar%20panel...0projects.html Please check out the white menu, ( SpryMenuBarVertical ) using IE and one of the other 2. Thanks! Hi The bit of coding below works fine in firefox and ie 5 and older it does not show right in ie 6 and 7 Please can someone tell me how to fix this bug. <td align="left" valign="top" bgcolor="#E7EEF5"><ul type="square" class="style2"> <li class="style3">Ground Training, starting and schooling young horses</li> <li class="style3">Re-schooling and corrective training to overcome behavioural and physical problems</li> <li class="style3">Rehabilitation following injury or illness</li> <li class="style3">Training for horse and rider at all levels and disciplines</li> <li class="style3">Re building confidence between horse and rider</li> <li class="style3">Re-training race horses</li> </ul> </td> <td align="left" valign="top" bgcolor="#E7EEF5"><ul type="square" class="style2"> <li class="style3">Competition preparation</li> <li class="style3">Advanced Equine Dental Technician</li> <li class="style3">Tellington Touch (TTeam) Groundwork and bodywork</li> <li class="style3">McTimoney Manipulation</li> <li class="style3">Equine Sports Therapy</li> <li class="style3">Massage, Stretching and Bodywork classes for horse owners</li> </ul> </td> here is where my problem is. In ie the hover effect does not work, but in firefox it does! help. Let me state my problem. Under my links which is under the banner, it says My Tickets, and User it seems in Internet Explorer it shows an extra 2px border on the bottom. Something to do with the height I assume. Now in firefox there is a 10px gap in between the Ticket Deck banner and the Links Bar. Also I can't keep to get the copyright centered for some reason :s . Here is the html: Code: <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html><head><title>Ticket Deck v. 1.0 beta</title>
<link href='index.css' rel='stylesheet' type='text/css' />
<body>
<div id='header'>
<div id='tlogo'><div id='logo'></div></div>
<div id='links'>
<ul>
<li><a href='#'><img src='images/linksmy.gif' width='91' height='25' alt='My Tickets'></a></li>
<li><a href='#'><img src='images/linksuser.gif' width='83' height='25' alt='User Area'></a></li>
</ul>
</div>
</div>
<br />
<div id='memberbar'>
<div id='textmargin1'>
test
</div>
</div>
<br/>
<div id='container'>
<div id="content">Welcome to Ticket Deck's Ticket System. What is listed below is your ticket's summary clicking on the subject title will
bring you directly to your ticket.<br/>
<div id="tickets"><div id="tbar"><div id="textmargin">Ticket Summary</div></div>
<div id="tcontain">
<table width='100%' cellpadding='3' cellspacing='1' id='toutline'>
<tr>
<th width='5%'>id</th>
<th width='30%'>Subject</th>
<th width='10%'>Priority</th>
<th width='23%'>Starter</th>
<th width='15%'>Status</th>
<th width='10%'>Dept #</th>
</tr>
<tr>
</table>
</div>
<br/>
<center>Welcome Guest! Please login to view your tickets!</center>
</div>
</div>
<div id="nav"><div id="navbar"><div id="textmargin">Login</div></div>
<div id="textmargin">
Username: <br/>
<input type="text" name="username" size="25" /><br />
Password: <br/>
<input type="text" name="username" size="25" /><br /><br />
<input type="hidden" name="do" value="new">
<center>
<input type="submit" name="Submit" value="Login" />
<input type="reset" name="reset" value="Reset" /><br/>
</center>
</div>
<div id="navstrip"><div id="textmargin">Ticket Statistics</div></div>
lovely stats here
<br/>
<div id="navstrip"><div id="textmargin">Ticket Statistics</div></div>
Update: Ticket Deck re
</div>
<div id="copyright">
<center>Powered by <a href="#">Ticket Deck</a> v. 1.0 Beta 1</center>
</div>
</div>
</div>
</body>
The CSS Code: body {
background: #f8f8f8;
color: #8a6600;
font: 12px verdana, arial, sans-serif;
margin: 0px;
padding: 0px;
}
a img {
border:0;
}
div#tlogo {
background-image: url(images/tlogo.gif);
width: 100%;
height: 25px;
}
div#logo {
background-image: url(images/logo.gif);
width: 197px;
height: 25px;
margin-left: 25px;
}
div#links {
height: 25px;
min-height: 25px;
width: 100%;
background-image: url(images/linksbg.gif);
padding: 0;
margin-top: 1px;
}
div#links ul {
list-style:none;
}
div#links ul li {
float:left;
}
div#header {
height: 51px;
}
div#container {
color: #ebba34;
height: 200px;
min-height: 100%;
width: 830px;
margin: auto;
}
* html #container {
height:100%;
}
*html #copyright {
position: absolute;
bottom: 0px;
}
div#date {
margin-right: 10px;
float:right;
}
div#nav {
color: #1b90b7;
border: 1px solid #61a5b9;
float: left;
width: 220px;
background: #e5f9ff;
}
div#navbar {
border: 1px solid #61a5b9;
width: 216px;
color: #1b90b7;
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
height: 23px;
background-image: url(images/nav.gif);
}
div#navstrip {
width: 100%;
background-image: url(images/nav.gif);
height: 23px;
border-top: 1px solid #1b90b7;
border-bottom: 1px solid #1b90b7;
}
div#textmargin {
margin-left: 2px;
margin-top: 4px;
}
div#textmargin1 {
margin-left: 2px;
margin-top: 6px;
}
div#tickets {
background: #ffebb3;
width: 602px;
border: 1px solid #e8af3a;
float: right;
}
div#tbar{
width: 598px;
background-image: url(images/t_bar.gif);
height: 23px;
border: 1px solid #e8af3a;
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
}
div#tcontain{
width: 599px;
height: 18px;
margin-left: 1px;
margin-right: 1px;
}
div#content {
width: 602px;
color: #8a6600;
float: right;
}
div#memberbar {
color: #1b90b7;
style: bold;
width: 80%;
height: 28px;
background: #e5f9ff;
border: 1px solid #61a5b9;
margin:auto;
}
div#toutline {
border: 1px solid #cde1ed;
}
#copyright {
text-align: center;
height:20px;
position: absolute;
bottom: 0px;
position: bottom;
}
table,
tr,
td {
background: transparent;
font-size: 12px;
font-family: verdana, arial, sans-serif;
}
table th {
background: #fadc89;
font-size: 12px;
font-family: verdana, arial, sans-serif;
font-weight: normal;
text-align: left;
padding: 2px;
}
table th a {
color: #003E67 !important;
text-decoration: none;
}
Any help is appreciated . I know that this isn't valid xhtml I haven't gone that far in fixing it to make it valid, just trying to fix the obvious problems. Thanks, Brian I recently bean using ssi instead of frames and i now have an issue... I do not know how to keep the menubar on the left hand side at the top... see as my page streaches it centers itself in the midle of the screen... i am using tables to create a framelike effect without the issues that frames create |
|||||||