Vishal Patwardhan
Vishal Patwardhan

Reputation: 317

JS not applied for dynamically generated HTML

I m using www.redips.net/ for drag/drop of objects its same as jquery but problem is that if I put everything as Static HTML then it working fine.If I generate dynamically HTML (which is must) then one of js library redips-drag-min fails to apply & drag-drop not working.

I found one solution to add reference to that js dynamically after all HTML has been created like this

        var ssioCss = document.createElement("script");
        ssioCss.setAttribute("type", "text/javascript");
        ssioCss.setAttribute("src", "../redips-drag-min.js");
        document.head.appendChild(ssioCss);

one of the css file works this way & its great but why not the JS file can anybody help ?? Thanks

Upvotes: 1

Views: 382

Answers (2)

Jai
Jai

Reputation: 74738

You can use .getScript() for loading the external js dynamically:

$.getScript("../redips-drag-min.js", function(data, textStatus, jqxhr) {
   console.log(data);
});

Upvotes: 0

sdespont
sdespont

Reputation: 14025

As you specify JQuery in your tags, you should use

  1. append, or before or after method to create elements in your page
  2. getScript to load your script
  3. Use this script to load external CSS file

    $("<link/>", {
      rel: "stylesheet",
      type: "text/css",
      href: "/styles/yourcss.css"
    }).appendTo("head");
    

Upvotes: 0

Related Questions