如何验证带有 jquery 且没有表单的文本框字段?
How to validate a textboxfor field with jquery and no form?
我想知道如何在没有表单且使用此模式时激活 jquery 非侵入式验证:
<script type="text/javascript">
$('.btnAddAsync').click(function (e) {
e.preventDefault(); // Avoid href postback
var $letter = $(this);
var charityAmount = $(".charity-gift");
// *******
// IF charityAmount IS VALID based on the unobtrusive rule then do the following
// *******
var href = charityAmount.attr('data-href');
href = href.replace(/(charityGiftAmount=)[0-9]+/ig, '' + $(".charity-gift").val());
......
});
</script>
HTML:
<div class="row">
<div class="col-lg-12">
<div class="input-group">
@Html.TextBoxFor(m => item.CharityGiftAmount, new { @class = "charity-gift form-control", data_href = Url.Action("Add", "Checkout", new { eventSlug = Model.Slug, eventId = Model.Id, skuId = item.Id, quantity = 1, charityGiftAmount = 0 }) })
<span class="input-group-btn">
<button class="btn btn-default btnAddAsync" type="button">@SharedResources.AddToCart</button>
</span>
</div>
</div>
</div>
@Html.ValidationMessageFor(m => item.CharityGiftAmount, "", new { @class = "text-danger" })
如果我有一个表单,我可以使用 form.valid()
,但是当我只有一个文本框时,我不知道那个用例。
谢谢,
大卫
--
编辑
我忘了提这个非常重要的细节:
这是我在文本框字段上得到的验证:
<input class="charity-gift form-control" data-href="/Checkout/Add?eventSlug=trail-and-donation&eventId=4&skuId=5&quantity=1&charityGiftAmount=0" data-val="true" data-val-regex="Invalid amount" data-val-regex-pattern="^(\d+(?:[\.\,]\d{2})?|)$" id="item_CharityGiftAmount" name="item.CharityGiftAmount" type="text" value="">
终于解决了。
如果您在服务器端设置了正则表达式规则,您仍然可以通过这种方式 jquery 检索正则表达式模式并手动进行验证。
<script type="text/javascript">
$('.btnAddAsync').click(function (e) {
var charityAmount = $(".charity-gift");
var validationRule = new RegExp(charityAmount.attr('data-val-regex-pattern'));
if (validationRule.test(charityAmount.val())) {
// Regex passed
var href = charityAmount.attr('data-href');
href = href.replace(/(charityGiftAmount=)[0-9]+/ig, '' + $(".charity-gift").val());
......
}
else {
// Regex failed
......
}
});
我想知道如何在没有表单且使用此模式时激活 jquery 非侵入式验证:
<script type="text/javascript">
$('.btnAddAsync').click(function (e) {
e.preventDefault(); // Avoid href postback
var $letter = $(this);
var charityAmount = $(".charity-gift");
// *******
// IF charityAmount IS VALID based on the unobtrusive rule then do the following
// *******
var href = charityAmount.attr('data-href');
href = href.replace(/(charityGiftAmount=)[0-9]+/ig, '' + $(".charity-gift").val());
......
});
</script>
HTML:
<div class="row">
<div class="col-lg-12">
<div class="input-group">
@Html.TextBoxFor(m => item.CharityGiftAmount, new { @class = "charity-gift form-control", data_href = Url.Action("Add", "Checkout", new { eventSlug = Model.Slug, eventId = Model.Id, skuId = item.Id, quantity = 1, charityGiftAmount = 0 }) })
<span class="input-group-btn">
<button class="btn btn-default btnAddAsync" type="button">@SharedResources.AddToCart</button>
</span>
</div>
</div>
</div>
@Html.ValidationMessageFor(m => item.CharityGiftAmount, "", new { @class = "text-danger" })
如果我有一个表单,我可以使用 form.valid()
,但是当我只有一个文本框时,我不知道那个用例。
谢谢,
大卫
-- 编辑
我忘了提这个非常重要的细节: 这是我在文本框字段上得到的验证:
<input class="charity-gift form-control" data-href="/Checkout/Add?eventSlug=trail-and-donation&eventId=4&skuId=5&quantity=1&charityGiftAmount=0" data-val="true" data-val-regex="Invalid amount" data-val-regex-pattern="^(\d+(?:[\.\,]\d{2})?|)$" id="item_CharityGiftAmount" name="item.CharityGiftAmount" type="text" value="">
终于解决了。 如果您在服务器端设置了正则表达式规则,您仍然可以通过这种方式 jquery 检索正则表达式模式并手动进行验证。
<script type="text/javascript">
$('.btnAddAsync').click(function (e) {
var charityAmount = $(".charity-gift");
var validationRule = new RegExp(charityAmount.attr('data-val-regex-pattern'));
if (validationRule.test(charityAmount.val())) {
// Regex passed
var href = charityAmount.attr('data-href');
href = href.replace(/(charityGiftAmount=)[0-9]+/ig, '' + $(".charity-gift").val());
......
}
else {
// Regex failed
......
}
});