Jump to content

jQuery changing attribute not working properly?


wongadob

Recommended Posts

I have this jQuery function

   if (appViewArray.cntNotifications==0)   {	$('#unreadbox_notifications').attr('visibility','hidden');   }   else   {	$('#unreadbox_notifications').attr('visibility','visible');   }

This is the HTML it is moding

<div id = "unreadbox_notifications" class = "unread_box"><span id = "unread_notifications" data-bind = "text: cntNotifications"></span></div>

But when it is called it is not updating the HTML properly. This is what it does to that line of HTML

<div id="unreadbox_notifications" class="unread_box" visibility="hidden"><span id="unread_notifications" data-bind="text: cntNotifications">0</span></div>

Note that it surely should be

style="visibility='hidden';"

Should it not, anyway it actually works for visible objects (I guess becuase the default is visible) but when it should become invisible, it does not. I have no idea what I am doing wrong. There is no CSS defined for visibility in the code. I did have some but removed it as I thought it was over ridding the jQuery change. I also had style="visibility='hidden';" within the HTML but all that happened was it did this

<div id="unreadbox_notifications" class="unread_box" style="visibility='hidden';" visibility="hidden"><span id="unread_notifications" data-bind="text: cntNotifications">0</span></div>

Any ideas?

<div id="unreadbox_notifications" class="unread_box" visibility="hidden"><span id="unread_notifications" data-bind="text: cntNotifications">0</span></div>

Link to comment
Share on other sites

You should be using style attribute, but really you should be applying it with css function if (appViewArray.cntNotifications==0) { $('#unreadbox_notifications').css({'visibility': 'hidden'}); } else { $('#unreadbox_notifications').css({'visibility': 'visible'}); }OR use a class name instead

.showthis {visibility': visible; } }.hidethis {visibility': hidden; }}

<div id="unreadbox_notifications" class="unread_box hidethis"><span id="unread_notifications" data-bind="text: cntNotifications">0</span></div>

if (appViewArray.cntNotifications==0)   {        $('#unreadbox_notifications').removeClass('showthis').addClass('hidethis');   }   else   {        $('#unreadbox_notifications').removeClass('hidethis').addClass('showthis');   }

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...