eyecon color picker pops behind jqgrid (jqueryui) dialog on edit form

I would like to know if has anyone used eyecon color picker with j开发者_如何学Pythonqueryui dialog? Everything works fine but whenever the user clicks on the textbox to show the color picker, the color picker appears behind the jqueryui dialog. It seems related to z-index property. Any help would be appreciated. Thanks.

edit colorpicker.css and specify a z-index:

.colorpicker {
    width: 356px;
    height: 176px;
    overflow: hidden;
    position: absolute;
    background: url(../images/colorpicker_background.png);
    font-family: Arial, Helvetica, sans-serif;
    display: none;
    z-index:1005;
}