PHP database search result query clickable url

Question

I'm a complete novice when it comes to this so I'm surprised I've got this far in only a couple of days. I created a mysql table to hold 3 fields of information one of which will be a URL, I've got the HTML page using Ajax search and the results are coming back fine. The only issue I have, with the code below I can't make the 'WebLink" (which is the URL including https://) turn into a clickable link, you have to copy and paste it from the screen to use it. Is there any way to do this?

 // AJAX SEARCH REQUEST
        var xhr = new XMLHttpRequest();
        xhr.open('POST', "search.php", true);
        xhr.onload = function () {
          if (this.status==200) {
            var results = JSON.parse(this.response),
                wrapper = document.getElementById("results");
            wrapper.innerHTML = "";
            if (results.length > 0) {
              for(var res of results) {
                var line = document.createElement("div");
                line.innerHTML = res['SearchCode'] + " <br /> " + res['ItemDesc'] + " <br /> " + res['WebLink'];
                wrapper.appendChild(line);
              }
            } else {
              wrapper.innerHTML = "No results found, check code and try again";
            }
          } else {
            alert("ERROR LOADING FILE!");
          }
        };

Is this what you are looking for? https://stackoverflow.com/questions/5549840/jquery-keep-a-link-clickable-in-clickable-div — Mech, Aug 02 '20 at 21:28
You need to create a html link (`` element) and specify the url as its src property and also provide a value that will be the link's text. — Shadow, Aug 02 '20 at 21:43
the element makes sense, but I am not sure how I get it to work with the output of the search "res['WebLink']" if I modify that line in any way it breaks the search result (so far from current attempts) — Shotts Tech, Aug 02 '20 at 21:52

score 0 · Accepted Answer · answered Aug 02 '20 at 22:06

0

This should get you closer to what you want.

line.innerHTML = res['SearchCode'] + " <br /> " + res['ItemDesc'] + " <br /> " + "<a href='" + res['WebLink'] + "'>inner text for anchor element goes here.  Probably the ItemDesc?</a>";

answered Aug 02 '20 at 22:06

Nick

1,080
10
16

Thanks so much, that is exactly what I needed, the description would be a better fit if I can work out how to make that appear correctly but happy with the results so far. – Shotts Tech Aug 02 '20 at 22:16

PHP database search result query clickable url

1 Answers1