Forum Discussion

SheryBulos's avatar
SheryBulos
Ace
5 years ago

How to solve the conflict between litium jquery and the jquery that I use ?

Hello everyone,

How to solve conflict between lithium jquery and the jquery that I use ?


The scenario is as follows:


I need to have the on document ready function inside the liaAddScript however

  • if I add a script for jquery I get error in the liaAddSCript content and
  • If I didn't add a jquery script I get an error for all the $ is not a function.

Ps.  this is what I mean by jquery script

 

 

<script src="/html/assets/jquery.min.js"></script>

 

 

 

 

<@liaAddScript>
    ;(function($){
        $(document).ready(function() {
            $('table.generic').DataTable();
        } );
    })(LITHIUM.jQuery);
</@liaAddScript>

<script>
var setTablesFilters = (attrName, tableId, attrIndex) => {
    var table = $('#'+tableId).DataTable();
    let uniqueFilterList =  table.column(attrIndex).data().unique().toArray();
        return uniqueFilterList.map((val)=>{ return {'name':val, 'checked': false}});
}
</script>

 

 

 

Thanks in Advance,
Shery

  • Parshant's avatar
    Parshant
    Boss
    5 years ago

    SheryBulos,

    Your are getting error just beacuse your code is coming under script tag as well, whenever if you wish to continue to run jquery code you should use

     

    <@liaAddScript>
    ;(function($){
        $(document).ready(function() {
            $('table.generic').DataTable();
        } );
    })(LITHIUM.jQuery);

var setTablesFilters = (attrName, tableId, attrIndex) => {
    var table = $('#'+tableId).DataTable();
    let uniqueFilterList =  table.column(attrIndex).data().unique().toArray();
        return uniqueFilterList.map((val)=>{ return {'name':val, 'checked': false}});
}

</@liaAddScript>

    or script code only in

    <@liaAddScript>
var setTablesFilters = (attrName, tableId, attrIndex) => {
    var table = $('#'+tableId).DataTable();
    let uniqueFilterList =  table.column(attrIndex).data().unique().toArray();
        return uniqueFilterList.map((val)=>{ return {'name':val, 'checked': false}});
}
</@liaAddScript>

     

    • SheryBulos's avatar
      SheryBulos
      Ace
      5 years ago

      Hello Parshant 

      First of all thank you so much for your help.

      secondly when I put all the js code inside the <@liaAddacript> tag, 
      the onclick methods return "Uncaught ReferenceError: setTablesFilter is not defined at HTMLButtonElement.onclick"

  • Parshant's avatar
    Parshant
    Boss
    5 years ago

    SheryBulos, Try this code:

     

    <@liaAddScript>
    ;(function($){
        $(document).ready(function() {
            $('table.generic').DataTable();
        } );
				
			var setTablesFilters = (attrName, tableId, attrIndex) => {
			var table = $('#'+tableId).DataTable();
			let uniqueFilterList =  table.column(attrIndex).data().unique().toArray();
        return uniqueFilterList.map((val)=>{ return {'name':val, 'checked': false}});
			}					
    })(LITHIUM.jQuery);

</@liaAddScript>

     

    • SheryBulos's avatar
      SheryBulos
      Ace
      5 years ago

      Hello Parshant 

      Just to make sure that we are on the same page

      I tried this but I got the same error also 
      "Uncaught ReferenceError: setTablesFilter is not defined at HTMLButtonElement.onclick."

      <@liaAddScript>
    ;(function($){
        // all js and jquery code here
    })(LITHIUM.jQuery);

</@liaAddScript>

       

      Thanks in advance,
      Shery

      • Parshant's avatar
        Parshant
        Boss
        5 years ago

        SheryBulos , looks like library which contains setTablesFilter function is not added here in the community