Develop Reference

Directive on ready function should only execute once

Hi Experts I have a directive 'my-table' in which there is a button for edit record.
Inside directive template (html file) I have a button
<a data-activates="editScreen" class="button-collapse">Edit
</a>
Inside JS file
angular.element(document).ready(function () {
$('.button-collapse').sideNav({
menuWidth: 450,
edge: 'right',
closeOnClick: true
});
})
I want to initialize sideNav on document ready function
Problem is this directive call in loop and every time directive called this code execute that will create problem. (So many Backdrop classes in view that will not let side nav close as expected)
I want this code to execute only once.
How can I solve this issue.
Thanks in Advance

Just use a true directive, something like this :
angular.module('[moduleName]').directive('buttonCollapse', function(){
return{
restrict:'C',
link:function(scope, element, attrs){
$(element).sideNav({
menuWidth: 450,
edge: 'right',
closeOnClick: true
});
}
}
})

Changing the text of a twitter bootstrap modal dynamically

I have a twitter bootstrap modal on a page and it works pretty well. However, sometimes I want to change its caption and body dynamically while it's being shown.
How do I do that?
function showModal(){
$("#ajaxModal").modal({keyboard: false, show: true, backdrop: 'static'});
}
function hideModal(){
$("#ajaxModal").modal('hide');
}
///.............
showModal();
//.........
hideModal();

I had worked on same scenario..here is the example may be it works for you..
This is just sample scenario.. i had find the element in the modal myModal and passed my value, i had passed dynamically 'alertMsg'
$('#myModal').find('p').html('<span style="color:#4F2817;">'+alertMsg+'</span>');

jQuery UI Accordian: How to keep a particular window open by default?

By default the first accordion window stays open, how can I specify a different one to be open by default instead of the first?
http://jqueryui.com/demos/accordion/#default
$('.accordian').accordion({
collapsible: true
});

You can try to use active = 2
Try:
$(".accordian").accordion({
collapsible: true,
active: 2
});
Or:
$(".accordian").activate(index); //for example replace index with 2

jquery accordion collapsed by default on page load

I am using JQuery UI accordion in my page. I have following Javascript code on my page load:
$(function() {
$("#accordion").accordion({
active: false,
autoHeight: false,
navigation: true,
collapsible: true
});
});
When the page loads all tabs are open for few seconds and then collapse. May be its loading effect. How can I make Jquery UI accordion collapsed on page load. Please suggest

Although not a direct answer, maybe you can render it hidden and then show it when its created:
$("#accordion").accordion({
active: false,
autoHeight: false,
navigation: true,
collapsible: true,
create: function(event, ui) { $("#accordion").show(); }
});
Update: This fiddle works for me: http://jsfiddle.net/47aSC/6/

For me this works:
$(function() {
$( "#accordion" ).accordion({
collapsible: true,
autoHeight: true,
active: false
});
});

It's probably loading something near the end of the page slowly. If you can't fix that, you could try declaring the element having display:none applied to it in css, then:
$("#accordion").show().accordion({
active: false,
autoHeight: false,
navigation: true,
collapsible: true
});
There could be a cleaner way of doing that (as #Mrchief suggests), but I don't think .accordion() formats hidden elements nicely. You'll have to test.

The best solution is:
open jquery.ui.accordion.js and edit lines 29 and 31 (by the way I'm using 1.10.4).
Edit line 29 to Active: 100,
Edit line 31 to collapsible: true,
This way you don't need to write any script or function in the header of the page. By setting Active to a high number (for example 100) you are saying that 100th h3 tag is active (which basically doesn't exist).
The collapsible: true says that all open h3 tags are collapsible.
It solves the problem completely.

$(document).ready(function() {
$('.collapse').collapse({
toggle: false
});
});
This will set all .collapse classes in DOM to close, but only once the DOM has finished loading.

// We can also use the below code to collapse accordian on the page load and it should use when we are using bootstrap 2.0
$(document).ready(function () {
if ($("#accordianId").length>0) {
$("#accordianId").trigger("click");
}
});
Other wise we should use below code for bootstrap 3.0
$( "#accordianId" ).accordion( "option", "active", 0 );

jQuery Accordion Closed at Load

How can I get the accordion widget to be closed when the page loads? This is the code I'm using:
//Accordion
$( ".accordion" ).accordion({
autoHeight: false,
navigation: true,
collapsible: true,
active: false
});
Also, it may be unimportant but the accordion divs are inside dialog divs.

The active option being set to false should (according to the docs) cause the menu to be collapsed on page-load (though it specifically requires collapsible: true (which you already have).
If this isn't already in a $(window).load() or $(document).ready() then it needs to be wrapped in one of those; if it is so wrapped then without a demo (perhaps JS Fiddle, or JS Bin?) it's difficult to suggest what might be happening, or going wrong.
Is the remainder of the JavaScript (beyond the call to .accordion() being executed? If not there might be a JS error, somewhere. It might be worth running it through JS Lint to be sure.

The index value can be boolean or integer
<script language="javascript" type="text/javascript">
$(function () {
var activeIndex = parseInt($('#<%=AccordionIndexHidden.ClientID %>').val());
if (activeIndex < 0)
activeIndex = false;
$("#accordion").accordion({
autoHeight: false,
event: "mousedown",
active: activeIndex,
change: function (event, ui) {
var index = $(this).children('h3').index(ui.newHeader);
$('#<%=AccordionIndexHidden.ClientID %>').val(index);
}
});
});
</script>
Remember to start with index less than 0
<asp:HiddenField ID="AccordionIndexHidden" runat="server" Value="-1" />
FYI, the hidden field is to keep save the accordions open between postbacks