Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
220 views
in Technique[技术] by (71.8m points)

javascript - why contend show multiple time in angular while using ajax call?

I have two problem in my demo .I am making a pop over .I should open on icon click(here is used star icon).when i click star icon I am able to see pop up screen as I want but problem is that when I click another icon /star icon it open another pop over without closing the first one pop over.I need to display pop over one at time..

  • 1 ) can we show pop over one at one time .it show only one pop over at one time.

    2)when I include in my plunker (tooltip.js and pop over plugin).It show the contend on mouseover event .but when i remove this it show on click event why ?

Here is plunker with scripts tooltip and popover .display on click ?

http://plnkr.co/edit/OYiawflIBnpJ1PKx02LG?p=preview

here is the plunker with these plugin display on mouser over event why ? http://plnkr.co/edit/OYiawflIBnpJ1PKx02LG?p=preview

 <script src="https://dl.dropboxusercontent.com/s/a98aey2mlu0h511/bootstrap-tooltip.js"></script>
 <script src=" https://dl.dropboxusercontent.com/s/s1imyubboz1qjtl/bootstrap-popover.js?m="></script>

enter image description here

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Well if you are still working on the problem, following is the solution. Though I am not sure if this is the best way to do it as I'm starting with AngularJS.

var getTemplate = function(contentType, scope, element) {

    var template = $templateCache.get("templateId.html");

    $.ajax({
        type: "GET",
        url: 'pop.html',
        dataType: 'html',
        success: function(data) {
          var options = {
            content: data,
            placement: "right",
            html: true,
            date: scope.date,
        };
    $(element).popover(options);

    //FIND ALL POPOVERS AND HIDE THEM EXCEPT CURRENT ONE//
    $(element).on("show.bs.popover",function(t,e){
      $("span[mypopover]").not(this).popover('hide');
    });

  },
  error: function(data) {
    alert(data);
  }
    });

    return template;
};

Following are the lines:

$(element).on("show.bs.popover",function(t,e){
    $("span[mypopover]").not(this).popover('hide');
});

Plunker:http://plnkr.co/edit/WM0K8sdPVHSNeuIlLBim


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...