Sammy.js conflict with other javascript files

[mohammad raza]

I am working on SPA, using handlebars (as a templating framework) and Sammy.js. There is an issue, i.e, some of the animations that need jquery, are not working properly, unless the page is refreshed. These animations only works when i put there relevant jquery/javascript code in the template... well it seems like it cannot access that script from its separate file...

the heirarchy of including my script files is this:

IN HEAD PORTION:

<script src="js/jquery.js"></script>

<script src="js/bootstrap.min.js" type="text/javascript"></script>

<script src="js/docs.min.js" type="text/javascript"></script>

<script src="js/scripts.js" type="text/javascript"></script>

<script src="js/superfish.min.js" type="text/javascript"></script>

<script src="js/jQueryTab.js"></script>

<script src="js/jquery.bxslider.js"></script>

IN BODY AT THE END:

<script src="js/sammy.js"></script> 

<script type="text/javascript" src="js/handlebars-v1.3.0.js"></script> 

<script type="text/javascript" src="js/sammy.handlebars.js"></script> 

<script src="js/singlePageAppScript.js"></script> 

<!--<script type="text/javascript" src="js/myScriptTestTmpl2.js"></script> --> 

<!--<script type="text/javascript" src="js/script.js"></script>--> 

<script type="text/javascript" src="js/rootURL.js"></script> 

<script src="js/vendor/jquery.ui.widget.js"></script> 

<script src="js/jquery.iframe-transport.js"></script> 

<script src="js/jquery.fileupload.js"></script> 

<script type="text/javascript" src="select2-3.4.5/select2.js"></script>

I tried to solve this issue by changing the heirarchy of these files. but issue did not resolved. 

Before it was making more issues, that are solved by making some of my scripts running on window.load event instead of running on document.ready.

Please help me out of this problem. Thanks

[Mike Aguilar]

My guess is you either have a timing issue or you need to rebind the animation to an element in the Handlebars template once it is bound to the DOM. If it is a timing issue you can try using setTimeout to load the animation. If it is not a timing issue, but a binding issue then you will need to determine what DOM element the animation is binding to and rebind it after the Handlebars template is attached to the DOM. For example if I needed to rebind a click handler to a handlebars template I would have to do something like:

$("#idOfElement").on("click", function(e) {

     // Callback logic here

});

Hope this helps.

Mike

--
You received this message because you are subscribed to the Google Groups "Sammy.js" group.
To unsubscribe from this group and stop receiving emails from it, send an email to sammyjs+u...@googlegroups.com.
To post to this group, send email to sam...@googlegroups.com.
Visit this group at http://groups.google.com/group/sammyjs.
For more options, visit https://groups.google.com/d/optout.

[mohammad raza]

Mike Thanks for your nice reply...

I tried to sought my problem out using your given tips, but m failed... I used setTimeout, but it still needed to reload the page. And the other thing is, can u please tell me how can i rebind after the Handlebars template is attached to the DOM, i tried it by myself, with in the sammy route, but it did not work...

[Mike Aguilar]

Hi mohammad,

sorry for the late response. If you need to rebind event handlers after Sammy compiles you just need to call your binding code after you compile and append your handlebars template to the DOM. Something like this:

var data = { firstName: "Mike" };

var source = $('#templateBlockID').html();

var template = Handlebars.compile(source);

$('#targetID').html(template(data));

// Now you can rebind since the DOM will be refreshed with new template.

$("#itemBindingEventHandlerTo").on("click", function(e) {

    // Handler logic here

});

[mohammad raza]

Thanks Mike, I'm really very greatful for your reply, but even after trying your suggestion, my code is still not working... i dont what is the problem, but the code is only working when it is inside the template, which is not a good practicce... :(

--
You received this message because you are subscribed to a topic in the Google Groups "Sammy.js" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/sammyjs/PXKDwgixPy0/unsubscribe.
To unsubscribe from this group and all its topics, send an email to sammyjs+u...@googlegroups.com.