私には2つの機能があります
最初
function normal_validate() {
$("#add_expense").validate({
rules : {
expense : {
required : true
},
category : {
required : true
}
},
submitHandler : function(form) {
$.post('add/add_expense_result.php', $("#add_expense").serialize(), function(data) {
$('#add_expense .message_outer').fadeIn('slow').html(data).delay(3000).fadeOut('slow');
});
$('#add_expense')[0].reset();
var first_category = $('#categories option:nth-child(1)').text();
$('#add_expense .customSelectInner').html(first_category);
return false;
}
});
}
2番目
function advanced_validate() {
$("#add_expense").validate({
rules : {
expense : {
required : true
},
category : {
required : true
},
customer_name : {
required : true,
minlength : 3
},
customer_email : {
email : true
},
customer_address : {
required : true,
minlength : 5
}
},
submitHandler : function(form) {
// do other stuff for a valid form
$.post('add/add_expense_result.php', $("#add_expense").serialize(), function(data) {
$('#add_expense .message_outer').fadeIn('slow').html(data).delay(3000).fadeOut('slow');
});
$('#add_expense')[0].reset();
var first_category = $('#categories option:nth-child(1)').text();
$('#add_expense .customSelectInner').html(first_category);
var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZ";
var string_length = 5;
var result = "";
for (var i = 0; i < string_length; i++) {
var randomPos = Math.floor(Math.random() * chars.length);
result += chars.substr(randomPos, 1);
}
$('input.customerCode').val(result);
return false;
}
});
$('.existingcustomer').autocomplete({
source : 'suggest/suggest_customer.php',
select : function(event, ui) {
$('.customerId').val(ui.item.id);
$('.customerCode').val(ui.item.code);
$('.customerName').val(ui.item.name);
$('.customerEmail').val(ui.item.email);
$('.customerPhone').val(ui.item.phone);
$('.customerAddress').val(ui.item.address);
return false;
},
}).data("autocomplete")._renderItem = function(ul, item) {
return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.name + " - " + item.address + "</a>").appendTo(ul);
};
$(".existingCustomer").live("click", function() {
$('input.customerName').removeClass('newcustomer');
$('input.customerName').addClass('existingcustomer');
$('input.customerCode').removeClass('newId');
$('input.customerCode').addClass('oldId');
$('.newCustomer').attr('checked', false);
$('#customer_details input').val('');
$('#customer_details textarea').val('');
$(".existingcustomer").autocomplete("enable");
})
$(".newCustomer").live("click", function() {
$('input.customerName').removeClass('existingcustomer');
$('input.customerName').addClass('newcustomer');
$('input.customerCode').removeClass('oldId');
$('input.customerCode').addClass('newId');
$('.existingCustomer').attr('checked', false);
$('#customer_details input').val('');
$('#customer_details textarea').val('');
$('input.newId').val(result);
$(".newcustomer").autocomplete("disable");
});
}
ドキュメントの normal_validate 関数を準備したい。セレクトボックスの変更後、変更機能が欲しいです。
html
<form action="" method="post" id="add_expense">
<section class="widget mb20 border">
<h4 class="title">Expense Details <span class="info">(*) fields are mandatory</span></h4>
<div class="inner_content">
<div class="left">
<p>
<label>Expense * (<?php echo $currency; ?>)</label>
<input type="text" name="expense" class="text" />
<br class="clear" />
</p>
<p class="category">
<label>Category</label>
<span class="select">
<select name="category" id="categories">
<option value="">Choose an option</option>
<?php
if ($expense_categories !== FALSE && mysql_num_rows($expense_categories) > 0) {
while ($row = mysql_fetch_array($expense_categories)) {
$category = $row['category_name']; ?>
<option><?php echo $category; ?></option>
<?php }
}
?>
</select>
<span class="add_category"> new</span>
</span>
<br class="clear" />
</p>
</div>
<div class="right">
<p class="mbn">
<label>Description</label>
<textarea name="description" cols="30" rows="10"></textarea>
<br class="clear" />
</p>
<input class="created_by text hidden" type="text" readonly name="created_by" value="<?php echo $user_id; ?>"/>
</div>
<br class="clear" />
</div>
</section><!--(main content content_inner widget(create_invoice))-->
<section class="widget col2 left border mb20 hidden" id="customer_details">
<h4 class="title">Customer Details</h4>
<div id="customer_type">
<span class="exist">
<input type="checkbox" name="existing_customer" class="existingCustomer" checked="true"/>
<label >Existing Customer</label> </span>
<span class="new">
<input type="checkbox" name="new_customer" class="newCustomer"/>
<label >New Customer</label> </span>
</div>
<div class="inner_content">
<p>
<label>Name *</label>
<input type="text" name="customer_name" class="customerName existingcustomer text"/>
<br class="clear" />
</p>
<p>
<label>Address *</label>
<textarea name="customer_address" cols="30" rows="10" class="customerAddress"></textarea>
<br class="clear" />
</p>
<p>
<label>Phone</label>
<input type="text" name="customer_phone" class="customerPhone number"/>
<br class="clear" />
</p>
<p class="hidden">
<input type="text" name="customer_id" readonly class="customerId text " />
<input class="customerCode" type='text' name='customer_code' value=""/>
<br class="clear" />
</p>
<p class="mbn">
<label>Email</label>
<input type="text" name="customer_email" class="customerEmail text"/>
<br class="clear" />
</p>
</div>
</section><!--(widget orange customer_details_widget)-->
<br class="clear" />
<section class="submit_area">
<input type="submit" class="submit" value="Ready to go!"/>
<span class="message_outer"></span>
</section>
</form>
jquery
jQuery(document).ready(function() {
normal_validate();
$('#categories').change(function() {
var value = $(this).val();
if (value == 'repayment' || value == 'credit') {
$('#customer_details').show();
//i want disable normal_validate function
advanced_validate();
} else {
$('#customer_details').hide();
//i want disable advanced_validate function
normal_validate();
}
if (value == 'repayment') {
$('#customer_details .new').hide();
} else {
$('#customer_details .new').show();
}
});
});
私の問題は、選択ボックスの値をクレジットまたは返済に変更した後、まだ normal_validate 関数が機能していることです。