Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    May 2006
    Posts
    92
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Form fields write out to another section on page?

    Hey all,

    I've got a page where I have a form that submits a message to a given email address... now I have written out the message that will end up with the receiver so the sender can see what it looks like... what I want to do is present it with gaps filled as the user fills in the form...

    i.e.

    Form at top of page:
    Friends Name:
    Friends email:
    Your Name:

    then below

    Hi (Friends Name)
    I thought you might like to receive this snippet of info.

    Regards (Your Name)

    As the user fills in the fields in the form, the bracket section in the message fills in too.

    Is this possible - how would I go about doing this?

    Thanks

  • #2
    Regular Coder
    Join Date
    Mar 2007
    Posts
    505
    Thanks
    1
    Thanked 19 Times in 19 Posts
    Do you want this done during or after form processing?

    If you want this done during the form processing (i.e., when the person changes focus from the "Friend's Name" form field to the "Friend's email" form field), then you need to use client-side coding, like JavaScript.

    After form processing, just use the request.form() collection.

    So, after the user hits SUBMIT

    Code:
    Hi <%= request.form("FriendsName") %>,
    I thought you might like to receive this snippet of info.
    
    Regards <%= request.form("YourName") %>
    To say my fate is not tied to your fate is like saying, 'Your end of the boat is sinking.' -- Hugh Downs
    Please, if you found my post helpful, pay it forward. Go and help someone else today.

  • #3
    New Coder
    Join Date
    May 2006
    Posts
    92
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Hi Daemonspyre - Yeah I want it realtime before any form submission. So I guess javascript is the way forward - any links or suggestions would be much appreciated.

    I think this is the right direction
    http://www.webdeveloper.com/forum/sh...d.php?t=153046

    BUT it only works on onchange - so it doesn't fill the last field in if there isn't another to change to.
    Last edited by dommy; 08-17-2007 at 12:15 AM.

  • #4
    Regular Coder
    Join Date
    Mar 2007
    Posts
    505
    Thanks
    1
    Thanked 19 Times in 19 Posts
    Although this isn't the correct forum, here's how you do it. You will need to correct it based on your form fields.

    Code:
    <html>
    <body>
    <script language="javascript">
    function setField(fld,dest) {
    	var theForm = eval('document.myForm.'+fld);
    	if (fld != "") {
    		document.getElementById(fld).innerHTML = theForm.value;
    	}
    }
    </script>
    
    <form method="post" action="test.asp" name="myForm">
    Your Name: <input type="text" name="YourName" size="20" onblur="javascript:setField('YourName','YourName');" /><br />
    Friend's Name: <input type="text" name="FriendName" size="20" onblur="javascript:setField('FriendName','FriendName');" /><br />
    Friend's Email: <input type="text" name="FriendEmail" onblur="javascript:setField('FriendEmail','FriendEmail');" /><br />
    <input type="button" name="B1" value="Submit" />
    </form>
    <p>&nbsp;</p>
    <div id="previewMessage">
    	Hi <span id="FriendName" style="margin: 0px; padding: 0px;"></span><br />
    	I thought you might like to receive this snippet of info.<br />
    	<br />
    	Regards <span id="YourName" style="margin: 0px; padding: 0px;"></span><br />
    	Sent to: mailto:<span id="FriendEmail" style="margin: 0px; padding: 0px;"></span>
    </div>
    </body>
    </html>
    To say my fate is not tied to your fate is like saying, 'Your end of the boat is sinking.' -- Hugh Downs
    Please, if you found my post helpful, pay it forward. Go and help someone else today.

  • #5
    New Coder
    Join Date
    May 2006
    Posts
    92
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Yeah - thought this would be server side asp code... but hey ho.

    Did u try this cos i get a js error?

    Doesn't seem to like the following line..
    document.getElementById(fld).innerHTML = theForm.value;
    Last edited by dommy; 08-17-2007 at 01:16 AM.

  • #6
    Regular Coder
    Join Date
    Mar 2007
    Posts
    505
    Thanks
    1
    Thanked 19 Times in 19 Posts
    Works just fine on my servers.

    What error are you getting (are you using FF or IE)? I only tried it on FF, so it may need some IE hacking.
    To say my fate is not tied to your fate is like saying, 'Your end of the boat is sinking.' -- Hugh Downs
    Please, if you found my post helpful, pay it forward. Go and help someone else today.

  • #7
    Senior Coder
    Join Date
    Dec 2002
    Location
    Arlington, Texas USA
    Posts
    1,072
    Thanks
    4
    Thanked 8 Times in 8 Posts
    IE doesn't like eval it prefers that you use window.eval

  • #8
    New Coder
    Join Date
    May 2006
    Posts
    92
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I tried it in IE.

    I ended up using that link example and changing the onchnage to onkeyup so that it wrote the letters as I typed them..

    Here's the code..

    [CODE]
    <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
    <!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" />
    <title>Untitled Document</title>
    </head>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function copyValue(el) {
    document.getElementById('copy_' + el.id).innerHTML = el.value;
    }
    //-->
    </SCRIPT>

    <body>
    <form action="bla.php" id="formulier" name="formulier"method="post">
    phone:
    <input type="text" name="phone" style="width:160px" id="phone" onkeyup="copyValue(this);" />
    phone:
    <input type="text" name="tel" style="width:160px" id="tel" onkeyup="copyValue(this);" />
    </form>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>Another location: <span id="copy_phone"></span></p>
    <p>Another location 2: <span id="copy_tel"></span></p>
    </body>
    </html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •