Tuesday, June 30, 2015

jquery issue : object doesn't support this property or method 'dialog'

Issue#

I have a div in jsp which I am trying to show as dialog on a click event. But getting following error message while trying show a jquery dialog:

object doesn't support this property or method 'dialog'

Fix :

Possible reasons for this issues could :

1. Multiple references to Jquery library. Check if you have included jquery javascript more than once. If yes remove the duplicate references.

2. The dialog method is from the jQuery UI library. Make sure you have included jquery ui javascript.

3. If you are using any custom version of jQuery UI, please ensure it includes dialog method.

4. Also check if the browser version is obsolete. Sometime older version of IE does not support new fields and methods. Try upgrading the the browser.

Thursday, June 4, 2015

Jquery : Change Product Image on click event

Following Example shows how to use jquery to change the product image in Product Image Container.

The same example can be tested in jsfiddle (http://jsfiddle.net/sanjayingole/9que4n1p/5/)

We have a left panel and a right panel, where :

  • Left Panel contains small image icons.
  • Right Panel shows the larger image when an icon from left panel is clicked.

Javascript :


$(".imageIconLink").click(function() {
    
    var imgSrc= $(this).find("img").attr("src");
    
    $(".largeImage").attr("src", imgSrc); 
});


CSS :
.smallImage {
    height: 80px; width: 80px; border: 0px solid;
}

.largeImage {
    height: 280px; width: 380px; border: 0px solid;
}

.leftImgDiv {
    width : 20%;
    float : left;
    height : 300px;
    overflow : auto;
}

.rightImgDiv {
    width : 80%;
    float : right;
}


HTML :


<div class="leftImgDiv">
<a href="#" class="imageIconLink">
    <img class="smallImage" src="http://s7d1.scene7.com/is/image/BedBathandBeyond/33748242127673p?hei=2000&amp;wid=2000&amp;qlt=50,1" :="" border="" width="2000" height="2000"/>
</a>
    
<a href="#" class="imageIconLink">
    <img class="smallImage" src="http://www.brookstone.com/webassets/product_images/700x700/833371p.jpg" width="252" height="252"/>
    </a>    

<a href="#" class="imageIconLink">
    <img class="smallImage" src="http://slimages.macys.com/is/image/MCY/products/8/optimized/2546128_fpx.tif?01AD=31absA3WJUG8eGA5NUMCutd7x16A-v8cmsm4k_DZNgdpUvQGEe2iugA&amp;01RI=958CD8AFBE261DF&amp;01NA=&amp;wid=1320&amp;hei=1616&amp;fit=fit,1&amp;$filterlrg$"/>
</a>

<a href="#" class="imageIconLink">
    <img class="smallImage"
    src="http://www.u3j.org/wp-content/uploads/2014/07/uncategorized-amazing-where-to-buy-leather-sofa-in-malaysia-where-to-buy-leather-furniture-repair-kits-where-to-buy-leather-furniture-repair-kit-where-to-buy-leather-furniture-in-bali-where-to-bu.jpg" />
</a>
    
    
<a href="#" class="imageIconLink">
    <img class="smallImage"
    src="http://www.u3j.org/wp-content/uploads/2014/07/uncategorized-amazing-where-to-buy-leather-sofa-in-malaysia-where-to-buy-leather-furniture-repair-kits-where-to-buy-leather-furniture-repair-kit-where-to-buy-leather-furniture-in-bali-where-to-bu.jpg" />
</a>
</div>    
    
<div class="rightImgDiv">
    <img class="largeImage" src="http://s7d1.scene7.com/is/image/BedBathandBeyond/33748242127673p?hei=2000&amp;wid=2000&amp;qlt=50,1"/>
</div>





Saturday, May 30, 2015

Object doesn't support property or method 'dialog'

Object doesn't support property or method 'dialog'

Suggestions:
Check the jquery file path if its relative url.
Check for multiple references of jquery js file in final html. If its invoked from multiple times from different jsps included in one page then it might cause this exception. Better to put its reference in one common jsp file and include it once in parent jsp.

In my case I had duplicate references to following js.
<script src="include/scripts/jquery-1.8.1.min.js"></script>

Also as observed this will be fine if you have duplicate inclusion in same jsp or html , but if there are multiple child jsps with jquery inclusion, this might cause the problem.

Tuesday, March 10, 2015

Search for a String/ Jar name in SVN repository

Following command can be used :

* search for a specific String
svn list -R [[repository path]] | findstr /s "string to find" > D:\search-results.xml


* search for a specific file
svn list -R <<repository path>> | findstr [[filename]] > D:\search-results.xml

Thursday, October 9, 2014

Scroll to a specific row of the table using Jquery

Following example show  how to scroll to a specific row of the table in a div with overflow set to true. The example shown here has two tables Employees and Departments.On Clicking an employee the second table should scroll to the corresponding Depart row and highlight that row.

This example can be quickly tested on jsfiddle: http://jsfiddle.net/sanjayingole/z9gw3rb7/2/embedded/result/

 <html>
<head>
<style>
body { background-color: #EFFFEF; color: #000000; }

.tableDiv {
    border : solid 1px #000000;color: #0000FF; margin : 10px; background : #FFEFFF; height : 100px;  float : left; overflow : auto; 
}
.empDiv {
    width : 70%;
}
.empLink {
    color : #0000FF;
}
.column{
    padding-left : 10px;
}
.even {
    background : #EFDFEF;
}


</style>

<script>
function scrollIntoView(element, container) {
  var containerTop = $(container).scrollTop();
  var containerBottom = containerTop + $(container).height();
  var elemTop = element.offsetTop;
  var elemBottom = elemTop + $(element).height();
  $('tr[rel="deprow"]').removeAttr("style")
  $(element).attr("style", "background : #AFFFA0");
  if (elemTop < containerTop) {
    $(container).scrollTop(elemTop);
  } else if (elemBottom > containerBottom) {
    $(container).scrollTop(elemBottom - $(container).height());
  }
}

$(document).ready(function() {
    $('a[rel="testclick"]').click(function(){
        $('a[rel="testclick"]')
        var containerDiv = document.getElementById('departDiv');
        //var itsme = $( $.attr(this, 'href'));//document.getElementById('itsme');
        var itsme =document.getElementById($.attr(this, 'href'));
        scrollIntoView(itsme, containerDiv);

        return false;
    });
});

</script>

</head>

<body>
   
    <h1 id="top">Scroll to a specific row of the table in a div with overflow set to true .</h1>
    <p>The example shown here has two tables Employees and Departments.
     On Clicking an employee the second table should scroll to the corresponding Depart row and highlight that row.</p>
   
    <div id="employeeDiv" class="tableDiv empDiv">
     <table>
        <tbody>
           <tr class="row">
                <td class="column"><a href="dep01" rel="testclick" class="empLink">E01</a></td>
                <td  class="column">John Ramsey</td>
                <td  class="column">Software Engineer</td>
                <td  class="column">IT dept</td>
            </tr>
            <tr class="row even">
                <td class="column"><a href="dep02" rel="testclick" class="empLink">E02</a></td>
                <td  class="column">Lisa Collins</td>
                <td  class="column">HR Manager</td>
                <td  class="column">HR dept</td>
            </tr>
            <tr class="row">
                <td class="column"><a href="dep01" rel="testclick" class="empLink">E03</a></td>
                <td  class="column">David Beckham</td>
                <td  class="column">Junior Software Engineer</td>
                <td  class="column">IT dept</td>
            </tr>
            <tr class="row even">
                <td class="column"><a href="dep02" rel="testclick" class="empLink">E04</a></td>
                <td  class="column">Lisa Kudrow</td>
                <td  class="column">Sr HR Manager</td>
                <td  class="column">HR dept</td>
            </tr>   
              <tr class="row">
                <td class="column"><a href="dep01" rel="testclick" class="empLink">E05</a></td>
                <td  class="column">Tom Cruise</td>
                <td  class="column">Architect</td>
                <td  class="column">IT dept</td>
            </tr>    
              <tr class="row even">
                <td class="column"><a href="dep03" rel="testclick" class="empLink">E06</a></td>
                <td  class="column">Paula Abdul</td>
                <td  class="column">Admin Officer</td>
                <td  class="column">ADMIN Dept</td>
            </tr>    
            <tr class="row">
                <td class="column"><a href="dep04" rel="testclick" class="empLink">E07</a></td>
                <td  class="column">Tom Hanks</td>
                <td  class="column">Analyst</td>
                <td  class="column">R&amp;D</td>
            </tr>    
    </tbody>
    </table>
    </div>
<div id="departDiv" class="tableDiv">
    <table>
        <tbody>
            <tr id="dep01" class="row" rel="deprow">
                <td class="column">DEP01</td>
                <td  class="column">IT & Development</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr>
         <tr id="dep00" class="row even" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr>
            <tr id="dep00" class="row" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr>
            <tr id="dep02" class="row even" rel="deprow">
                <td class="column">DEP02</td>
                <td  class="column">HR Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row even" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr>
            <tr id="dep03" class="row even" rel="row">
                <td class="column">DEP03</td>
                <td  class="column">Admin Department</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row even" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr> <tr id="dep00" class="row even" rel="deprow">
                <td class="column">TEST</td>
                <td  class="column">TEST Depart</td>
                <td  class="column">Chicago</td>
                <td  class="column">Address : 123 ABC St, Chicago IL</td>
            </tr>
            <tr id="dep04" class="row" rel="deprow">
                <td class="column">DEP04</td>
                <td  class="column">Research &amp; Development</td>
                <td  class="column">San Francisco</td>
                <td  class="column">Address : 123 Crookedest St, San Francisco, CA</td>
            </tr>

    </tbody></table>
</div>
</body>


</html>

Friday, March 21, 2014

Weblogic 11g deployment error , loader constraint violation: when resolving field "DATETIME"

Error :

 INFO com.sun.jersey.server.impl.application.WebApplicationImpl Initiating Jersey application, version 'Jersey: 1.8 06/24/2011 12:17 PM'
<Mar 20, 2014 3:08:39 PM CDT> <Error> <HTTP> <BEA-101216> <Servlet: "jersey-serlvet" failed to preload on startup in Web application: "sampleapp".
java.lang.LinkageError: loader constraint violation: when resolving field "DATETIME" the class loader (instance of weblogic/utils/classloaders/ChangeAwareClassLoader) of the referring class, javax/xml/datatype/DatatypeConstants, and the class loader (instance of <bootloader>) for the field's resolved type, javax/xml/namespace/QName, have different Class objects for that type


Solution:

The error occurred due to a conflicts between the class provided by the weblogic and the jaxb-impl.jar packaged within ear file.

I added the jax-impl dependency in pom as 'provided' scope so that its excluded from packaging. The container provided classes are used then.

<dependency>
                <groupId>com.sun.xml.bind</groupId>
                  <artifactId>jaxb-impl</artifactId>
                  <version>2.3.1</version>
                  <scope>provided</scope>               
</dependency>   

com.sun.jersey.spi.service.ServiceConfigurationError: com.sun.jersey.spi.HeaderDelegateProvider

Error on adding Jersey jars for Restful Webservices:

Message icon - Error [HTTP:101216]Servlet: "jersey-serlvet" failed to preload on startup in Web application: "sampleapp". com.sun.jersey.spi.service.ServiceConfigurationError:
com.sun.jersey.spi.HeaderDelegateProvider: The class com.sun.jersey.core.impl.provider.header.LocaleProvider implementing provider interface
com.sun.jersey.spi.HeaderDelegateProvider could not be instantiated: null at com.sun.jersey.spi.service.ServiceFinder.fail(ServiceFinder.java:602) at
com.sun.jersey.spi.service.ServiceFinder.access$800(ServiceFinder.java:159) at com.sun.jersey.spi.service.ServiceFinder$LazyObjectIterator.hasNext(ServiceFinder.java:892) at
com.sun.jersey.core.spi.factory.AbstractRuntimeDelegate.<init>(AbstractRuntimeDelegate.java:76) at com.sun.jersey.server.impl.provider.RuntimeDelegateImpl.<init>
(RuntimeDelegateImpl.java:54) at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method) at
sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:39) at
sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:27) at java.lang.reflect.Constructor.newInstance(Constructor.java:513) at
java.lang.Class.newInstance0(Class.java:355) at java.lang.Class.newInstance(Class.java:308) at javax.ws.rs.ext.FactoryFinder.newInstance(FactoryFinder.java:65) at
javax.ws.rs.ext.FactoryFinder.find(FactoryFinder.java:117) at javax.ws.rs.ext.RuntimeDelegate.findDelegate(RuntimeDelegate.java:105) at
javax.ws.rs.ext.RuntimeDelegate.getInstance(RuntimeDelegate.java:91) at javax.ws.rs.core.EntityTag.<clinit>(EntityTag.java:35) at java.lang.Class.forName0(Native Method) at


Fix:

This exception is thrown when Jersey services can not find out specified package and class to instantiate. I verified the correct package where I had my restful service and corrected this path.

<servlet>
       <servlet-name>jersey-serlvet</servlet-name>
       <servlet-class>com.sun.jersey.spi.container.servlet.ServletContainer</servlet-class>
       <init-param>
            <param-name>com.sun.jersey.config.property.packages</param-name>
         <param-value>com.cccis.sampleapp.restful</param-value>
       </init-param>
       <init-param>
               <param-name>com.sun.jersey.api.json.POJOMappingFeature</param-name>
            <param-value>true</param-value>
          </init-param>
       <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>jersey-serlvet</servlet-name>
        <url-pattern>/
sampleapp/*</url-pattern>
    </servlet-mapping>