|
HTML - Calculations Based On User Input
Dear expert (Ok, i am new to this and should maybe not address this as a letter )
I hope someone can help me ... this is what i want to achieve (I am using frontpage) I want to create a table (this i can do!) that require a user input (number of guests). It then has SEVERAL options: - Select an option from a drop down list, and a price is then loaded from somewhere to create a total for that option and display it in the table (And keep that total for adding later) - Check a box, and if checked it creates a further calculation, displaying and storing the number for further calculation. a number of the above options, and a grand total on the bottom. I found more or less a page on a site that does what i am looking for, but after looking at the code, i have even LESS of an idea how it works Can someone PLEASE help me, or point me in the right direction? (I am not looking for someone to just write the code for me, as this will not teach me anything, and i want to learn) Below is a link to the example .. http://www.ouma-se-kombuis.co.za/test.html Thank you! Similar TutorialsHi again! I am thinking of another project. I wanted to make/remake our software user manual in HFLM file. I want its file size to be small as possible, so I do not want to use CMS. How should I accomplish it. I want to use a temple with all the links in the header. Your comments and suggestions are highly appreciated. Thanks a lot. This might have already been answered but I need html code for this. "User input field" redirects to www.website.com/"user input".aspx Simple I think but I am going crazy trying to get it to work. I would like it to open to the page not a frame. Thanks Pete Hello, I am trying to create a page where the user can select four of their best skills and put in their past experience (in years) in previously defined boxes and have that automatically update the "results." But, i need the results to be filterable to match the top three skills exactly. So i put in skils A,B,C,D and i get results of jobs that "match" A,B,C. I have created a javascript for show/hide but i dont know how to add this updatable/filterable content. Here is a demo of my page Quote: <html> <head> <script type="text/javascript"> <!-- function experience(element_id) { var results = document.getElementById(element_id + "_Results"); var element = document.getElementById(element_id); results.value = element.value; } </script> <script> function showhide(id){ if (document.getElementById){ obj = document.getElementById(id); if (obj.style.display == "none"){ obj.style.display = ""; } else { obj.style.display = "none"; } } } </script> <title></title> </head> <body> <form name="compass"> <table border="1" width="100%"> <tr> <td colspan="2">Top Competencies</td> </tr> <tr> <td><select name="competencies"><option value="Setting Direction">Setting Direction</option><option value="Leadership Courage">Leadership Courage</option><option value="Creating the Environment">Creating the Environment</option><option value="Building and Maintaing Relationships">Building and Maintaining Relationships</option><option value="Developing for the Future">Developing for the Future</option><option value="Organizational Savvy">Organizational Savvy</option><option value="Achieving Measurable Results">Achieving Measurable Results</option> <option value="Customer Focus">Customer Focus</option> <option value="Ethics and Integrity">Ethics and Integrity</option> <option value="Composure">Composure</option> <option value="Personal Learning">Personal Learning</option> <option value="Dealing with Ambiguity">Dealing with Ambiguity</option> <option value="Decision-Making">Decision-Making</option> <option value="Interpersonal Savvy">Interpersonal Savvy</option> <option value="Results Oriented">Results Oriented</option> </select></td> <td><select name="competencies"><option value="Setting Direction">Setting Direction</option><option value="Leadership Courage">Leadership Courage</option><option value="Creating the Environment">Creating the Environment</option><option value="Building and Maintaing Relationships">Building and Maintaining Relationships</option><option value="Developing for the Future">Developing for the Future</option><option value="Organizational Savvy">Organizational Savvy</option><option value="Achieving Measurable Results">Achieving Measurable Results</option> <option value="Customer Focus">Customer Focus</option> <option value="Ethics and Integrity">Ethics and Integrity</option> <option value="Composure">Composure</option> <option value="Personal Learning">Personal Learning</option> <option value="Dealing with Ambiguity">Dealing with Ambiguity</option> <option value="Decision-Making">Decision-Making</option> <option value="Interpersonal Savvy">Interpersonal Savvy</option> <option value="Results Oriented">Results Oriented</option> </select></td> </tr> <tr> <td><select name="competencies"><option value="Setting Direction">Setting Direction</option><option value="Leadership Courage">Leadership Courage</option><option value="Creating the Environment">Creating the Environment</option><option value="Building and Maintaing Relationships">Building and Maintaining Relationships</option><option value="Developing for the Future">Developing for the Future</option><option value="Organizational Savvy">Organizational Savvy</option><option value="Achieving Measurable Results">Achieving Measurable Results</option> <option value="Customer Focus">Customer Focus</option> <option value="Ethics and Integrity">Ethics and Integrity</option> <option value="Composure">Composure</option> <option value="Personal Learning">Personal Learning</option> <option value="Dealing with Ambiguity">Dealing with Ambiguity</option> <option value="Decision-Making">Decision-Making</option> <option value="Interpersonal Savvy">Interpersonal Savvy</option> <option value="Results Oriented">Results Oriented</option> </select></td> <td><select name="competencies"><option value="Setting Direction">Setting Direction</option><option value="Leadership Courage">Leadership Courage</option><option value="Creating the Environment">Creating the Environment</option><option value="Building and Maintaing Relationships">Building and Maintaining Relationships</option><option value="Developing for the Future">Developing for the Future</option><option value="Organizational Savvy">Organizational Savvy</option><option value="Achieving Measurable Results">Achieving Measurable Results</option> <option value="Customer Focus">Customer Focus</option> <option value="Ethics and Integrity">Ethics and Integrity</option> <option value="Composure">Composure</option> <option value="Personal Learning">Personal Learning</option> <option value="Dealing with Ambiguity">Dealing with Ambiguity</option> <option value="Decision-Making">Decision-Making</option> <option value="Interpersonal Savvy">Interpersonal Savvy</option> <option value="Results Oriented">Results Oriented</option> </select></td> </tr> <tr> <td colspan="1"><input type="text" name="1" size="100%" value="Consulting to senior leadership" disabled></td> <td colspan="1"><input type="text" id="Requirements1" name="Requirements" onChange="experience('Requirements1')" value="Enter Years"></td> </tr> <tr> <td colspan="1"><input type="text" name="2" size="100%" value="Equal Employment Opportunity (EEO) and related human resource practices" disabled></td> <td colspan="1"><input type="text" id="Requirements2" name="Requirements" onChange="experience('Requirements2')" value="Enter Years"></td> </tr> <tr> <td colspan="1"><input type="text" name="3" size="100%" value="Recruiting with a large company" disabled></td> <td colspan="1"><input type="text" id="Requirements3" name="Requirements" onChange="experience('Requirements3')" value="Enter Years"></td> </tr> <tr> <td colspan="1"><input type="text" name="4" size="100%" value="Leadership and management" disabled></td> <td colspan="1"><input type="text" id="Requirements4" name="Requirements" onChange="experience('Requirements4')" value="Enter Years"></td> </tr> <tr> <td colspan="1"><input type="text" name="5" size="100%" value="Recruiting for diverse functional areas" disabled></td> <td colspan="1"><input type="text" id="Requirements5" name="Requirements" onChange="experience('Requirements5')" value="Enter Years"></td> </tr> <tr> <td colspan="4">Results</td> </tr> <tr> <td colspan="1"><div style="display:;" id="script"><input type="text" name="1" size="100%" value="Consulting to senior seadership" disabled></td> <td colspan="1"><input type="text" id="Requirements1_Results" name="Requirements1_Results" disabled></td> </tr> <tr> <td colspan="1"><div style="display:;" id="script2"><input type="text" name="2" size="100%" value="Equal Employment Opportunity (EEO) and related human resource practices" disabled></td> <td colspan="1"><input type="text" id="Requirements2_Results" name="Requirements2_Results" disabled></td> </tr> <tr> <td colspan="1"><input type="text" name="3" size="100%" value="Recruiting with a large company" disabled></td> <td colspan="1"><input type="text" id="Requirements3_Results" name="Requirements3_Results" disabled></td> </tr> <tr> <td colspan="1"><input type="text" name="4" size="100%" value="Leadership and management" disabled></td> <td colspan="1"><input type="text" id="Requirements4_Results" name="Requirements4_Results" disabled></td> </tr> <tr> <td colspan="1"><input type="text" name="5" size="100%" value="Recruiting for diverse functional areass" disabled></td> <td colspan="1"><input type="text" id="Requirements5_Results" name="Requirements5_Results" disabled></td></div> </tr> <p><a href="#" onclick="showhide('script'); return(false);">hide again</a></p> </table> </form> </body> </html> That is the page, i know it looks long and codey but its just because it has many examples. I really would appreciate any help! Thanks so much for all your past help guys/gals Hello.... I have a problem today and I do not know how to over come this problem. If this is in the wrong place, please tell me and I will put it in the right place. Anyway. Today I am trying to make a webpage, where the user, the admin, is able to edit the page to input text. Almost like when you make a blog post and you have a text box and you type what you want and you click submit or post and it goes onto a page. Almost like wordpress. I want to make a custom page from the ground up where there are different divisions of the page and the admin can input or edit text/pictures at anytime. Thank you in advance. I am struggling to modify the code below, I am trying to take the input of a test box and us it as a filter for my list,, <FieldRef Name="ID"/> </OrderBy> <Where> <Contains> <FieldRef Name="Cust_x0020_Part_x0020_No"/> <Value Type="Note">xxxxxxxx</Value> </Contains> </Where> </Query></View></ListViewXml> I need to make xxxxxxxx a variable string any help will be much appreciated Okay so I want to make an input where a user (me) can input coding and then it will post it in another place but it will display in the site as not coding but just will execute the code....how would I go about doing this? Thanks for any help! (I'm trying to make a simple blog for my site but don't want to have to recode the entire page for each post individually. I would love to be able to just enter in one post's coding then it will display...I just assumed it's possible? Because of HTML code previewers out there.) Hello all! This is my first post here and after getting little to no help from Yahoo answers I decided to go where the pros are. I want to thank everybody in advance for taking the time to read my question and offer any help. I also want to say that I am not looking for somebody to do the work for me...just point me in the right direction to get started on figuring it out myself. You know...give a man a fish....blah blah blah. Now for my question: I am building a simple HTML template for a friend to use on an auction site. My friend has absolutely no idea of how to edit HTML so to make it easier for her, I want to add forms that will allow her to input her information (item description, shipping and payment terms) and have it applied to the template in the correct place. I had already received a snippet of code from a helpful fellow that will turn anything typed into the fields into HTML for her to copy and paste. The problem with it though is that it has no format and I cannot figure how to get it to display the code inside of the template I made. I did a little tweaking of what I had to get the basic setup of the forms and such, but cannot figure out how to place the information from each textarea into the template. I have done a few hours of research trying to find the answer, but keep coming up empty handed because I have no idea where to even start looking for the answer. Can it be done with HTML or will I have to use another language? (This will be done from her computer so from my understanding php and any other server side stuff will not work.) The code I'm wanting to use (if possible) is attached as "Formcode.txt". The template I want to use it in is attached as "Template v1.3.txt". The forms do not necessarily need to be placed at those locations but the output needs to be there. Thank you all so much for taking the time to help! BTW, I know that there are tons of free WYSIWYG editors out there that she could download and use but this has bugged me to the point that I have to find the solution. This seems like an easy question, but what's the correct way to get user input and submit to a function? I'm able to get it to work like the following, but it doesn't seem like the 'right' way to do things: Code: <form name="some_name" action="doesnt-exist.php" onSubmit="return some_function()"><input type="text" name="query" /></form> And then I catch the variable in some_function() and return false so the page doesn't try to contact doesnt-exist.php. Then I'm able to use the input for my function. Like I said, this works, but is there a cleaner, more standard way? Thank you! Hi, I've developed an estimating program on openoffice calc.. Now I would like to put this on my website. I have converted it to html and uploaded it to site. The links work but the user input's, nor the calculations do not work. Here are my questions: 1. Can I even do what I'm trying to do? 2. Are there special html calc. codes that I should be using instead? 3. If there are, where can I find them. 4. Is there a way of displaying my estimator as a standalone. In other words, it doesn't look like a spreadsheet. (columns,rows,cells,etc.) Any help would be appreciated. Thanks Hi Experts! I have a very clear idea of what I want my html/JavaScript to do, but absolutely no idea how to accomplish it... so I'm really counting on your help! Here is the challenge: I have two text boxes. I want people to be able to type numbers in the first box, and while they type in the first box, I need the second box to immediately display the same number typed in the first box, but multiplied by 4. Is it possible to write a code that would perform such calculation in real-time? I'd greatly appreciate your help! Please help. This is what I have so far http://bartletagency.com/m/x2.php Now, obviously with business cards there many different options. I need something to calculate on the side the total after picking each drop box option, or if easier, after hitting "calculate total." (preferably with the numbers in a table so I can make it appear by itself right underwear the send button) . Example: 1000 business cards in blue, say, would need to come up at 50 dollars if they pick 3-1, but if they pick 3-22 it needs to come up 60 dollars if they pick the other color, green, and pick 3-1, the label would need to turn to $55.00, if they pick 3-2 with the color green the label would need to say $65.00 how can i do this please? here is the code I have which made up the PHP file i linked you to above. code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"> <html> <head> <title>Lesson 3</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <?php if ($_SERVER['REQUEST_METHOD'] != 'POST'){ $me = $_SERVER['PHP_SELF']; ?> <h1 align="center">Business Cards</h1> <form name="form1" method="post" action="<?=$me?>"> <table border="0" align="center" cellpadding="5" cellspacing="0"> <tr> <td align="right" valign="middle">Quantity:</td> <td><select name="Quantity: "> <option value="1000">1000</option> <option value="2500">2500</option> <option value="5000">5000</option> <option value="10,000">10,000</option> </select> </td> </tr> <tr> <td align="right" valign="middle">color</td> <td><select name="color"> <option value="blue">blue</option> <option value="green">green</option> </select> </td> </tr> <tr> <td align="right" valign="middle">3</td> <td><select name="3"> <option value="small">3-1</option> <option value="medium">3-2</option> </select> </td> </tr> <tr> <td> </td> <td><input type="submit" name="Submit" value="Send"> </td> </tr> </table> </form> <?php } else { error_reporting(0); // initialize a array to //hold any errors we encounter $errors = array(); // test to see if the form was actually // posted from our form $page = $_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF']; if (!ereg($page, $_SERVER['HTTP_REFERER'])) $errors[] = "Invalid referer<br>\n"; // check to see if a name was entered if (count($errors)>0) { foreach($errors as $err) echo "$err<br>\n"; echo "<br>Please use your browser's Back button to fix."; } else { // no errors, so we build our message switch($_POST['color']){ case 'red': $recipient = 'mathew420@gmail.com'; break; case 'green': $recipient = 'mathew420@gmail.com'; break; case 'blue': $recipient = 'mathew420@gmail.com'; break; default: $recipient = 'mathew420@gmail.com'; } $subject = "Widget On Line Order"; $from = stripslashes($_POST['Name']); $msg = "Message sent by $from\n"; $msg.="\nSize: ".$_POST['size']; $options=$_POST['options']; $msg.="\nOptions:"; if ($options) for ($i=0;$i<count($options);$i++) $msg.= "\n- $options[$i]"; else $msg.="\n- None"; $msg.="\nColor: ".$_POST['color']; $extension=($_POST['extension'])?"Extension: Yes":"Extension: No"; $wallmount=($_POST['wallmount'])?"Wallmount: Yes":"Wallmount: No"; $deskmount=($_POST['deskmount'])?"Deskmount: Yes":"Deskmount: No"; $msg.="\n$extension\n$wallmount\n$deskmount"; $msg.="\n".stripslashes($_POST['MsgBody'])."\n"; if (mail($recipient,$subject,$msg)){ echo "<p>Thanks for your order!</p>"; echo nl2br($msg); } else echo "An unknown error occurred."; } } ?> </body> </html> thanks so much Hi What is wrong with this, it can't post text only post checkbox <html> <head> </head> <body> <FORM action="http://localhost:8182/items" method="post"> <P> <LABEL for="firstname">First name: </LABEL> <input type="text" value = "Hamada" id="firstname"><BR> <LABEL for="lastname">Last name: </LABEL> <input type="text" value = "I hate my life" id="lastname"><BR> <LABEL for="email">email: </LABEL> <input type="text" id="email" value = "I hate you"><BR> <INPUT type="radio" name="sex" value="Male"> Male<BR> <INPUT type="radio" name="sex" value="Female"> Female<BR> <input type="submit" value="Submit"> <INPUT type="reset"> </P> </FORM> </body> </html> Thanks Ok so here is my issue, i am new to web site design and i have a simple project i would like to work on. I am looking to have an entry box with a simple submit button, then i would like the submissions to be displayed below in the order they are submitted. I would also like to limit the number of submissions that show on the page at a given time by creating multiple pages that can be viewed. This seems like a very simple issue but im having trouble finding solutions on the web. Would inserting a java app or some other secondary tool be better? Any help is appreciated -Matt Hi, I'm a newbie. I would like to know how do I display 2 labels and both inputs in the same row as shown in the attachment like state followed by input field followed by label for zip and followed by input within the same row of table in a form. Thanks in advance yls I need to know how to make an html/javascript based script to make a VERY simple address bar that acts exactly like the address bar on all web browsers. When you type in where you want to go.. well.. It takes you to the url you just typed in! No restrictions are needed (anti-porn for example) and I'm hoping it can be in the shape of a regular old form script that is easily editable. Please don't ask why the hell I would need one but I just do. Thanks in advance Hello, I'm a bit stuck with how to code this so if anyone can rattle this off in seconds I'd really appreciate them doing so: Rather than have visitors to my site click on a flag to visit a page based on their country of residence I want them to click one URL, then the code on this page work out if they are from UK, USA, or any other country and re-direct them to either page 1, page 2 or page 3. Is there a way for this to be done? Thanks. Hello there, I always make webpages using tables. The usual outline for me is a vertical menu bar at the left that is of STATIC width, and a window on the right that displays the conent with a DYNAMIC width. So I pretty much want the left pane to take up i.e. 200px and the right pane to take up the rest of the page. With tables, it's easy b/c you can just set the table width to 100%, define the td width of the left pane, and the right pane will automatically resize itself to fill the page. I'm trying to adapt a div-based layout now and I can't figure out how to do that with divs. I've been playing with it, but keep running into problems. If I set float:left, after a certain point in making the window narrower, the right div jumps below the left div, etc.. Can someone give me some hints or point me in the right direction as to how to achieve the same effect I had using tables? Thanks! The new iGoogle uses a time based image where the color of the sky corresponds to the time of day eg. it is bright when it is light out and dark when it is dark out. I want to make a image for a business website that displays open when it is between certain hours and closed when it is not those hours. Any guidance on where to look or how to approach this? Hello. =) A few weeks ago, I made this thread saying that I'm (basically) still new to HTML...and now I'm forcing myself to use an HTML editor. (I decided to use KompoZer, and I've been using it for a few days.) Right now, I'm playing around with it and trying to create different site layouts. I came up with a design (which involves using DIVs), but I'm really having some problems: What the site is supposed to look like [GIF image] What the site actually looks like (for now) [HTML document - CSS is embedded in the page] ...Truth be told I drew that picture first, then I went online and found a similar-looking layout (since I can't make one from scratch yet; I still don't really understand how DIVs+CSS work). So I tried modifying the layout as best I could, and I didn't do such a great job. ^^; Anyway, I want the layout to be "liquid", so if you resize your browser everything shrinks nicely. But whenever I reduce my browser size, the header and footer start moving. How do I stop this from happening? Can anyone tell me the correct code I should be using? Thanks in advance!! PS: 1) You see those "white spaces" in the picture I drew? Well, I figure the best way to add those spaces is by modifying some background images, like what I did here. If I'm wrong, or you know a better way to do this, please tell me!! 2) If you scroll the HTML document, you might notice that it's hard to read the top line of text (because it's "hidden" behind the header DIV). I think the best way to solve this problem is by making the bottom of the header DIV transparent...or, by adding a second DIV at the bottom of the header, and then making that second DIV transparent. I heard you can use "filter:chroma" to do this, but for some reason I can't get it to work with hex colors OR pictures. =( 3) Do you think it's easier/makes more sense to try and edit this other layout instead? It scrolls the same way, and it already has a header and footer...plus the bottom of the header is already a different color, so I should be able to make it transparent. This layout doesn't have a side column, but I can make one using code like this, right?: HTML Code: body {
color: white;
background-color: #000000;
background-image: url(stars_bg3.gif);
background-image: url(foot-head.gif) bottom 300px right;
background-repeat: no-repeat;
background-attachment: fixed;
border-top: 6px solid white;
border-right: 0;
border-bottom: 6px solid #FFFFFF;
border-left: 6px solid #FFFFFF;
padding-left: 184px;
overflow: hidden;
margin: 0px;
}
|
|||||||