Mixing
How to call coordinates of “beacon” from c# code to .aspx code to show it in mouseover-tooltip when...
There is a big hall with machines inside. Near those machines, there are toolboxes, gear, etc. "beacons" which are tracked. All of this is displayed in a web app.
The c# code seems to know what coordinates those beacons have.
What I would like to accomplish is that these coordinates are displayed in the tooltip when you hover over the tooltip.
ASP.NET
<asp:Panel ID="DivBeacon" class=beacon runat="server" style="position:absolute;left:100px;top:100px;" >
<span class="tooltip" data-tooltip="attr"></span>
<div class="beacon-caption" >
<asp:Literal runat="server" id="LitBeacon" EnableViewState="false" >Beacon</asp:Literal>
</div>
</asp:Panel>
C#
private void ShowBeacon()
{
TableRow tableRowsBeacon = new TableRow
{
new TableRow(),
new TableRow(),
};
string x= Beacon.Properties.FirstOrDefault(p => (p.Name == "posx")).Value;
string y= Beacon.Properties.FirstOrDefault(p => (p.Name == "posy")).Value;
this.DivBeacon.Attributes.CssStyle["left"] = x+"px";
this.DivBeacon.Attributes.CssStyle["top"] = y+"px";
if ((this.Beacon != null) && !string.IsNullOrEmpty(this.Beacon.Name))
{
LitBeacon.Text = Beacon.Name + string.Format("<br/>{0:0.##}","(" + x + ", " + y + ")");
}
Unfortunately, I am unable to write it syntactically right, as the asp.net part refuses to show anything different than just text in between the "..." after "data-tooltip".
EDIT: I don't know how to clarify this more besides posting the whole code, which is quite long and I am pretty sure I am not allowed to.
The pure .css tooltip
.css
.tooltip {
color: lightsteelblue;
text-decoration: none;
cursor: help;}
[data-tooltip] {
position: relative;}
[data-tooltip]::after {
content: attr(data-tooltip);
pointer-events: none;
opacity: 0;
transition: opacity 0.5s;
display: block;
position: absolute;
bottom: 3.5em;
left: -0.75em;
width: 5em;
padding: 0.5em;
z-index: 100;
color: #000;
background-color: lightsteelblue;
border: solid 1.5px black;
border-radius: 0.5em;
}
is working, if you put some static text in it, but I can't find a way to link this to c# code.
I just have put the coordinates into the description text of beacon, it shows them there but that produces another problem: it shows too many decimals, I want just 2, but I can not use Math functions since although the coordinates are numbers it is getting them as string values from the server.
What I need is a working tooltip with coordinates in it or coordinates showing in the description of beacon
enter code here
c# css asp.net web-applications
asked Nov 19 '18 at 14:48
A. E.
12
add a comment |
There is a big hall with machines inside. Near those machines, there are toolboxes, gear, etc. "beacons" which are tracked. All of this is displayed in a web app.
The c# code seems to know what coordinates those beacons have.
What I would like to accomplish is that these coordinates are displayed in the tooltip when you hover over the tooltip.
ASP.NET
<asp:Panel ID="DivBeacon" class=beacon runat="server" style="position:absolute;left:100px;top:100px;" >
<span class="tooltip" data-tooltip="attr"></span>
<div class="beacon-caption" >
<asp:Literal runat="server" id="LitBeacon" EnableViewState="false" >Beacon</asp:Literal>
</div>
</asp:Panel>
C#
private void ShowBeacon()
{
TableRow tableRowsBeacon = new TableRow
{
new TableRow(),
new TableRow(),
};
string x= Beacon.Properties.FirstOrDefault(p => (p.Name == "posx")).Value;
string y= Beacon.Properties.FirstOrDefault(p => (p.Name == "posy")).Value;
this.DivBeacon.Attributes.CssStyle["left"] = x+"px";
this.DivBeacon.Attributes.CssStyle["top"] = y+"px";
if ((this.Beacon != null) && !string.IsNullOrEmpty(this.Beacon.Name))
{
LitBeacon.Text = Beacon.Name + string.Format("<br/>{0:0.##}","(" + x + ", " + y + ")");
}
Unfortunately, I am unable to write it syntactically right, as the asp.net part refuses to show anything different than just text in between the "..." after "data-tooltip".
EDIT: I don't know how to clarify this more besides posting the whole code, which is quite long and I am pretty sure I am not allowed to.
The pure .css tooltip
.css
.tooltip {
color: lightsteelblue;
text-decoration: none;
cursor: help;}
[data-tooltip] {
position: relative;}
[data-tooltip]::after {
content: attr(data-tooltip);
pointer-events: none;
opacity: 0;
transition: opacity 0.5s;
display: block;
position: absolute;
bottom: 3.5em;
left: -0.75em;
width: 5em;
padding: 0.5em;
z-index: 100;
color: #000;
background-color: lightsteelblue;
border: solid 1.5px black;
border-radius: 0.5em;
}
is working, if you put some static text in it, but I can't find a way to link this to c# code.
I just have put the coordinates into the description text of beacon, it shows them there but that produces another problem: it shows too many decimals, I want just 2, but I can not use Math functions since although the coordinates are numbers it is getting them as string values from the server.
What I need is a working tooltip with coordinates in it or coordinates showing in the description of beacon
enter code here
c# css asp.net web-applications
asked Nov 19 '18 at 14:48
A. E.
12
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13
add a comment |
There is a big hall with machines inside. Near those machines, there are toolboxes, gear, etc. "beacons" which are tracked. All of this is displayed in a web app.
The c# code seems to know what coordinates those beacons have.
What I would like to accomplish is that these coordinates are displayed in the tooltip when you hover over the tooltip.
ASP.NET
<asp:Panel ID="DivBeacon" class=beacon runat="server" style="position:absolute;left:100px;top:100px;" >
<span class="tooltip" data-tooltip="attr"></span>
<div class="beacon-caption" >
<asp:Literal runat="server" id="LitBeacon" EnableViewState="false" >Beacon</asp:Literal>
</div>
</asp:Panel>
C#
private void ShowBeacon()
{
TableRow tableRowsBeacon = new TableRow
{
new TableRow(),
new TableRow(),
};
string x= Beacon.Properties.FirstOrDefault(p => (p.Name == "posx")).Value;
string y= Beacon.Properties.FirstOrDefault(p => (p.Name == "posy")).Value;
this.DivBeacon.Attributes.CssStyle["left"] = x+"px";
this.DivBeacon.Attributes.CssStyle["top"] = y+"px";
if ((this.Beacon != null) && !string.IsNullOrEmpty(this.Beacon.Name))
{
LitBeacon.Text = Beacon.Name + string.Format("<br/>{0:0.##}","(" + x + ", " + y + ")");
}
Unfortunately, I am unable to write it syntactically right, as the asp.net part refuses to show anything different than just text in between the "..." after "data-tooltip".
EDIT: I don't know how to clarify this more besides posting the whole code, which is quite long and I am pretty sure I am not allowed to.
The pure .css tooltip
.css
.tooltip {
color: lightsteelblue;
text-decoration: none;
cursor: help;}
[data-tooltip] {
position: relative;}
[data-tooltip]::after {
content: attr(data-tooltip);
pointer-events: none;
opacity: 0;
transition: opacity 0.5s;
display: block;
position: absolute;
bottom: 3.5em;
left: -0.75em;
width: 5em;
padding: 0.5em;
z-index: 100;
color: #000;
background-color: lightsteelblue;
border: solid 1.5px black;
border-radius: 0.5em;
}
is working, if you put some static text in it, but I can't find a way to link this to c# code.
I just have put the coordinates into the description text of beacon, it shows them there but that produces another problem: it shows too many decimals, I want just 2, but I can not use Math functions since although the coordinates are numbers it is getting them as string values from the server.
What I need is a working tooltip with coordinates in it or coordinates showing in the description of beacon
enter code here
c# css asp.net web-applications
asked Nov 19 '18 at 14:48
A. E.
12
There is a big hall with machines inside. Near those machines, there are toolboxes, gear, etc. "beacons" which are tracked. All of this is displayed in a web app.
The c# code seems to know what coordinates those beacons have.
What I would like to accomplish is that these coordinates are displayed in the tooltip when you hover over the tooltip.
ASP.NET
<asp:Panel ID="DivBeacon" class=beacon runat="server" style="position:absolute;left:100px;top:100px;" >
<span class="tooltip" data-tooltip="attr"></span>
<div class="beacon-caption" >
<asp:Literal runat="server" id="LitBeacon" EnableViewState="false" >Beacon</asp:Literal>
</div>
</asp:Panel>
C#
private void ShowBeacon()
{
TableRow tableRowsBeacon = new TableRow
{
new TableRow(),
new TableRow(),
};
string x= Beacon.Properties.FirstOrDefault(p => (p.Name == "posx")).Value;
string y= Beacon.Properties.FirstOrDefault(p => (p.Name == "posy")).Value;
this.DivBeacon.Attributes.CssStyle["left"] = x+"px";
this.DivBeacon.Attributes.CssStyle["top"] = y+"px";
if ((this.Beacon != null) && !string.IsNullOrEmpty(this.Beacon.Name))
{
LitBeacon.Text = Beacon.Name + string.Format("<br/>{0:0.##}","(" + x + ", " + y + ")");
}
Unfortunately, I am unable to write it syntactically right, as the asp.net part refuses to show anything different than just text in between the "..." after "data-tooltip".
EDIT: I don't know how to clarify this more besides posting the whole code, which is quite long and I am pretty sure I am not allowed to.
The pure .css tooltip
.css
.tooltip {
color: lightsteelblue;
text-decoration: none;
cursor: help;}
[data-tooltip] {
position: relative;}
[data-tooltip]::after {
content: attr(data-tooltip);
pointer-events: none;
opacity: 0;
transition: opacity 0.5s;
display: block;
position: absolute;
bottom: 3.5em;
left: -0.75em;
width: 5em;
padding: 0.5em;
z-index: 100;
color: #000;
background-color: lightsteelblue;
border: solid 1.5px black;
border-radius: 0.5em;
}
is working, if you put some static text in it, but I can't find a way to link this to c# code.
I just have put the coordinates into the description text of beacon, it shows them there but that produces another problem: it shows too many decimals, I want just 2, but I can not use Math functions since although the coordinates are numbers it is getting them as string values from the server.
What I need is a working tooltip with coordinates in it or coordinates showing in the description of beacon
enter code here
c# css asp.net web-applications
c# css asp.net web-applications
asked Nov 19 '18 at 14:48
A. E.
12
asked Nov 19 '18 at 14:48
A. E.
12
edited Nov 21 '18 at 15:53
asked Nov 19 '18 at 14:48
A. E.
12
asked Nov 19 '18 at 14:48
A. E.
12
asked Nov 19 '18 at 14:48
A. E.
12
12
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13
add a comment |
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377089%2fhow-to-call-coordinates-of-beacon-from-c-sharp-code-to-aspx-code-to-show-it-i%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377089%2fhow-to-call-coordinates-of-beacon-from-c-sharp-code-to-aspx-code-to-show-it-i%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
do the data attributes on your button work? if so you can use them to make a pure css tooltip
– Pete
Nov 19 '18 at 15:00
this is actually the problem, they do not work. the tooltip is pure css. How do I link that data attributes correctly, I didn't find anything good about this on the internet.
– A. E.
Nov 19 '18 at 15:08
then you need to show us your rendered html and the css that you are using for your tooltip in a Minimal, Complete, and Verifiable example. Please edit your question and use the snippet button to add your code
– Pete
Nov 19 '18 at 15:11
Or follow this guide - it's pretty comprehensive: webdesignerhut.com/pure-css-tooltips-with-html5-data-attribute
– Pete
Nov 19 '18 at 15:13