angularjs - Nothing happening when calling Bootstrap Modal from Angular Treeview directive -


i'm using angular treeview build hierarchy in website. i've added bootstrap dropdown each node in hierarchy, displayed when user clicks on node label. menu items displayed in dropdown different depending on type of node. i've gotten work.

now when user wants add node bootstrap modal supposed open user input. i'm stuck, modal not called @ all. i've gotten functions within directive working using $(".dropdown > ul.dropdown-menu").html($compile(appendthis)(scope));, if want open model defined in directive template not work.

i've tried solutions here , here, not working.

here simplified version of directive template:

template = '<div class="modal hide fade" id="addthisnode"">'+     '<div class="modal-body">'+             '<p>this node body</p>'+     '</div>'+ '</div>'+  '<div class="modal hide fade" id="addothernode"">'+     '<div class="modal-body">'+             '<p>other node body</p>'+     '</div>'+ '</div>'+ '<ul>' +        '<li data-ng-repeat="node in ' + treemodel + '">' +            '<i class="normal" '+                    'data-ng-hide="node.' + nodechildren + '.length">'+        '</i> ' +         // call funcion when         // node label clicked         '<span class="treenode {{node.' + nodetype + '}}" '+               'id="{{node.' + nodeid + '}}"'+               'data-ng-class="node.selected" '+               'data-ng-click="' + treeid +               '.selectnodelabel(node)">'+               '{{node.' + nodelabel + '}}'+         '</span>' +          // bootstap dropdown menu         '<div class="dropdown" data-ng-show="node.selected">'+               '<a data-toggle="dropdown"><span class="caret"></span></a>'+               '<ul class="dropdown-menu">'+                     // list items appended here               '</ul>'+         '</div>'+     '</li>' + '</ul>';

if user clicks node label function called:

scope[treeid].selectnodelabel = scope[treeid].selectnodelabel || function( selectednode ) {     // set currentnode     scope[treeid].currentnode = selectednode;     // node type     var nodetype = scope[treeid].currentnode.nodetype;     var appendthis = '';    if (nodetype == 'this'){        appendthis = '<li><a data-target="#addthisnode" href="" data-toggle="modal">add node</a></li>';    }    else if (nodetype == 'other'){        appendthis = '<li><a data-target="#addothernode" href="" data-toggle="modal">add other node</a></li>';    }     $(".dropdown > ul.dropdown-menu").html($compile(appendthis)(scope)); };

sorry if confusing, it's confusing me well. if have tips on calling modals inside directive appreciated.

after searching through lot of posts able find answer. i'm posting here in case can else.

i changed structure of template bit, functionality stays same. actual problem in compiling template. worked when compiled this:

$(".dropdown > ul.dropdown-menu").html(appendthis); $compile($(".dropdown > ul.dropdown-menu").contents())(scope);

Comments

Post a Comment

Popular posts from this blog

jquery - How do you format the date used in the popover widget title of FullCalendar? -

Image
in fullcalendar, how format date used in popover widget title when clicking '+n more'? code: <div class="fc-popover fc-more-popover"> <div class="fc-header fc-widget-header"> <span class="fc-close fc-icon fc-icon-x"></span> <span class="fc-title">tuesday, april 7</span> ... </div> ... </div> you use daypopoverformat that. determines date format of title of popover created eventlimitclick option. must date formatting string. default value "dddd, mmmm d" english , "ll" other languages.
Read more

asp.net mvc - SSO between MVCForum and Umbraco7 -

i need integrate sso between mvcforum (forum of company) , umbraco7 (manages cms company). however struggling shared authentication work. tried several ways suggested on other threads still not running expected. here did: 1. in mvcforum (forum.mywebsite.com) 1.1. machine key in web.xml: <machinekey validationkey="the same key umbraco7" decryptionkey="the same key umbraco7" validation="sha1" decryption="aes" /> 1.2. authenticate forms in web.xml <forms name="my-sso-auth" protection="all" path="/" timeout="43200" domain="forum.mywebsite.com" loginurl="/members/logon" enablecrossappredirects="true" /> 2. in umbraco7 (news.mywebsite.com) 2.1. machine key in web.xml: <machinekey validationkey="the same key mvcforum" decryptionkey="the same key mvcforum" validation="sha1" decryption="aes" /> 2.2. a...
Read more

Python Tkinter keyboard using bind -

i have problem using bind option can click button in keyboard, , call function once key pressed. tried taking other codes have similar purpose , saw i'm doing pretty same, though still have problem must've missed. thankful if me this. here's code: # -*- coding: utf-8 -*- #imports tkinter import * pil import imagetk, image import time import tkmessagebox #===========================================================================================================================================# #tkinter class class app(frame): def __init__(self, master=none): frame.__init__(self, master) self.pack() #===========================================================================================================================================# #game pieces classes class board: def __init__(self, rows = 7, columns = 6, picture_height = none, picture_width = none): self.rows = rows self.columns = columns self.picture ...
Read more