Thursday, March 3, 2011

JQuery - replace one string for another in .load-ed html?

I'm loading an html snippet using

$("#TemplateDump").load("Themes/default.template", function() { processTemplate() })

The html i am loading contains

<div>
`hello ##name##, your age is ##age##. 
your page is <a href="##website##">here</a>
</div>

I need to replace the ## placeholders with "joe","112" and "www.whatever.com". Is there a more jquery way of doing this rather than using straight javascript .replace? Are there any place holder replacement plugins around? using .replace in IE on the url placeholder just doesnt work either. Dont know why. By the way, the templates cant be changed.

From stackoverflow
  • try jTemplates or a simpler plugin

  • Doing a simple templating system in vanilla javascript isn't too hard.

    var myValues = {
        name : 'Joe',
        age : '112',
        website: 'http://www.whatever.com'
    };
    var myString = "hello ##name## ..."; // etc
    
    for (var key in myValues) {
        myString.replace(new RegExp("##" + key + "##", g), myValues[key]);
    }
    

    Just make sure you run this script on the HTML before it gets inserted into the document. You might want to use a different AJAX function other than load(), perhaps get()?

    $.get(
        'themes/default.template',
        {},
        function (data) {
            data = processTemplate(data);
            $('#templateDump').html(data);
        }
    );
    

0 comments:

Post a Comment