HTML - Best Data Collection Method?

1.Modify your web pages to obtain user input using the GET or POST method. Pages that should be modified include the:
a.shopping cart,
b.order form,
c.and the user administration page. In particular, add code to add, delete, and update customers.
2.Pass this information to another PHP page.

I am looking for the most efficient way to put text over a picture. I have a background image that i want to place text over that has to stay in the same spot and same size relative to the image that it is on top of.

There are a couple ways i can think to do it.
1. Would be to use an iframe where i want the text to be placed
2. Use css to position the image and the text relative to one another.

I am not as familiar with method number 2. If anyone has any ideas on the most efficient way to do this that would be great!

I was looking at w3schools.com and was reading about <Form> but i found a line that i dont know what means so i wanted to hear if U guys could tell me the meaning in some other ways so i might understandt it
The line is this:
This method sends the form-data as an HTTP post transaction...

I dont understandt what they mean with the HTTP post transaction.

THX U for the help

Hello,

I have tried to create my own post method script, but I seem to be running into problems every step of the way. I have an HTML based website, that will support PHP. I am trying to create a script to where someone can create and submit a weather forecast with Sky Conditions, highs lows and it would be posted to a "weather" page on my site. The main thing I need help with is how to make my own "Method to POST" my forms on my weather page.

If anyone would be a help to me please PM me or reply to the thread.

Thank You.

Hi,
Please can anyone tell me what is advantage of Get method over Post method.I read Post method is safe,no limitation on output characters so i want to know when post has so many advantages what's the use of Get?

http://www.jabproductsonline.com/test/default.html

At this site I have a web form that has two steps. Each just gets information, but the second step doesn't ultimately post to the url it's supposed to go to. What's up with this? I have the same type of web form working elsewhere (orange.977mb.com) but this one doesn't seem to want to work. It's posting to a https site, but you can see the code just by going to the web form and checking it out. If you fill in the information, make it clear that it's testing stuff Thanks!

bro can u please help me in making my web page efficient.........i want 2 form method refer to the same html page with different functionality.

I am unsure which of the below methods of embedding a flash object into a web page is correct - and which is a deprecated method. Any help would be very much appreciated!

Method one:

<object width="800" height="480">
<param name="movie" value="Gallery.swf">
<embed src="Gallery.swf" width="800" height="480">
</embed>
</object>

--

Method two:

<script type="text/javascript">
var flashvars = {XMLFile: "gallery.xml"};
var params = {bgcolor: "#000000"};
swfobject.embedSWF("Gallery.swf", "myAlternativeContent","800", "480", "9.0.0",false, flashvars, params);
</script>
<div id="myAlternativeContent">
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/>
</a>
</div>

So I've got a form with some input text. In addition to the data in the input text I want to send some other data that has already been predetermined on initial page load. How would I declare the other data within the form element?

Thanks

Hi Experts,

I am designing a webpage where based on the year selection the associated years webtable needs to be displayed in the webpage.

Pls give som suggestions and if possible the code on to how to code this using HTML and Jav Script.

I know I have to write afunction and then call the fn based on the input.but need your help on this.

Thanks,
Bsquare

Hi everybody! I have a jsp page with a form and a table. My aim is that when i press the submit button of the form,collect the data and fill the table with it.

I am working with J2EE. I have already collected the data in a Java class,but I dont know how to introduce this data into the table.

Best Regards!

I have been using my site for some time now and it carries the image name over when you clicked on purchasing the print. It carries it still, but when you submit the form, the image name isnt there and the form errors because the field is blank.

Here is the site: www.sthompsonphoto.com

I cant seem to figure out why it disappears when you click Submit?

Any help would be great!

So in January 2006 I posted a question about "making two buttons in one"



3 years and 5 months later i am happy to announce that I have found a solution.

Ok, so no I have not spent the last three years looking, but the need for one came around again yesterday so I revisited the project. All I needed was "simple" image toggle. Image 'A' click it once it changes to image 'B' click it again it changes back to image 'A'

All the "image toggle" codes I could find were extremely complex. I thought I had finally found one, it wasn't perfect, but it was the smallest and most basic thing I could find.

HTML Code:

<html>
<head>
<style type="text/css">
.on {background-image:url(playlist_btn.png); background-repeat:no-repeat;}
.off {background-image:url(playlist_btn_x.png); background-repeat:no-repeat;}
</style>

<script language="javascript">
function togglestyle(el){if(el.className == "on") {el.className="off";} else {el.className="on";}}
</script>

</head>

<body>
<div id="onoff" class="playlist_btn"><img src="blank.gif" width="50 height="50" onclick="togglestyle(onoff)"></div>
</body>
</html>

I tested it, it worked, so I considered problem solved. I placed it in my page and nothing. Turns out it wont work with a doc type - so it's useless.

Other problems, I'm not big on using "blank gif's" unless I have to, if you want multiple image toggles you need a new JS function for each one, and two lines of css as well. And, though I rarely use image rollovers anymore, it would certainly not be possible in this method.

So it was back to the drawing board. Well, I had actually already found the solution a few minuets prior to finding out that the above code is so good. I had coded a button that on rollover shows a tooltip, when you click the button, the text in the tool tip, changes, chick again and it reverts. All done with a simple showHide javascript function, that i am finfing out has many uses.

here is the awesome code:
Code:

function showHide(elementid){
if (document.getElementById(elementid).style.display == 'none'){
document.getElementById(elementid).style.display = '';
} else {
document.getElementById(elementid).style.display = 'none';
}
}

function hideShow(elementid){
if (document.getElementById(elementid).style.display == ''){
document.getElementById(elementid).style.display = 'none';
} else {
document.getElementById(elementid).style.display = '';
}
}

I wont take credit for the showHide code, but I will take credit for the hideShow portion, obviously a monkey could have coded the revers, but iot does make it that much more universal. As the original code was designed to show something that was hidden, add the revers to hide something that is showing and it's perfect.

Now I will take a moment to say, though I have yet to find a problem with the code, it seems to work in most browsers, firefox, ie, safari, and validates for WC3 - In sure it has it's flaws. Until now, to show and hide divs I had used the MM_showHideLayers JavaScript function, which by default used the visibility style. It is of course a good script, and has many uses, it's not very big, but it is somewhat complex. The other thing to think about is that invisible objects still take up space. That's what is cool about the display:none: style, is that is not only invisible but it doesn't take up space.

So here is how I used the above to JavaScript to make a simple onclick image toggle:

HTML Code:

<img id="on" src="on.png" width="50" height="50" onClick="javascript:hideShow('on'); javascript:showHide('off')" alt="on">
<img id="off" src="off.png" width="50" height="50" onClick="javascript:hideShow('off'); javascript:showHide('plus')" style="display:none;" alt="off">

Cool huh? Now this example does not have a rollover either, but since it uses to individual images and is not replacing one image wioth another you could easily apply a rollover to both images. But, hold on, look at the above code, isn't that essentially a rollover? Change the first onClick to onMouseOver and the second to onMouseOut and look at that a 'brand new' method for mouseovers.

So lets take a look at this for a second, and compare MM_swapImage to this new hideShow method. As far as CSS rollovers I definitely prefer them to the MM_swapImage method, as they use a minimal amount of code. However they actually take a lot of math, construction the buttons is somewhat tedious, because css buttons use 1 image and change it's position, to work well you have to use a "blank.gif" and the the css can really add up if you have a lot of buttons:

Also, you can't go directly to a button in the document, you have to fish through the css to make any adjustments. But they are fast, they don't need to be preloaded and... they are pretty cool. But anyway, swapImage and hideShow...



The left is the MM_swapImage method. Now when you use the swapImage js you also have to use MM_swapImgRestore, MM_findObj, MM_preloadImages. You don't have to use the preload script but it does make thing work faster... supposedly, but that requires a onload script in the body tag, and if you have a lot of rollovers your body tag can get really long really quick. So what are the advantages, well we know for sure it works, and you only need on image in the document, however actualy having the image you are "swapping" too actually in the document can add functionality.

So as you can see, on the right, the showHide method is, in total code, much smaller. True you do need to use two images, so the total code in the body is longer but, it's more than evened out bu the minimal JavaScript, and I think it's worth it. You don't need to use a preloader, you have full control over both images, the up and over state, and unlike the swapImage method, though it's rare you would need to, your up and over images can actually be different sizes, which is kind of cool.

So here's the basic code for a rollover:
HTML Code:

<img id="up" src="up.png" width="50" height="50" onMouseOver="javascript:hideShow('up'); javascript:showHide('over')" alt="up">
<a href="http://google.com"><img id="over" src="over.png" width="50" height="50" onMouseOut="javascript:hideShow('over'); javascript:showHide('up')" style="display:none;" alt="over" border="0"></a>

To add a link the button you just apply it to the "over state" image. And unlike swapImage, though it is overkill, you can also add a "downstate" image quite easily.

So, back to the on/off button here is how you would code it using showHide with rollovers.
HTML Code:

<img id="on" src="on.png" width="50" height="50" onMouseOver="javascript:hideShow('on'); javascript:showHide('onover')" alt="on">
<img id="onover" src="on_over.png" width="50" height="50" onMouseOut="javascript:hideShow('onover'); javascript:showHide('on')" onClick="javascript:hideShow('onover'); javascript:showHide('offover')"  style="display:none;" alt="onover">
<img id="off" src="off.png" width="50" height="50" onMouseOver="javascript:hideShow('off'); javascript:showHide('offover')" style="display:none;" alt="off">
<img id="offover" src="off_over.png" width="50" height="50" style="display:none;" onMouseout="javascript:hideShow('offover'); javascript:showHide('off')" onClick="javascript:hideShow('onover'); javascript:showHide('off')"alt="offover">

So here is what is going on:
you have the upstate on.png image, when you mouse over it on.png is hidden and on_over.png is displayed. When you click on_over.png it is hidden and off_over.png is display, mouse off it and off.png is displayed. Make scene?

Now be aware, when you click, you are also in a scene "mousing off" so some flickering can occur. Firefox handles everything pretty well, IE and Safari not so much. When you click the on_over.png the click tells it to hide on_over.png and show the off_over.png, at the same time the mouseoff tells it to hide on_over.png and show the on.png. So fortunately the toggle with rollovers isn't perfect, but perhaps some more tweaking of the code or maybe, in this case swapImage would work better to do the rollovers...

But all in all I'd say its a solid concept. If you feel compiled to do so, reply with any comments, concerns or flaws you see.

Hi All -

I'm new to the forums and also somewhat new to web development. I'm trying to scrape together a website for my wedding and have managed my way through most of it, however the RSVP form is killing me.

I believe the page is working fine with FF3 - at least it does what I want it to do. In IE7 however, when the submit button is pressed IE appears to hang, and status bar reads "waiting for rsvp2.php". The page never appears, however the file creation on the back end does complete successfully, so it IS doing something. I have changed the form method to "get" and IE seems to proceed normally, but I don't want to use this as a permanent solution. The URL is below and any help would be greatly appreciated. If there isn't enough information please let me know!

www.nikiandzack.com/rsvp.php

Thanks,
Zack