Tag Archives: HTML

Attach event to dinamically added HTML elements with jQuery

If you have an event handler defined like this in JavaScript:

$("a[product-id]").click(edit_product);

function edit_product(event) {
    ...
}

After adding elements (nodes) dinamically (after an AJAX call for example) that fit that selector to the HTML DOM with .append() or .html(), the event won’t work on them. That’s because the element was added AFTER calling the event method that links to the function we want to execute.

To ensure all elements that fit the selector will trigger the event you have to use .on() for example with $(document) as the ancestor:

$(document).on('click', "a[product-id]", edit_product);

jquery-logo

Ref: http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements

Add Twig syntax highlight in Sublime Text 2

  1. Select the “Preferences->Browse Packages…” menu to open the folder that contains Sublime Text 2 packages.
  2. Download the Anomareh/PHP-Twig.tmbundle repository contents to a folder called PHP-Twig inside that packages folder.
  3. Move all the files inside PHP-Twig/Syntaxes folder to the PHP-Twig root folder.
  4. Restart Sublime Text 2.

You can also use the terminal to do this using git:

$ cd ~/.config/sublime-text-2/Packages/
$ git clone https://github.com/Anomareh/PHP-Twig.tmbundle.git PHP-Twig
$ mv PHP-Twig/Syntaxes/* PHP-Twig/

Once restarted you’ll see a new option called “HTML (Twig)” in “View->Syntax” menu. To automaticaly highlight files with html.twig extension just open one of them and select “View->Syntax->Open all current extension as…->HTML (Twig)”.

HTML-Twig-Sublime-Text-2