Can I add new Form fields using javascript onlick to work with PHP submit?

Question

I trying to add a two fields to a contact form and append the form data to the submit.

<script type="text/javascript">
$(document).ready(function(){

alert(document.getElementById("customer:quantity").value);

alert(document.getElementById("customer:usage").value);

$(":submit").click(function () {
$("div").append("customer:quantity");
});

$(":submit").click(function () {
$("div").append("customer:usage");
});


});
</script>

Answer 1

I dont know if that helps you, but i added a field for the telephone number in my transaction email: Your telephone number: {{var data.telephone}}

To get this working you need to change the contact form. app/design/frontend/YOURTEMPLATE/default/template/contacts/form.phtml

I added a field there:

<div class="input-box">
                    <input name="telephone" id="telephone" title="<?php echo Mage::helper('contacts')->__('Telephone') ?>" value="" class="input-text" type="text" />
                </div>

Answer 2

If you want to add extra data to be submitted with a form you should add more form elements (i.e. text input, hidden) within the form which contain the relevant data as their value. A div element does not get submitted with a form. Preferably do this in the relevant template rather than on the fly using JS, but if you have to use JS then use Protoype rather than jQuery as it's the framework of choice for Magento 1.x.