asp.net - RequiredFieldValidator 不能与 jQuery UI 一起正常工作

原文 标签 asp.net jquery-ui

我正在开发 ASP.NET Web 窗体应用程序。我有一个很大的表单,里面有很多字段,所以我想尽可能多地利用 Web Forms 中的内置服务器控件。 .此外,由于表单太大,我在逻辑上使用 jQuery UI 1-8-24 和 Accordion 菜单将其分成三个部分。我还在此页面上使用了 DatePicker,因此我的页面如下所示:

<script>
    $(function () {
        $("#accordion").accordion();
        $(".inpt-date").datepicker();
    });
    window.history.pushState('obj', '', 'myPage.aspx');
</script>

所以它工作正常,我在这个页面上实现了很多逻辑,并且在我声明添加 RequiredFieldValidator 的那一刻一切正常例如 :
<asp:TextBox ID="txtEnforcementCase" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator2"
    ControlToValidate="txtEnforcementCase"
    Display="Static"
    Text="*"
    ErrorMessage="This field is required!"
    runat="server"/> 

我认为没有什么不寻常的,因为我使用的是 MSDN 中的示例,并且验证非常简单,所以我的标准实现适用于我。

但是,当我添加 RequiredFieldValidator我失去了 jQuery UI 的所有样式,并在控制台中收到此错误:
Uncaught TypeError: undefined is not a function

我尝试评论和取消评论 JS页面上的代码。如果我只使用:
window.history.pushState('obj', '', 'myPage.aspx');

一切正常,但无论我同时使用日期选择器和 Accordion ,还是只使用其中一个,我都会失去 jQuery UI 样式并得到指向我拥有 $("#accordion").accordion(); 的行的错误或 $(".inpt-date").datepicker();取决于哪个被评论,哪个没有。我很确定当我尝试使用 jQuery UI 和 RequiredFieldValidator 时会出现一些问题一起。在寻找解决方案时,我发现了一个仅适用于 datepicker 的部分解决方案。这对我不起作用,因为我使用其他 jQuery UI 方法,而且,如果我找到了 accordion 的部分解决方案和 datepicker稍后我可能想使用其他东西,然后我也必须找到解决方法,所以..有没有办法在 Windows Forms 中进行客户端验证将内置控件与 jQuery UI 一起使用?

最佳答案

RequiredFieldValidator来自 ASP.NET 的 jQuery 客户端需要先注册(参见 here)。

显然,ASP.NET 注入(inject)了 <script>在表单的第一部分引用 jQuery。

如果您注册了自己的<script> <head> 内的标签您的页面(首先是 jQuery,然后是 jQuery UI),这实际上意味着您正在丢失您的 jQuery UI 绑定(bind),因为在 <head> 之后再次引用了 jQuery感谢 WebForms。

解决方案是在 处引用您的脚本(jQuery、jQuery UI 和任何自定义脚本)。结束页面,例如在表单元素之后。

关于asp.net - RequiredFieldValidator 不能与 jQuery UI 一起正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25506846/

相关文章:

javascript - 如何在jQuery中触发更改事件

asp.net - 在asp.net中引用jquery的最佳方法是什么?

jquery-ui - jQuery UI 选项卡 : how to send ajax request with post data?

c# - 如何将文件从ASP页面移交给C#函数?

asp.net - 在Gridview中隐藏行时更新分页页面

.net - Umbraco 学习资源?

javascript - 获取网格上div的位置

javascript - 引导布局 JQuery 调整大小

jquery - 响应式 jQuery UI 对话框(以及对 maxWidth 错误的修复)

javascript - AngularJs 路由错误解释的 jQuery UI Datepicker hash href