I am trying to add custom form validation.
This is what i am using.
<?php
/* include file in magento scope */
include_once 'app/Mage.php';
Mage::app();
$basePath= Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);
$media = Mage::getBaseDir('media');
if($_POST['model_name']!='')
{
echo "form submitted thanks.";die;
}
?>
<link media="all" href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_SKIN).'adminhtml/default/default/boxes.css'; ?>" type="text/css" rel="stylesheet">
<link media="all" href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_SKIN).'adminhtml/default/default/reset.css';?>" type="text/css" rel="stylesheet">
<script type="text/javascript" src="<?php echo $basePath?>js/prototype/prototype.js"></script>
<script type="text/javascript" src="<?php echo $basePath?>js/prototype/validation.js"></script>
<script type="text/javascript" src="<?php echo $basePath?>js/varien/js.js"></script>
<script type="text/javascript" src="<?php echo $basePath?>js/varien/form.js"></script>
<div class="entry-edit">
<div class="entry-edit-head">
<h4>Model Information</h4>
</div>
<div id="product_options_container">
<div id="product_options_container_top"></div>
<div id="product_options_container">
<div id="product_options_container_top"></div>
<div class="hor-scroll">
<form enctype="multipart/form-data" method="post" id="model_add_two" name="model_add2">
<table cellspacing="0" class="form-list">
<tbody>
<tr>
<td class="label"><label for="fonts_f_name">Model Name<span class="required">*</span></label></td>
<td class="value">
<input type="text" name="model_name" class="input-text required-entry" id="model_name">
</td>
</tr>
<tr>
<td class="label"><label for="fonts_f_name">Status<span class="required">*</span></label></td>
<td class="value">
<select class="required-entry" id="status" name="status">
<option selected="selected" value="">Select Status</option>
<option value="1">Enable</option>
<option value="0">Disable</option>
</select>
</td>
</tr>
<tr>
<td class="label"><label for="short_price"></label></td>
<td class="value">
<input name="add_button" id="add_button" type="submit" class="scalable save"><span>Save</span></button> </td>
</tr>
</tbody>
</table>
</form>
<div id="formSuccess" style="display:none;"> </div>
</div>
<!-- End code-->
<div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
//<![CDATA[
var formId = 'model_add_two';
var myForm = new VarienForm(formId, true);
var postUrl = '<?php echo $_SERVER['PHP_SELF']; ?>';
function doAjax() {
if (myForm.validator.validate()) {
new Ajax.Updater(
{ success:'formSuccess' }, postUrl, {
method:'post',
asynchronous:true,
evalScripts:false,
onComplete:function(request, json) {
Element.hide(formId);
Element.show('formSuccess');
},
onLoading:function(request, json){
Element.show('formLoader');
},
parameters: $(formId).serialize(true),
}
);
}
}
new Event.observe(formId, 'submit', function(e){
e.stop();
doAjax();
});
//]]>
</script>
This is what i get after these steps.
1)click on save button – validation works.
2)fill all fields. and click on save button – form doesn't get submit.
What is the issue here.
Best Answer
Couldn't find any solution for this. I had to use simple jQuery validation for this.