Jquery显示/隐藏中断sharepoint日期选择器功能

时间:2014-10-16 23:47:09

标签: jquery sharepoint datepicker hide show

我在sharepoint 2007中使用jquery 1.11构建了一个自定义的新编辑表单,该表单具有我基于相应的复选框显示或隐藏的自定义订单项样式字段。 jquery功能正常工作,但是现在来自sharepoint的日期选择器功能似乎不适用于我隐藏的字段,然后再次显示。当我通过删除样式标记取消隐藏元素(显示:无)时,日期选择器正常工作,但只要jquery触及它,功能就会消失。下面是我的一些代码示例。

HTML

<tr id="trtohideshow" style="display:none">
<td>Line Item Label</td>
<td>Sharepoint date field with picker<td>
</tr>

JS

//Show hide line item referral info based on check box status of Services Interested In
$("#checkboxid").on("click", function() {
    if ( $("#checkboxid").is( ":checked" ) ){
        $("#trtohideshow").show("slow");
    }else{
        $("#trtohideshow").hide("slow");
    }

1 个答案:

答案 0 :(得分:1)

最终我通过远离使用show()和hide(),并使用css类而不是将 display:none 设置为TR上的内联样式来解决这个问题。

我创建了以下CSS类:

<style>
.hiderow{
    display:none;
    visibility:hidden;
}
</style>

并将.hiderow类应用于每个TR元素:

<table>
<tr id="trtohideshow" class="hiderow">
<td>Line Item Label</td>
<td>Sharepoint date field with picker<td>
</tr>
</table>

然后在jquery函数中添加/删除行的类,具体取决于:checked,我在TR元素上使用了addClass和removeClass:

$(("#checkboxid").on("click", function() {
    if ( $(("#checkboxid").is( ":checked" ) ){
        $("#trtohideshow").removeClass("hiderow"); }else{ 
        $("#trtohideshow").addClass("hiderow");}
});

此代码专门用于NewForm.aspx,只在点击事件中添加/删除 - 如果要在EditForm.aspx上实现类似的功能,则需要添加以下内容函数进入$(document).ready以及最后一行,以便在页面加载时显示已经检查过的行:

if ( $("#checkboxid").is( ":checked" ) ){
        $("#trtohideshow").removeClass("hiderow"); }else{ 
        $("#trtohideshow").addClass("hiderow");}

这是完全相同的功能,但没有click事件,所以选择删除类或在页面加载时保持正确。希望这有助于某人。