<ext-textfield fieldLabel="客户名称" name="FullName" labelAlign="Right">
<listeners>
<change handler="
var newValue = this.getValue();
if (!newValue) {
return; // 如果没有输入值,不发送请求
}
Ext.Ajax.request({
url: '/CustomerManagement/CheckCustomerName',
method: 'POST',
params: { customerName: newValue },
success: function (response) {
var result = Ext.decode(response.responseText);
if (!result.success) {
Ext.Msg.alert('重复提醒', result.message);
}
},
failure: function () {
Ext.Msg.alert('错误', '检查客户名称时出错,请稍后重试。');
}
});
" />
</listeners>
</ext-textfield>
[HttpPost]
public JsonResult CheckCustomerName(string customerName)
{
// 查询数据库判断是否存在相同名称
var isDuplicate = Gttc.CustomerOrgs.Any(x => x.FullName == customerName);
if (isDuplicate)
{
return Json(new
{
success = false,
message = $"客户名称 '{customerName}' 已存在,请使用其他名称。"
});
}
return Json(new
{
success = true
});
}
前端监听 change 事件:
在用户更改输入内容时,实时触发验证逻辑。
使用 Ext.Ajax.request 异步调用后端。
后端检测逻辑:
检查数据库中是否已经存在相同的客户名称。
如果存在,返回 success: false 和错误提示消息。
如果不存在,返回 success: true。
错误处理:
如果请求失败(网络问题或后端错误),前端弹出统一的错误提示框。
防止无效请求:
在前端判断输入值是否为空,避免发送无意义的请求。