asp.net webform中的bootstrap popover

时间:2017-10-05 15:41:21

标签: asp.net twitter-bootstrap

我想使用asp.net尝试使用bootstrap pop 香港专业教育学院已经尝试并寻找方法来做到这一点

  

function pageLoad(sender,args){               $( '[数据肘节= “酥料饼”]')。酥料饼({                   html:是的,                   安置:“底部”,                   content:function(){                       return $('#PopoverConditionMasterPart')。html();                   }               });
          };   但仍然没有明显的弹出迹象。

在我的调试器中,我发现$未定义的错误和.popover不是函数

另一个问题是本教程的大部分内容都在MVC中

有人可以给我建议或更好的解释。

提前致谢并继续!

这是我目前的工作:

的CSS:

<asp:Content ID="Content2" ContentPlaceHolderID="css" runat="server">
<link href="Content/bootstrap.css" rel="stylesheet" />
</asp:Content>

HTML:

<asp:Content ID="Content3" ContentPlaceHolderID="body" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div class="row">
    <div class="col-md-2 col-lg-2">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Label runat="server" data-toggle="popover" data-placement='bottom' title="sample" ID="lblConditionMasterPart" CssClass="form-control popover PopoverConditionMasterPart" Text="click me" Style="cursor: pointer;"></asp:Label>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdatePanel ID="UpdatePanel9" runat="server">
            <ContentTemplate>
                <div id="PopoverConditionMasterPart" style="display: none;">
                    <button type= "button" title="bnt1" class="form-control btn btn-secondary"> btn1</button>  
                    <button type= "button" title="bnt1" class="form-control btn btn-primary"> btn2</button>            
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</div>
</asp:Content>

脚本:

<asp:Content ID="Content4" ContentPlaceHolderID="script" runat="server">
<script src="Scripts/jquery-3.2.1.js" type="text/javascript"></script>
<script src="Scripts/bootstrap.js" type="text/javascript"></script>
<script type="text/javascript">

    function pageLoad(sender, args) {
        $('[data-toggle="popover"]').popover({
            html: true,
            placement: "bottom",
            content: function () {
                return $('#PopoverConditionMasterPart').html();
            }
        });
    };
</script>
</asp:Content>

1 个答案:

答案 0 :(得分:0)

看来你正在定义一个pageLoad函数但从不调用它。您可以准备好调用它,但为什么不只是执行函数在页面加载时执行的操作:

<script type="text/javascript"> 
    $(document).ready(

        $('[data-toggle="popover"]').popover({ 
            html: true, 
            placement: "bottom", 
            content: function () { 
                         return $('#PopoverConditionMasterPart').html(); 
                      }
            }); 
     }); 
</script>