CODEWITHSUNDEEP
jquerystruts2datepickerdatatablesstruts2-jquery
Ahmed
Ahmed

Reputation: 259

Struts2 jQuery Conflict - jquery dataTables and the Struts2 Jquery Plugin

I currently facing a problem of comptatibility working both with Datatables and the Struts2 Jquery Plugin. The only initialization of the struts2 jquery plugin (ie. ) makes my datatables not working anymore. when i remove my datatable workfine , but i need to use Struts2 Jquery Plugin for display and working with datepicker

I'm using this in my jsp file :

<%@taglib  uri="/struts-jquery-tags"        prefix="sx" %>
<head>  <sx:head  jquerytheme="flick" /> 
and this :
<script src="Ressource/lib/datatables/jquery.dataTables.min.js"></script>
<script src="Ressource/lib/datatables/jquery.dataTables.sorting.js"></script>

I need to use both in my project or if they are another way to submit datepicker

Upvotes: 0

Views: 869

Answers (1)

Ahmed
Ahmed

Reputation: 259

i was solve this conflict by using this 

<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<sx:head />
</head>

instead of 

<%@taglib  uri="/struts-jquery-tags"    prefix="sx" %><
    <html>
    <head>
    <sx:head  jquerytheme="flick" />
    </head>

and use datapicker like that :

<sx:datetimepicker name="name"  label="date" displayFormat="dd/mm/yy"                                                               value="today" />    
enter code here

solution 2

Now all work fine i'm using struts2-jquery-plugin-3.7.1.jar with jquery-min.js 1.7.2 , the$() syntax is always used by other scripting library, and causing the conflict issue and fail to call the jQuery function.Now i use this 

$j=jQuery.noConflict();
$j(document).ready(function() {
   dt_b: function() {
        $j('#dt_b').dataTable({
            "sScrollX": "100%",
            "sScrollXInner": '110%',
            "sPaginationType": "bootstrap",
            "bScrollCollapse": true 
             ......
        });
    },
});

Instead of 

$(document).ready(function() {
  dt_b: function() {
        $j('#dt_b').dataTable({
            "sScrollX": "100%",
            "sScrollXInner": '110%',
            "sPaginationType": "bootstrap",
            "bScrollCollapse": true 
             ......
        });
    },
});

Thank you

Upvotes: 2

Related Questions