Showing posts with label JavaScript. Show all posts
Showing posts with label JavaScript. Show all posts

Tuesday, February 25, 2014

Customizing Pop Up menu in K2 Workspace

In an implementation of K2 solution, I used K2 Workspace to see user’s worklist. I cannot use Sharepoint worklist webpart since the client didn’t enable me to use Sharepoint, and we just implemented simple K2 SmartForms application.

The challenge was in pop up menu of K2 Workspace, I had to hide several options.

image

As you see above, I have to hide Data Fields option since we doesn’t want user to see Process Data Fields and they will not understand what it is.

The second problem is, I have to hide Actions option since we doesn’t want enable user to make action using the pop up menu. User must open the worklist item in the approval form, not from this pop up menu.

I had searched in K2 Underground and in K2 Help portal about how to customize pop up menu, but I didn’t find any answer. So, we have to use “hacking” way, here is how:

While opening K2 Workspace, if we open IE Developer tool, we would see that K2 Workspace referenced core.js javascript file:

image

The core.js is located at c:\Program Files(x86)\K2 Blackpearl\WorkSpace\Site\TaskListControl\Script

First thing first, make sure you have copied the original file to somewhere as a backup before making modification.

Here is what we have to modify:

At line 8870, in function CreateMenuOption, after open bracket of function, add this line:

 
if (oNode.innerHTML == "Data Fields") return; 

Then, at line 9085, change this line:



if (FIsIType(oNode, "submenu"))

to this line:



if (FIsIType(oNode, "submenu") && oNode.innerHTML.indexOf("Action(s)") 
== 0 )

Then, on K2 Workspace press F5 several times to ensure the new edited javascript file is loaded, and you will see the “Data Fields” and “Actions” option is gone:


image

Sunday, September 1, 2013

Delete all rows in HTML table

I have a HTML table which needs to be refreshed each time an Ajax post occurs, the table has ID: history.

$get("history").innerHTML = ""

If you don’t understand what is $get above, it is a shorthand for document.getElementById. Function $get is defined in Microsoft AJAX Library, see this for more info.


Code above works well in Firefox and Chrome, both of them accept that code happily to delete all rows in table, but if I run that code in Internet Explorer 8, a javascript exception will occur : “Unknown runtime error”.


IE8 cannot delete rows in HTML table by using innerHTML property, read this for detail info.


 


The solution for this issue is to delete manually all rows in a table using javascript loop, or if you use JQuery, you can make it simpler, you can call empty() method:

$("#history").empty()