JavaScript to a href troubles

Question

Basically I want to create a link that pulls data from 2 different txt files on my server.. lets say #addr and #price

I want my link to look something like..

"bitcoin:' + addr + '?amount=' + price"

Example...

bitcoin:1MgsAHrjke9r769sH5pZdWoC1CcYXZY6oT?amount=0.000456

I have this code pulling the price and addr..

<script>
$(document).ready(function(){
     $("#price").load('http://xxxxx.com/price.txt');


});
</script>


<script>
$(document).ready(function(){
     $("#addr").load('http://xxxxx.com/addr.txt');


});
</script>

EDIT: Using working code in answer:

Last thing i can't figure out.. how to get...

"<a href='bitcoin:" + $("#addr").text() + "?amount=" + $("#price").text() + "'>TEXTHERE</a>";

to only show the #addr data where TEXTHERE is.. apparently i'm terrible at structuring these links.

Code seems to work at pulling my correct data strings.. just have no clue how to make a working link!

Anyone help? THANK YOU!

Scott Marcus · Accepted Answer · 2018-01-29T14:55:31.820

2

You just concatenate the values you placed into the elements. But, you have to wait for the two .load() calls to complete before you can use the values returned from the AJAX calls that they make. To ensure that you don't act before the results come back, you pass a function as the second argument to .load() that should be called when the call is complete. After the first call, we pass a function that makes the second call and to that second call, we pass a function that completes the operation.

Also, there's no need for two scripts and two document.load callbacks.

$(document).ready(function(){

  // You need to wait for the .load calls to complete before you can use the results
  $("#price").load('http://xxxxx.com/price.txt', function(){
    $("#addr").load('http://xxxxx.com/addr.txt', function(){
  
      var link = 
       "<a href='bitcoin:" + $("#addr").text() + "?amount=" + $("#price").text() + "'>" + $("#addr").text() + "</a>";

       // And then append the link where you need it:
       $(document.body).append(link); 
       console.log($("a")[0].href);
 
    });
  });
     
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="price">67.54</div>
<div id="addr">123welkjwekj133131@#232</div>

But, as @guest271314 points out, the :bitcoin protocol portion of that href may not be recognized by the client, so you will need to let the browser know what it means and how to use it by calling: navigator.registerProtocolHandler() prior to the code I've shown.

edited Jan 29 '18 at 14:55

answered Jan 28 '18 at 22:29

Scott Marcus

64,069
6
49
71

Thank you so much for the quick response Scott. No link shows up when I copy that code (and replace the links obviously). I should have mentioned in my original post I want the link to show up as the #addr text. I will also look into the navigator protocol. Thanks for the tip! – largeanincharge Jan 28 '18 at 22:39
@largeanincharge If you are building the entire `a` element, then you need to use the `.append()` method to get the HTML string parsed and a new element created. If you have a pre-existing `a` element, we can just update the `href` attribute on it with the new string value. So, changing the `#addr` element's text alone won't do it. Also, check your Console tab of your Developer's Tools to make sure you don't have any other errors. – Scott Marcus Jan 28 '18 at 22:42
@largeanincharge I have updated my answer and fixed a typo. – Scott Marcus Jan 28 '18 at 22:47
@guest271314 Ah yes. I was focused on the link construction. ;) – Scott Marcus Jan 28 '18 at 22:50
@The code can be located anywhere you like (in the `head` or at the end of the `body` is fine). Because of the `document.ready()`, the code won't run until the entire HTML contents have been read. – Scott Marcus Jan 28 '18 at 23:12
Soo l have the price and addr data still loading the divs correctly with your code, however i still can't get a clickable link to show up for the life of me. – largeanincharge Jan 28 '18 at 23:25
My HTML is statically loaded with sample data because I can't make the `.load()` calls work here in this environment. Don't use my HTML. I'm afraid I can't be of more assistance without seeing all your code. Can you update your question to include all the relevant code? – Scott Marcus Jan 28 '18 at 23:30
Got everything working perfectly now. Thank you soo much. I really appreciate your time. – largeanincharge Jan 28 '18 at 23:51
@largeanincharge Please mark my answer as "the" answer and up vote as well. – Scott Marcus Jan 29 '18 at 01:55
Done! Also updated the original question with one more little problem i'm having ;) – largeanincharge Jan 29 '18 at 02:26

score 0 · Answer 2 · answered Jan 28 '18 at 22:26

0

Use navigator.registerProtocolHandler() to register the bitcoin: protocol at a specific origin, see How to Create a Mailto Share Button that Opens a Window in which Ones Can Enter Email Address to Send to.

answered Jan 28 '18 at 22:26

guest271314

1
15
104
177

Sorry to sound ignorant but I have no clue what that means or how to implement that. I usually do pretty okay with html from just googling my problems but this one has been bugging me for quite some time with none of my efforts fixing it. – largeanincharge Jan 28 '18 at 22:28
@largeanincharge Have you read the lined Question and answers? See also https://developer.mozilla.org/en-US/docs/Web/API/Navigator/registerProtocolHandler – guest271314 Jan 28 '18 at 22:29
Will look more into that once I can get the darn link to even show up! lol – largeanincharge Jan 28 '18 at 23:09

JavaScript to a href troubles

2 Answers2