jQuery + jEditable - 防止提交自定义输入
我正在将 jEditable 插件与日期选择器一起使用,但在将日期提交到数据库之前我需要验证日期。因此,我将 jEditable-datepicker.js 编辑为如下内容:
submit: function (settings, original) {
var form = this;
var tid = $(original).attr('id');
var input = $(original).find('input');
var newDate = input.val();
alert('id' + tid);
alert('newdate' + newDate);
$.ajax({
async: false,
url: '/Stock/CompareDate',
type: 'GET',
data: { id: tid, inputDate: newDate },
success: function (result) {
alert(result);
if (result < 0) {
alert("Expiry dare cannot be earlier than storage date");
return false;
}
else {
alert('else');
return true;
}
}
});
},
/* attach jquery.ui.datepicker to the input element */
plugin: function (settings, original) {
var form = this,
input = form.find("input");
// Don't cancel inline editing onblur to allow clicking datepicker
settings.onblur = 'nothing';
datepicker = {
dateFormat: 'D, dd M yy'
};
input.datepicker(datepicker);
}
我在 if 语句中收到警报,这意味着验证方法有效,但无效值仍会提交到数据库。我不知道为什么 return false 会停止提交操作。我已经尝试解决这个问题很长时间了,但这是我最接近解决方案的时间。我只是不知道如何在 if 语句中停止提交...
这里确实需要帮助...谢谢...
(更新:在 html 中添加)
我的日期字段在表中:
<td id="sdat@(item.FoodID)" class="storagedatepicker">
@String.Format("{0:ddd, d MMM yyyy}", item.StorageDate)
</td>
<td id="edat@(item.FoodID)" class="expirydatepicker">
@String.Format("{0:ddd, d MMM yyyy}", item.ExpiryDate)
对 jeditable 的调用就像这:
$('.expirydatepicker').editable('@(Url.Action("Edit", "Stock"))',
{
type: 'datepicker',
indicator: 'saving...',
event: 'dblclick',
tooltip: 'Double click to edit...',
submit: '<img src="../../Content/Add_in_Images/ok.png" alt="ok"/>',
cancel: '<img src="../../Content/Add_in_Images/cancel.png" alt="cancel"/>',
style: 'inherit'
});
I am using jEditable plugin with the datepicker but I need validation for the date before submit it to the database. So i edit the jEditable-datepicker.js to something like this:
submit: function (settings, original) {
var form = this;
var tid = $(original).attr('id');
var input = $(original).find('input');
var newDate = input.val();
alert('id' + tid);
alert('newdate' + newDate);
$.ajax({
async: false,
url: '/Stock/CompareDate',
type: 'GET',
data: { id: tid, inputDate: newDate },
success: function (result) {
alert(result);
if (result < 0) {
alert("Expiry dare cannot be earlier than storage date");
return false;
}
else {
alert('else');
return true;
}
}
});
},
/* attach jquery.ui.datepicker to the input element */
plugin: function (settings, original) {
var form = this,
input = form.find("input");
// Don't cancel inline editing onblur to allow clicking datepicker
settings.onblur = 'nothing';
datepicker = {
dateFormat: 'D, dd M yy'
};
input.datepicker(datepicker);
}
I get the alert in the if statement, which means the validation method works, but the invalid value still get submitted to the database. I dont know why the return false dint stop the submit action.. I had tried to solve this problem for a long time, yet this is the time i get closest to the solution. I just dint know how can i stop submission in the if statement...
Do really need help here... Thanks....
(UPDATE: add in html)
My date field is in a table:
<td id="sdat@(item.FoodID)" class="storagedatepicker">
@String.Format("{0:ddd, d MMM yyyy}", item.StorageDate)
</td>
<td id="edat@(item.FoodID)" class="expirydatepicker">
@String.Format("{0:ddd, d MMM yyyy}", item.ExpiryDate)
The call to jeditable is like this:
$('.expirydatepicker').editable('@(Url.Action("Edit", "Stock"))',
{
type: 'datepicker',
indicator: 'saving...',
event: 'dblclick',
tooltip: 'Double click to edit...',
submit: '<img src="../../Content/Add_in_Images/ok.png" alt="ok"/>',
cancel: '<img src="../../Content/Add_in_Images/cancel.png" alt="cancel"/>',
style: 'inherit'
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
通过不尝试停止提交来使其正常工作,而是在验证失败时将输入值替换为默认值。谢谢
Get it work by not trying to stop the submission, but replace the input value with the default value if the validation failed. Thanks
迟到的答案,但可能对其他人仍然有用,只需从
onsubmit
参数函数中return false;
以避免其提交,例如:Late answer, but maybe still useful to others, just
return false;
fromonsubmit
parameter function to avoid its submission, for example: