CODEWITHSUNDEEP
javascripthtmljqueryasp.netasp.net-mvc
eddie evt
eddie evt

Reputation: 59

Replace/Generate HTML content in div dynamically | .NET + JQuery

I am trying to display/replace the HTML content inside a div according to a pressed pushpin in Bing Maps. I know I should be looking at JQuery .html() but I can't see how I can put a variable inside the HTML tags.

Example code:

function pushpinClickedCallback(e) {
        if (e.target.metadata) {
            var data = e.target.metadata.title;  <-- how to make this include the JS variable and HTML tags
            $('#infoPane').html(data);
        }
// var e above is a pushpin in Bing Maps, infoPane is the div

Every time the callback is fired there is different data to be displayed. Should I even be looking at doing it this way? Or should I create a new div and destroy it each time (inefficient if pressing the same pushpin many times quickly)?

Upvotes: 1

Views: 379

Answers (1)

Suncat2000
Suncat2000

Reputation: 1086

Your variable data will contain a string. Manipulate the string using JavaScript string functions to replace your title string and add whatever HTML tags you need. For example:

var data = e.target.metadata.title; // "Pushpin title"
var htmlString = "<div class=\"pin-text\">" + data + "</div>";
$("#infoPane").html(htmlString); // Replace infoPane element contents

Upvotes: 2

Related Questions