Josh Josh - 4 years ago 59
HTML Question

Web address autofill into a box on the page

How can I make the web address of the page the user is currently on autofill into a box on the page?

On my websites 404 page we have a form for the user to fill out with name, email, etc. I would like one of the form boxes to autopopulate with the page the user is currently on.

Here is the code I currently have:



<form id="contactForm" class="scaffold-form" action="https://mpex.com/contacts/index/post/" method="post">
<div class="fieldset">
<h2 class="legend">Contact Information</h2>
<p class="required">* Required Fields</p>
<ul class="form-list">
<li class="fields">
<div class="field"><label class="required" for="name"><em>*</em>Name</label>
<div class="input-box"><input id="name" class="input-text required-entry" title="Name" type="text" value="" name="name" /></div>
</div>
<div class="field"><label class="required" for="email"><em>*</em>Email</label>
<div class="input-box"><input id="email" class="input-text required-entry validate-email" spellcheck="false" title="Email" type="email" value="" name="email" /></div>
</div>
</li>
<li><label for="telephone">Telephone</label>
<div class="input-box"><input id="telephone" class="input-text" title="Telephone" type="tel" value="" name="telephone" /></div>
</li>
<li class="wide"><label class="required" for="comment"><em>*</em>Comment</label>
<div class="input-box"><textarea id="comment" class="required-entry input-text" title="Comment" name="comment" rows="3" cols="5"></textarea></div>
</li>
</ul>
</div>
<div class="buttons-set"><input id="hideit" style="display: none !important;" type="text" value="" name="hideit" /> <button class="button" title="Submit" type="submit"><span><span>Submit</span></span></button></div>
</form>




Answer Source

<form id="contactForm" class="scaffold-form" action="https://mpex.com/contacts/index/post/" method="post">
        <div class="fieldset">
        <h2 class="legend">Contact Information</h2>
        <p class="required">* Required Fields</p>
        <ul class="form-list">
        <li class="fields">
        <div class="field"><label class="required" for="name"><em>*</em>Name</label>
        <div class="input-box"><input id="name" class="input-text required-entry" title="Name" type="text" value="" name="name" /></div>
        </div>
        <div class="field"><label class="required" for="email"><em>*</em>Email</label>
        <div class="input-box"><input id="email" class="input-text required-entry validate-email" spellcheck="false" title="Email" type="email" value="" name="email" /></div>
        </div>
        </li>
        <li><label for="telephone">Telephone</label>
        <div class="input-box"><input id="telephone" class="input-text" title="Telephone" type="tel" value="" name="telephone" /></div>
        </li>
        <li class="wide"><label class="required" for="comment"><em>*</em>Comment</label>
        <div class="input-box"><textarea id="comment" class="required-entry input-text" title="Comment" name="comment" rows="3" cols="5"></textarea></div>
        </li>
        </ul>
        </div>
        <div class="buttons-set"><input id="hideit" style="display: none !important;" type="text" value="" name="hideit" /> <button class="button" title="Submit" type="submit"><span><span>Submit</span></span></button></div>
</form>
<script type="text/javascript">
    window.onload = function () {
        document.getElementById('name').value = location.href;
    }
</script>

You can add script after form tag like this

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download