i have problem clicking button display popup.
in layout.jspx, have following:
<div class="menubtn"> <div class="search"> <span></span> </div> </div> </header> <tiles:insertattribute name="body" /> </div> <!-- userinfo popup --> <div class="popup accdetail user" id="userpopup" style="display: none;"> <div class="userinfo"> <img src="${img_user}" width="60" height="60"></img> <div> <p class="department"><security:authentication property="securityuser.department"/></p> <p class="name"><security:authentication property="securityuser.username"/></p> <p class="email"><security:authentication property="securityuser.email"/></p> </div> <div class="btn clear cen floatnone"> <a class='blank' href="${url_logout}">log out</a> </div> </div> </div> when user clicks icon, display userpopup.
it works in other page. (on top-right side of page)
then in 1 of jsp, have following:
html
<div class="mainarea"> <div class="datatitle"> <h2 class='h2title'>annual leave</h2> </div> <div class="searchparentone"> <div> <input type="image" class="addnewletter" src="/ias/resources/images/leave.png" style="height:128px;width:256px;"> <p class="temp-test" style="display:none;"><security:authentication property='securityuser.fullname'/></p> </div> </div> </div> <div class="popup accdetail" id="letterdialog" title="leave application" style="display: none;"> <div class="popupmainarea"> <div class="clear bttn" id="divsmalldate"> <div class="bttn rig floatnone"> <button type="button" class="ui-lngbutton edit_ui selectline">line</button> <button type="button" class="ui-button up_ui btnsenddoc" style="display:none;">submit</button> <button type="button" class="ui-button cancel_ui btncancelcon">close</button> </div> </div> <form id="formaddnewdoc" enctype="multipart/form-data"> <div class="data"> <div> <p align="center"><font size="6">annual leave</font></p> </div> <table class="custbltwo"> <colgroup> <col style="width: 40%;"> <col style="width: 60%;"> </colgroup> <tbody> <tr> <td class="tbhead">document no.</td> <td class="tbcontent" style="border-style: solid hidden solid solid;"><p id="documentid">mobile c&c cambodia-xx-xxxx</p></td> </tr> <tr> <td class="tbhead">department</td> <td class="tbcontent" style="border-style: solid hidden solid solid;"><p></p> <input type="hidden" name="docdepartment" id="docdepartment"/> </td> </tr> <tr> <td class="tbhead">approval date</td> <td class="tbcontent" style="border-style: solid hidden solid solid;"><p id="docdisplaydate" class="today"></p> <input type="hidden" name="dochidecdate" id="dochidecdate"/> </td> </tr> <tr> <td class="tbhead">writer</td> <td class="tbcontent" style="border-style: solid hidden solid solid;"> <p class="temp-test"> <security:authentication property='securityuser.fullname'/> </p> <input type="hidden" name="docemployee" id="docemployee" value="<security:authentication property="securityuser.fullname"/>"/> </td> </tr> </tbody> </table> <table class="custblthree"> <colgroup> <col style="width: 12%;"> <col style="width: 17.6%;"> <col style="width: 17.6%;"> <col style="width: 17.6%;"> <col style="width: 17.6%;"> <col style="width: 17.6%;"> </colgroup> <tbody> <tr> <td class="tbhead" rowspan="2">approval<strong class="required">*</strong> <input type="hidden" name="docapproval" id="docapproval"> </td> <td class="tbcontent" align="center" id="clickclick1"><input type="text" readonly="readonly" name="docapp0" id="docapp0" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick2"><input type="text" readonly="readonly" name="docapp1" id="docapp1" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick3"><input type="text" readonly="readonly" name="docapp2" id="docapp2" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick4"><input type="text" readonly="readonly" name="docapp3" id="docapp3" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick5"><input type="text" readonly="readonly" name="docapp4" id="docapp4" style="border:0; text-align:center;"></td> </tr> <tr> <td class="tbcontenttwo" align="center" id="clickclick6"><img id="docappnumimg0"></img></td> <td class="tbcontenttwo" align="center" id="clickclick7"><img id="docappnumimg1"></img></td> <td class="tbcontenttwo" align="center" id="clickclick8"><img id="docappnumimg2"></img></td> <td class="tbcontenttwo" align="center" id="clickclick9"><img id="docappnumimg3"></img></td> <td class="tbcontenttwo" align="center" id="clickclick10"><img id="docappnumimg4"></img> <input type="hidden" readonly="readonly" name="docappnum0" id="docappnum0" value="0"> <input type="hidden" readonly="readonly" name="docappnum1" id="docappnum1" value="0"> <input type="hidden" readonly="readonly" name="docappnum2" id="docappnum2" value="0"> <input type="hidden" readonly="readonly" name="docappnum3" id="docappnum3" value="0"> <input type="hidden" readonly="readonly" name="docappnum4" id="docappnum4" value="0"> </td> </tr> <tr> <td class="tbhead" rowspan="2">agreement <input type="hidden" name="docsettlement[]" id="docsettlement"> </td> <td class="tbcontent" align="center" id="clickclick11"><input type="text" readonly="readonly" name="docagg0" id="docagg0" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick12"><input type="text" readonly="readonly" name="docagg1" id="docagg1" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick13"><input type="text" readonly="readonly" name="docagg2" id="docagg2" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick14"><input type="text" readonly="readonly" name="docagg3" id="docagg3" style="border:0; text-align:center;"></td> <td class="tbcontent" align="center" id="clickclick15"><input type="text" readonly="readonly" name="docagg4" id="docagg4" style="border:0; text-align:center;"></td> </tr> <tr> <td class="tbcontenttwo" align="center" id="clickclick16"><img id="docaggnumimg0"></img></td> <td class="tbcontenttwo" align="center" id="clickclick17"><img id="docaggnumimg1"></img></td> <td class="tbcontenttwo" align="center" id="clickclick18"><img id="docaggnumimg2"></img></td> <td class="tbcontenttwo" align="center" id="clickclick19"><img id="docaggnumimg3"></img></td> <td class="tbcontenttwo" align="center" id="clickclick20"><img id="docaggnumimg4"></img> <input type="hidden" readonly="readonly" name="docaggnum0" id="docaggnum0" value="0"> <input type="hidden" readonly="readonly" name="docaggnum1" id="docaggnum1" value="0"> <input type="hidden" readonly="readonly" name="docaggnum2" id="docaggnum2" value="0"> <input type="hidden" readonly="readonly" name="docaggnum3" id="docaggnum3" value="0"> <input type="hidden" readonly="readonly" name="docaggnum4" id="docaggnum4" value="0"> </td> </tr> </tbody> </table> <table class="custbleone"> <colgroup> <col style="width: 10.8%;"> <col style="width: 14.5%;"> <col style="width: 4%;"> <col style="width: 14.5%;"> <col style="width: 56.2%;"> </colgroup> <tbody> <tr> <td class="tbhead" style="border-style: hidden solid solid solid;">reference</td> <td class="tbcontent" id="clickclick21" colspan="4" valign="middle" style="border-style: hidden solid solid solid;"> <input type="text" readonly="readonly" name="docreference[]" id="docreference" placeholder="reference"></td> </tr> <tr> <td class="tbhead">implement<strong class="required">*</strong></td> <td class="tbcontent" colspan="4" valign="middle"> <input type="text" readonly="readonly" name="docenforcement" id="docenforcement" style="border:0;"value="<security:authentication property="securityuser.fullname"/>"/></td> </tr> <tr> <td class="tbhead">period<strong class="required">*</strong></td> <td class="tbcontent" valign="middle" style="border-style: solid hidden solid solid;"><input type="text" readonly="readonly" class='ihalf dateone' id="sdate" name="sdate" placeholder="2016-01-01" style="display:inline;"><input type="hidden" name="docstartdate" id="docstartdate"></td> <td class="tbcontent" style="border-style: solid hidden solid hidden;"><p class="ptilde" style="display:inline;">  ~</p></td> <td class="tbcontent" valign="middle" style="border-style: solid hidden solid hidden;"><input type="text" readonly="readonly" class='ihalf datetwo' id="edate" name="edate" placeholder="2016-01-01" style="display:inline;"> <input type="hidden" name="docenddate" id="docenddate"></td> <td class="tbcontent" style="border-style: solid solid solid hidden;"></td> </tr> <tr> <td class="tbhead" style="border-style: solid solid hidden solid;">title<strong class="required">*</strong></td> <td class="tbcontent" valign="middle" colspan="4" style="border-style: solid solid hidden solid;"><input type="text" id="doctitle" name="doctitle" placeholder="title" maxlength="80"/></td> </tr> </tbody> </table> <table class="custbleone"> <colgroup> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> </colgroup> <tbody> <tr> <td class="tbcontent" style="text-align:center;">annual info year</td> <td class="tbcontent" style="text-align:center;">total annual leave</td> <td class="tbcontent" style="text-align:center;">used annual leave</td> <td class="tbcontent" style="text-align:center;">remain annual leave</td> <td class="tbcontent" style="text-align:center;">request annual leave<strong class="required">*</strong></td> </tr> <tr> <td class="tbcontent"><input type="number" readonly="readonly" name="docannualyear" id="docannualyear" style="border:0; text-align:center;"></td> <td class="tbcontent"><input type="number" readonly="readonly" id="doctotalleave" style="border:0; text-align:center;"></td> <td class="tbcontent"><input type="number" readonly="readonly" id="docusedleave" style="border:0; text-align:center;"></td> <td class="tbcontent"><input type="number" readonly="readonly" name="docremainleave" id="docremainleave" style="border:0; text-align:center;"></td> <td class="tbcontent"><input type="number" name="docrequestleave" id="docrequestleave" step="0.5" style="text-align:center;"></td> <!-- step attribute not work --> </tr> </tbody> </table> <table class="custbleone"> <tbody> <tr> <td class="tbcontenttwo" valign="top" style="border-style: hidden solid solid solid;"> <textarea class="ckeditor" id="doctext" name="doctext"></textarea></td> </tr> </tbody> </table> <table class="custbleone"> <colgroup> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 70%;"> <col style="width: 10%;"> </colgroup> <tbody> <tr> <td class="tbcontent" rowspan="3" valign="middle" style="border-style: hidden solid solid solid;"> attachment</td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid solid;"> <input type="file" id="docfile1" name="docfile1" size="50" style="width:85px;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <input type="text" readonly="readonly" id="test1" class="test1" style="border:0;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <button type="button" id="cleardocfile1" style="display:none;">delete</button></td> </tr> <tr> <td class="tbcontent" valign="middle" style="border-style: hidden solid hidden solid;"> <input type="file" id="docfile2" name="docfile2" size="50" style="display:none; width:85px;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <input type="text" readonly="readonly" id="test2" class="test2" style="border:0;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <button type="button" id="cleardocfile2" style="display:none;">delete</button></td> </tr> <tr> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid solid;"> <input type="file" id="docfile3" name="docfile3" size="50" style="display:none; width:85px;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <input type="text" readonly="readonly" id="test3" class="test3" style="border:0;"/></td> <td class="tbcontent" valign="middle" style="border-style: hidden solid solid hidden;"> <button type="button" id="cleardocfile3" style="display:none;">delete</button></td> </tr> </tbody> </table> <input type="hidden" name="currentuser" id="currentuser" value="<security:authentication property="securityuser.fullname"/>"/> <input type="hidden" name="docdisplayallsum[]" id="docdisplayallset"> <input type="hidden" name="docdisplayapp[]" id="docdisplayapp"> <input type="hidden" name="docdisplayset[]" id="docdisplayset"> <input type="hidden" name="docdisplayallapp[]" id="docdisplayallapp"> <input type="hidden" name="docsum[]" id="docsum"> <input type="hidden" name="docdisplayallsum[]" id="docdisplayallsum"> <input type="hidden" name="docdisplaysum[]" id="docdisplaysum"> <input type="hidden" name="docagreetype[]" id="docagreetype"> <input type="hidden" value="annual leave" id="doctype" name="doctype"/> <input type="hidden" value="" id="docattachment" name="docattachment"/> <input type="hidden" value="" id="docdone" name="docdone"/> <input type="hidden" value="report" id="docstatus" name="docstatus"/> <input type="hidden" value="false" id="docrejected" name="docrejected"/> <input type="hidden" name="filename1" id="filename1"/> <input type="hidden" name="filename2" id="filename2"/> <input type="hidden" name="filename3" id="filename3"/> </div> </form> </div> javascript
$(".addnewletter").on("click",function(e){ $("#letterdialog").dialog("open"); $(".floatnone :button").blur(); $('.today').text(parsedatetostring(new date(),constant.yyyymmddhhmmssformat)); var currrentremain = parsefloat($("#docremainleave").val()); if (currrentremain <= 0) { $(".btnsenddoc").hide(); } else { $(".btnsenddoc").show(); } $("#formaddnewdoc").validate({ onclick : false, ignore : [], onkeyup : function(element) { return true; }, onfocus : true, rules : { doctitle : {required : true, maxlength : 80}, docstartdate : {required : true}, docenddate : {required : true}, docapproval : {required : true}, docenforcement : {required : true}, docrequestleave : {required : true, min: 0.5, max: currrentremain} }, invalidhandler : function(e, validator) { if (!validator.numberofinvalids()) { return; } $('html, body').animate({ scrolltop: $(validator.errorlist[0].element).offset().top -30 }, 1000, function(){ $(validator.errorlist[0].element).focus(); }); } }); }); initdialog : function(){ $( "#letterdialog" ).dialog({ autoopen: false, modal: true, width : 1000, resizable: false, close: function( event, ui ) { $(this).dialog("close"); } }); } in following page, if click leave application icon, annual leave popup shows up. 
however, when click profile icon on top-right side, userpopup not show up.
it looks clicking event not fire because of jquery ui modal dialog.
how should fix this?
i checked this post, not sure if settimeout right, proper method use.
please give me advice.
edit:
forgot show initdialog add under javascript part.
i made modal option false, removes modal, icon still not fire when click it.
not sure understnad enouth. seems popup shows code $("#letterdialog").dialog("open"); modal dialog.
have try set modal option false re-try?
like below code: $("#letterdialog").dialog('option', 'modal', false).dialog("open")
Comments
Post a Comment