我有一个页面,它根据用户交互添加动态部分视图.同样可以添加相同的局部视图.每个部分视图通过
JQuery和AJAX执行提交.什么是避免页面上的ID重复的最佳方法.这非常重要,因为JQuery函数使用ID选择器.请给我一个解决方案.
部分View1
<script type="text/javascript"> $(function () { $("#MyButton1") .button() .click(function () { alert("MyButton1 clicked From MyForm1 "); }); }); </script> <div><p>MyForm1</p></div> <form id="MyForm1" > <input id="MyButton1" type="button" value="buttonFromPartial1" /> </form>
部分View2
<script type="text/javascript"> $(function () { $("#MyButton1") .button() .click(function () { alert("MyButton1 clicked From MyForm2 "); }); }); </script> <div><p>MyForm2</p></div> <form id="MyForm2" > <input id="MyButton1" type="button" value="buttonFromPartial2" /> </form>
解决方法
在服务器端或客户端创建生成随机ID的帮助程序或javascript代码.
在视图示例中的服务器端的C#函数:
@function string GenerateId(string prefix) { return string.Format("{0}_{1}",prefix,Guid.NewGuid().ToString("N")); }
视图示例中客户端的Javascript函数:
function generateId(string prefix) { return prefix + Math.floor((1 + Math.random()) * 0x10000) .toString(16) .substring(1); };
在局部视图内部创建一个包含生成值的变量并使用它.
@var buttonId = GenerateId("button") // buttonId = "button_85021948560128" ...
这样,每个局部视图都将生成自己的唯一ID.