通過調用webservice填充popover bootstrap

我想用AJAX調用的webservice填充popover（從bootstrap）。通過調用webservice填充popover bootstrap

我想：

$.ajax({ 
    type: "POST", 
    url: "myURL?action=fetchData&ID=123", 
    success: function(msg) { 
     $('.key_cal').popover({ 
      title:"User Profile", 
      placement:'right', 
      content:"<h5>Name: "+msg[0].firstName+"</h5>", 
      html: true 
     }); 
    } 
});

但我需要調用AJAX的酥料餅裏面填充的內容，但我不知道;你可以幫我嗎？

現在，而不是在我的網址（AJAX）與123硬編碼ID我想使用點擊popover的元素的ID。（我已通過每個元素的ID作爲一個關鍵）

非常感謝提前。

來源

2013-07-15 Shima Mdz

您的JavaScript不完整且格式不正確。你能證明它更具可讀性嗎？ –

$('.key_cal').on('click', function (e) { 
    e.preventDefault(); 

    var id = this.id; 
    var $this = $(this); 

    $.ajax({ 
     type: "POST", 
     url: "myURL?action=fetchData&ID=" + id 
    }).done(function (msg) { 
     $this.popover({ 
      title: 'myTitle', 
      content: function() { 
       return "<h5>Name: " + msg[0].firstName + "</h5>"; 
      }, 
      html: true 
     }).popover('show'); 
    }); 
});

希望這會有所幫助，但我不知道爲什麼你在URL（查詢字符串）爲POST請求發送數據？相反，您可以將其指定爲ajax調用的data對象。

來源

2013-07-15 09:18:37

你需要給每個key-cal或者你正在使用popover的任何類，而不是激發AJAX上的popover。

$(document).ready() { 
    $(".key-cal").hover(setPopover); 
} 

function setPopover() { 
     var myTitle = ""; 
     var myContent = ""; 
     var myHtml = true; 
     $.ajax({ 
      // Go grab your data 
      data: 'id=' + $(this).prop('id'), 
      success: //Set your variables 
     }); 
     $(this).popover({ 
      title: myTitle, 
      content: myContent, 
      html: true 
     }).popover('show'); 
    }, function() { 
     $(this).popover('hide'); 
    }); 
}

這不是最好或最有效的方式，但它應該對你有意義，並允許你從那裏走。懸停時觸發popover ajax調用，設置數據，然後顯示彈出窗口。

來源

2013-07-15 04:13:00

通過調用webservice填充popover bootstrap

回答

相關問題