Custom Form Data Save Ajax with validation in Magento

-First Create test.php file -copy all code and paste in file -Then run on localhost -fisrt time load file thane save data without load -save data only one click. YOUR Custom Form :

<form id="lowest-form-validate" name="lowest-form-validate" class="lowest-form-validate">
<div class="lowest-fieldset">
        <input value="<?php echo $_product->getId() ?>" name="fancy_product" type="hidden">
        <span class="lowest-legend">Email request for lowest price of <!--?php echo $_product--->getName()?></span>
        <ul class="form-list">
            <li class="fields">
                    <div class="customer-name">
                        <div class="field name-firstname">
                            <label class="required" for="firstname"><em>*</em>First Name</label>
                            <div class="input-box">
                                <input class="input-text required-entry" maxlength="255" title="First Name" value="" name="firstname" id="firstname" type="text">
                            </div>
                        </div>
                        <div class="field name-lastname">
                            <label class="required" for="lastname"><em>*</em>Last Name</label>
                            <div class="input-box">
                                <input class="input-text required-entry" maxlength="255" title="Last Name" value="" name="lastname" id="lastname" type="text">
                            </div>
                        </div>
                    </div>
            </li>
            <li>
                    <label class="required" for="email_address"><em>*</em>Email Address</label>
                    <div class="input-box">
                        <input class="input-text validate-email required-entry" title="Email Address" value="" id="email_address" name="email" type="text">
                    </div>
            </li>
        </ul>
        <div class="buttons-set">
            <p class="required">* Required Fields</p>
            <button type="submit" title="<?php echo $this->__('Submit') ?>" class="button"><span><span><!--?php echo $this--->__('Submit') ?></span></span></button>
            <span id="formLoader" style="display:none"><img src="<?php echo $this->getSkinUrl("images/opc-ajax-loader.gif")?>"></span>
        </div>
</div>
</form>
<div id="formLowestSuccess" style="display:none;"></div>

  YOUR script :

<script type="text/javascript">
    //var dataForm = new VarienForm('lowest-form-validate', true);
    //<![CDATA[
    var formId = 'lowest-form-validate';
    var myForm = new VarienForm(formId, true);
    //var postUrl = '<?php echo Mage::getBaseUrl()."modulename/controller/method" ?>';
    var postUrl = "<?php echo Mage::getBaseUrl().'emaillowest/index/submit'?>";
    function doAjax() {
        if (myForm.validator.validate()) {
            new Ajax.Updater(
                { success:'formLowestSuccess' }, postUrl, {
                    method:'post',
                    asynchronous:true,
                    evalScripts:false,
                    onComplete:function(request, json) {
                        Element.hide(formId);
                        Element.show('formLowestSuccess');
                    },
                    onLoading:function(request, json){
                        Element.show('formLoader');
                    },
                    parameters: $(formId).serialize(true),
                }
            );
        }
    }
    new Event.observe(formId, 'submit', function(e){
        e.stop();
        doAjax();
    });
 
//end of javascript code
}}
></script>