Answered by:
show popover from code behind

Question
-
User-1605638221 posted
Hi,
In my gridview header, i have user names and what I need is, to display user details, in bootstrap popover when user click on the user name.
I tried below just to check if can get the popover to display from code behind but it did not work:
ASPX:
<a href="#" id="popover">the popover link</a> <div id="popover-head" class="hide"> some title <button type="button" class="close" data-dismiss="popover" aria-hidden="true">×</button> </div> <div id="popover-content" class="hide"> <input type="text" id="txtInput" /> <button type="button" id="btn" class="clickme" value="Calc" ></button> </div>
Code behind:
Protected Sub I1_Click(sender As Object, e As System.EventArgs) Handles I1.Click Dim sb As New System.Text.StringBuilder sb.Append("<script type='text/javascript'>") sb.Append("$('#popover').popover({") sb.Append("html: true,") sb.Append("title: function () {") sb.Append("return $(""#popover-head"").html();") sb.Append("},") sb.Append("content: function () {") sb.Append("return $(""#popover-content"").html();") sb.Append("}});") sb.Append("</script>") ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "popoverscript", sb.ToString(), False) End Sub
How can I call a popover from the code behind or any alternatives? Help please...
Thanks, Navin
Tuesday, January 14, 2014 11:44 PM
Answers
-
User-760709272 posted
You can't call javasscript from code-behind. If all you want to do is show the popup then you'll need to use javascript. Embed the javascript as normal in the page and attach a click event to the button and run your javascript on that event.
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Wednesday, January 15, 2014 4:34 AM -
User281315223 posted
Are you receiving any errors within the Console section using the Developer Tools (F12) within your browser?
It's likely that your jQuery code is not executing because the jQuery library itself may not be ready when you attempt to call that function. You'll likely want to wrap it within a "document-ready" block as seen below and call the RegisterStartupScript method :
'Build your script' Dim script = "$(function(){ $('#popover').popover({ html: true, title: function () { return $('#popover-head').html(); }, content: function () { return $('#popover-content').html();}});});" 'Wire up your actual script' ClientScript.RegisterStartupScript(Me, Me.GetType(),"popoverscript", script, True)
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Wednesday, January 15, 2014 12:39 PM
All replies
-
User-760709272 posted
You can't call javasscript from code-behind. If all you want to do is show the popup then you'll need to use javascript. Embed the javascript as normal in the page and attach a click event to the button and run your javascript on that event.
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Wednesday, January 15, 2014 4:34 AM -
User-474980206 posted
ScriptManager.RegisterClientScriptBlock render the script right after the form tag. wrap the the code in $.ready or use ScriptManager.RegisterStartupScript which render before the </form> tag. or move the popup div before the <form>.
Wednesday, January 15, 2014 12:29 PM -
User281315223 posted
Are you receiving any errors within the Console section using the Developer Tools (F12) within your browser?
It's likely that your jQuery code is not executing because the jQuery library itself may not be ready when you attempt to call that function. You'll likely want to wrap it within a "document-ready" block as seen below and call the RegisterStartupScript method :
'Build your script' Dim script = "$(function(){ $('#popover').popover({ html: true, title: function () { return $('#popover-head').html(); }, content: function () { return $('#popover-content').html();}});});" 'Wire up your actual script' ClientScript.RegisterStartupScript(Me, Me.GetType(),"popoverscript", script, True)
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Wednesday, January 15, 2014 12:39 PM -
User1080785583 posted
use fiddler to help you define "did not work". then decide if you need a framework for a UI to help you figure out how to program some feature like popup grid, or load on demand. essentially all you need is to bind an event to your TR.
$('body').on('click', '#tableId tr', function(){
// do work
});
Thursday, January 16, 2014 11:13 AM