יום ראשון, 19 בפברואר 2012

Disabling button in SI Mode


Working with SI applications can be as good as playing with fire. Recently we faced an issue when some naughty users clicked button multiple times resulting in underline action getting executed multiple times. As in case of SI applications, if the method is taking time to execute then button is not disabled it remains active giving end user an impression of nothing-is-happening. So user may end up clicking the button multiple times.

The only way to prevent multiple clicks is to disable button as soon as it is clicked. Fortunately there is an article on support which provides solution to achieve the desired but a scripted one. Following piece of code can be used to disable button after click.

function WebApplet_ShowControl (ControlName, Property, Mode, &HTML)
{
    if(ControlName == "SubmitButton")
    {
      if(Property == "FormattedHtml")
      {
          var index = HTML.indexOf("onclick=");
          var start = HTML.substring(0,index+9);
          var end = HTML.substring(index+9);
          var func = 'setTimeout("a()",10);; ';
          var funcA = "<script>function a(){";
          funcA += "var c = document.getElementById('SUBMIT');";
          funcA += "c.outerHTML='';";
          funcA += "} <script>";
          HTML=start + func + end + funcA;
      }
    }
}
However, we wanted to implement the solution by configuration and yes, we were able to achieve by using following piece of code in "HTML Attributes" property of button.

onclick="function fn(){disabled=true;}setTimeout(fn, 100);"

The idea is to diable button once it is clicked and making a recursive call after 100 milliseconds by using setTimeout function so that it gives user an impression that button is disabled. There could be alternates to achieve this. Again piece of advice/comment is always welcome. 

Happy Crunching!!

אין תגובות:

הוסף רשומת תגובה