J'ai la validation de jQuery sur plusieurs formulaires. Le problème est que sur certains formulaires, la validation ne fonctionne pas, mais le même code est utilisé. J'ai passé de nombreuses heures et je ne vois pas ce qui ne va pas avec le code. Ils sont tous deux chargés par ajax.La validation jquery ne fonctionne pas
est ici une forme que la validation ne fonctionne pas:
<div id="form_box">
<?php echo $this->Form->create('Room');?>
<?php echo $this->Form->input('id');?>
<div id="form_tabs" class="column span-17">
<ul>
<li><a href="#form_tabs-1">Room</a></li>
<li><a href="#form_tabs-2">Description</a></li>
<li><a href="#form_tabs-3">Rates</a></li>
<li><a href="#form_tabs-4">Attached Images</a></li>
</ul>
<div id="form_tabs-1">
<?php
echo $this->Form->input('title',array('class'=>'form_input'));
echo $this->Form->input('enabled',array('class'=>'form_input'));
//echo $this->Form->input('no_of_rooms',array('class'=>'form_input'));
?>
<div class="input text"><label for="RoomListNo">Display Order</label>
<?
echo $res->getNumDrop(10, null, $this->data['Room']['list_no'], 'RoomListNo','data[Room][list_no]');
?>
</div>
<hr />
<?php
echo $this->Form->input('min_adults',array('class'=>'form_input'));
echo $this->Form->input('max_adults',array('class'=>'form_input'));
echo $this->Form->input('max_children',array('class'=>'form_input'));
?>
</div>
<div id="form_tabs-2">
<?php echo $this->Form->input('description');?>
</div>
<div id="form_tabs-3">
<h3>Related Rates</h3>
<?php
//echo $this->Form->input('AddOn',array('class'=>''));
echo $this->Form->input('Rate',array('class'=>'multiselect','label'=>false));
?>
</div>
<div id="form_tabs-4">
<div id="uploader"></div>
<div class="boxgrid grid_8">
<?php echo $this->element('attachments',array('control'=>'rooms','id'=>$this->data['Room']['id'],'att'=>$this->data['Attachment'])); ?>
</div>
<hr />
</div>
</div>
<?php echo $this->element('form_col'); ?>
</form>
</div>
<div id="error_msg"></div>
<script type="text/javascript">
$(document).ready(function() {
$("div#uploader").resloader();
$("div#uploader").load('<?=BASE_URL?>/admin/rooms/addfiles/<?=$this->data['Room']['id']?>',null,function(){}).fadeIn();
$(".multiselect").multiselect();
// validate form on keyup and submit
$("#RoomEditForm").validate({
rules: {
'data[Room][title]': {required: true, minlength: 3, maxlength:32 },
'data[Rate][Rate][]': {required: true},
'data[Room][max_adults]': {required: true, digits: true, minlength: 1, maxlength:2 },
'data[Room][max_children]': {required: true, digits: true, minlength: 1, maxlength:2 }
},
messages: {
'data[Room][title]': {required: "Please Enter a Room title"},
'data[Rate][Rate][]': {required: "Please select at least one Rate"},
'data[Room][max_adults]': {required: "Max Adults must be numeric "},
'data[Room][max_children]': {required: "Max Children must be numeric "}
},
errorPlacement: function(error, element) {
$('#error_msg').html(error);
}
});
});
</script>
est ici une forme que la validation fonctionne correctement:
<div id="form_box">
<?php echo $this->Form->create('AddOn', array('id'=>'AddOnEditForm','url'=>'/admin/upgrades/edit'));?>
<?php echo $this->Form->input('id');?>
<div id="form_tabs" class="column span-17">
<ul>
<li><a href="#form_tabs-1">Add On</a></li>
<li><a href="#form_tabs-2">Description</a></li>
<li><a href="#form_tabs-3">Dates</a></li>
<li><a href="#form_tabs-4">Related Data</a></li>
<li><a href="#form_tabs-5">Attached Images</a></li>
</ul>
<div id="form_tabs-1">
<?php
echo $this->Form->input('title',array('class'=>'form_input'));
echo $this->Form->input('price',array('class'=>'form_input'));
?>
<div class="input text"><label for="AddOnPriceQuoteAs">Price Quote As</label>
<?php
echo $res->getPriceQuoteDrop($this->data['AddOn']['price_quote_as'],'AddOnPriceQuoteAs','data[AddOn][price_quote_as]');
?>
</div>
<hr />
<?php
echo $this->Form->input('add_on_category_id',array('class'=>'form_input','label'=>'Category'));
echo $this->Form->input('enabled',array('class'=>'form_input'));
?>
<div class="input text"><label for="AddOnListNo">Display Order</label>
<?
echo $res->getNumDrop(10, null, $this->data['AddOn']['list_no'], 'AddOnListNo','data[AddOn][list_no]');
?>
</div>
</div>
<div id="form_tabs-2">
<?php echo $this->Form->input('description');?>
</div>
<div id="form_tabs-3">
<div class="input select">
<label for="AddOnAvailabilityDrop">Availability</label>
<?
echo $res->getAvailabilityDrop($this->data['AddOn']['availability'],'AddOnAvailabile','data[AddOn][available][]');
?>
</div>
<div class="input text">
<label for="AddOnValidFrom">Valid From</label>
<input id="AddOnValidFrom" class="form_input form_datepicker" name="data[AddOn][valid_from]"
type="text" value="<?=$this->data['AddOn']['valid_from']?>" />
</div>
<div class="input text">
<label for="AddOnValidTo">Valid To</label>
<input id="AddOnValidTo" class="form_input form_datepicker" name="data[AddOn][valid_to]"
type="text" value="<?=$this->data['AddOn']['valid_to']?>" />
</div>
</div>
<div id="form_tabs-4">
<h3>Relates to these Rate+Room combinations:</h3>
<?php
foreach($this->data['AddOnRateroom'] as $rr){
?>
<strong>Rate:</strong> <?=$rates[$rr['rate_id']]?> +
<strong>Room:</strong> <?=$rooms[$rr['room_id']]?> (<a href="<?=BASE_URL?>/admin/upgrades/delraterooms/<?=$this->data['AddOn']['id']?>/rate:<?=$rr['rate_id']?>/room:<?=$rr['room_id']?>">x</a>)<br />
<?
}
if (count($this->data['AddOnRateroom'])==0){ echo 'No Rate+Room Combinations';}
?>
<br /><br /><br />
<h3>add New Rate+Room Combination</h3>
<select id="AddOnRates" name="data[Addon][RR][rate]">
<option vlaue="">Choose Rate...</option>
<? foreach($rates as $rid=>$rate){ ?>
<option value="<?=$rid?>"><?=$rate?></option>
<? } ?>
</select>
<div id="roomloader"></div>
<p class="buttons"><a id="gorr" style="display:none" href="<?=BASE_URL?>/admin/upgrades/addraterooms/<?=$this->data['AddOn']['id']?>">GO</a></p>
</div>
<div id="form_tabs-5">
<div id="uploader"></div>
<?php echo ($this->data['AddOn']['id']);?>
<div class="boxgrid grid_8">
<?php echo $this->element('attachments',array('control'=>'upgrades','id'=>$this->data['AddOn']['id'],'att'=>$this->data['Attachment'])); ?>
</div>
<hr />
</div>
</div>
<?php echo $this->element('form_col'); ?>
<? //debug($this->data);?>
</form>
</div>
<div id="error_msg"></div>
<script type="text/javascript">
$(document).ready(function() {
$("div#uploader").resloader();
$("div#uploader").load('<?=BASE_URL?>/admin/upgrades/addfiles/<?=$this->data['AddOn']['id']?>',null,function(){}).fadeIn();
/* JQuery Datepicker */
$('.form_datepicker').datepicker({
dateFormat: 'yy-mm-dd'
});
$('#AddOnRates').change(function(){
var rid = $(this).val();
var gotohref = '<?=BASE_URL?>/admin/upgrades/getraterooms/'+rid;
$("div#roomloader").resloader();
$("div#roomloader").load(gotohref,null,function(){}).fadeIn();
return false;
});
// validate form on keyup and submit
$("#AddOnEditForm").validate({
rules: {
'data[AddOn][title]': {required: true, minlength: 3, maxlength:32 },
'data[AddOn][price]': {required: true, number: true},
'data[AddOn][valid_from]': {required: true, date: true},
'data[AddOn][valid_to]': {required: true, date: true},
'data[AddOn][available][]': {required: true},
},
messages: {
'data[AddOn][title]': {required: "Please Enter a Rate title"},
'data[AddOn][price]': {required: "Price must be numeric "},
'data[AddOn][valid_from]': {required: "Please enter a valid Date From"},
'data[AddOn][valid_to]': {required: "Please enter a valid Date To "},
'data[AddOn][available][]': {required: "Please select at least one Availability Day"},
},
errorPlacement: function(error, element) {
$('#error_msg').html(error);
}
});
});
</script>
Oui, c'était bien, merci. Parce que les formulaires fonctionnaient, je ne pensais pas que cela puisse être un problème. –