Monday, July 18, 2016

Conditional Alert / Comments on Hover

Conditional Alert / Comments on Hover is common requirement, In Old days, it is common to use drill-down pop-up user has to click and view comments and after that he has to close it. If he had 100 records it takes time to click and check on it. Instead of Click, It is better to visualize comments / alert on hover.

Step:1: In Link / Element Attributes, we can call function on mouse hover using javascript as follows:
onmouseover="fun_status(#DELIVERY_ITEM_ID#,#DELIVERY_PDVD_ID#);"

Step:2: In function we will check our condition and display it conditionally. It is simple, But we used it for field locks as user can be restricted to click on link when other user is using it , during hover itself we will alert him and restrict.
Following javascript is used to check whether particular field is locked or not and we will conditionally alert them or allow in accordance to condtion

function fun_status(a,b)
{
   var get = new htmldb_Get(null,$x('pFlowId').value,
              'APPLICATION_PROCESS=AP_DEL_OUTPUT_CHECK',0);
get.add('AI_PDVD_ID',a);
get.add('AI_DELIVERY_PDVD_ID',b);
gReturn = get.get(); 
var x=gReturn;
x = x.trim();
    //alert(x);
if (x != "Not Exists")
    {
       $("#alert").html("Field has been locked by <b>"+x+"</b>");
       $("#alert").dialog({modal:true,resizable: false,minHeight: 105,width:380,dialogClass: 'testclass'}); 
    }
}

 $('#alert').on('dialogclose', function(event) {
        $("#alert").dialog("destroy");
          
 });

Output:




1 comment:

  1. "Conditional Alert Comments on Hover" is telling about setting, which can help you to use system perfectly. The implementation of hover-based comments adds an extra layer of guidance, making complex interfaces more user-friendly. Security Tips Cybersecurity An ingenious technique that bridges communication gaps in design seamlessly.

    ReplyDelete