How to Show Checkboxes in a Readonly ListView and Select the row on click of Checkbox

CheckBoxesGIF 

Hello Friends,

It’s been quite a while since I have created a new post as I was not getting time to do so.

Recently one of my friend approached me for a typical requirement in which he need to show a checkbox in a Read-only List view and then user check’s those check boxes to select rows which could be multiple at a time, Generally K2 smartforms doesn’t show checkboxes in read-only mode of  a list view. We know that we can select multiple rows using control + Mouse click on the row, but client was not happy with that approach and he insisted to use checkbox option in the grid.

Let’s see how we can do that.

Step 1: In the list view create a new column and drag a datalabel control into it. Check the Literal property and in Expression click on ellipse button, click add and then give expression a name and paste below script in it and click ok.

<input type="checkbox" />

expressionChkbox.jpg

Step 2: Create a new data label with name dlHighlightRow and drag on the layout and set visible to false. Now in layout click expression Symbol   click add and create new expression with name Highlight and paste below code in it and save.

 $('input[type="checkbox"]').each(function(index, item) {       
 if ($(this)[0].checked) {           
   $(this).closest('tr').addClass('highlighted selected');       
  } else {           
   $(this).closest('tr').removeClass('highlighted selected');       
  }   
 });

Similarly add one more expression with below script and name it as NoScript

script.JPG

** Don’t forget to add script tags in starting and ending of jquery code, Here in post they are getting removed by default.  script

Step 3: Now in list view item click rule add below rules to set the expression value to data label dlHighlightRow first with Highlight Expression and second with NoScript Expression. Also set literal property to . This way we are dynamically injecting the script into the form also for each item click we are making it run.

transferrule.jpg

Now you can use the rule For all Selected rows of the lisView to get the selected rows. That’s it, now save the view and run it see the Jquery Magic 😊 Note: The Highlight Expression that we created above has the main logic of looping through the checkboxes and see if it is selected and make the row selected. This script may not function properly if your view has more checkboxes other than that of in first column. If you have so, then we need to add a class in checkbox expression as below

<input type="checkbox" class="gridCities-CheckBox"/>

And Highlight expression we need to modify the code as

 <script
 $('.gridCities-CheckBox').each(function(index, item) {       
  if ($(this)[0].checked) {           
   $(this).closest('tr').addClass('highlighted selected');  
  } else {           
   $(this).closest('tr').removeClass('highlighted selected'); 
 }   
 });
/script>

Also, there is another approach to achieve this which can be found at below article.

https://dudelisdev.blogspot.com/2017/11/k2-how-to-select-rows-with-checkboxes.html

Note : In the approach explained in above article, list item click event & list item double click events will be disabled.

 

Advertisements

What are K2 Composite Smart Objects and how to create them.

Capture
K2 have provided a great feature to join data from multiple data sources into single dataset. If your application has data coming from multiple lob’s like SQL, Sharepoint, WCF Services, REST Services etc and you need to combine the data and show them as single dataset then composite smart objects are perfect pick for you. They are like Joins in SQL, but the data sources can be different.
Let’s see how we can create with an example.
**Before moving further, I would like to mention you that Composite SmartObjects can be created either in VisualStudio or K2 Studio. (In K2 Designer we can’t, not until K2 Version 4.7 as I know).
Coming to example, I have Departments data (Department ID, DepartmentName) in K2 SmartBox
2.Departments
and Employees data in SQL Server

1.SQLData

Now we shall join the above data by creating a composite smartobject and execute it to see the result.
Step 1: Open Visualstudio, Create New K2 Empty project give it a name and in solution explorer right click add new smartobject and give it a name here it is (Employees) and click ok. Now at the top of window click AdvancedMode, under SmartObjectMethods click remove all and click ok

3.NewSmartObject

Step 2: Under SmartObject Methods, click on Add, Select AdvancedMode Checkbox and click next, provide a name and select list in Type Dropdown and click Next, Now in method parameters window click next as we can add parameters later while configuring,
Step 3: Now in ServiceObjectMethods window click Add and select the dbo.Employees table List method from the context browser under the SQL Server Service Instance

contextbrowser.jpg
Now Map the properties or simply click Create All to auto map the properties. Once done you should see below window

5.SQLServiceMethod
Click Ok and you should see the ServiceObjectMethod Window
Step 4: Again, Click Add and repeat the same steps for Departments.List which will be under K2 Smartbox Service instance once done click Ok

6.SmartBoxMethod
Step 5: Now we are at Service Method Link Window which is the main step of this SmartObject Creation. Here in first Dropdown select the Employees SQL Service Instance Method and in Link Type Dropdown select Matching Values in both objects and in 3rd dropdown select the Departments Smartbox Service method and in properties below, select DepartmentId and click assign and from the dropdown select DepartmentId and click ok.
Now we have joined SQL Server Employees Data with Smartbox Departments data using DepartmentId which is the common column in both data.
Link Type is kind of Join type as in SQL server. Here we have 4 different options of link types

Joins
1. Matching Values in both objects (similar to SQL Inner Join)
2. All Values for first object (Left Join)
3. All Values for Second object (Right Join)
4. All values for both objects (Outer Join)

Step 6: Just click ok and you are good to deploy and run the smartobject to see the results.
Result.jpg

Creating Endpoint REST Service instance for a REST api which needs authorization bearer token

 

This post is in continuation to my previous post K2 Integration with REST Api Services which explains how to integrate K2 with REST Api Services. In my previous post, I have integrated with an Api Service which doesn’t require any Authorization Token that needs to be passed. But there is a chance that you find some REST api Services that needs an authorization bearer token to be passed to execute its methods. Now in this post we will see how to integrate to one of those REST Api services which needs the Authorization Bearer Tokens.

To get the swagger file follow the steps that were mentioned in my previous post which is using RESTUnited.com. There will not be any changes in steps to generate swagger except in authentication tab you will have to mention authentication token details and add it which will be as shown in below screenshots.

1AddAuthentication

 

2AddedAuthRESTUnited.jpg

 

Now once we get the Swagger file generated proceed to create Service Instance using EndPoints REST option in Smart Objects – Services – Tester Utility.

Now in Service Keys Section, Default HTTP Request Headers field you need to add this Authorization Token key in below format without any line breaks

{“$type”:”SourceCode.SmartObjects.Services.Endpoints.Common.HttpHeader[], SourceCode.SmartObjects.Services.Endpoints.Common, Version=4.0.0.0, Culture=neutral, PublicKeyToken=null”,”$values”:[{“$type”:”SourceCode.SmartObjects.Services.Endpoints.Common.HttpHeader, SourceCode.SmartObjects.Services.Endpoints.Common, Version=4.0.0.0, Culture=neutral, PublicKeyToken=null”,”Name”:”Authorization”,”Value”:”Bearer eyJhbGciOiJub25lIn0.eyJVc2V==”}]}

*Replace the Values with the token that needs to be passed. Also we can pass multiple header Tokens here.

Now give the path of the Swagger file in the descriptor location field and leave rest of the options with default values

3.jpg

That’s It, Now just create a SmartObject using this Service instance and execute to see the result.

If you get any error with message like “Unable to Deserialize…” then its issue with the format of token that’s passed in HTTP Request Headers section…Just ensure that it is in above mentioned format without any line breaks . That’s It.

Also please note that this procedure should be used only for development purpose as per K2. Don’t ask me the reason (B’cuz I too don’t know :))

Note: Recently, when one of my friend tried to create a SmartObject over a REST Service instance that he created for a REST service which needs authorization bearer token, he was constantly getting 401, 404, 0 as response code but the same service he was able to run from Postman and fiddler without any issue. He tried all above mentioned things but still we couldn’t figure out what is the issue with REST when we are trying to connect with K2. so we approached K2 Team for help and when they investigated they found that its the issue with REST Service Api URL which has spaces in it and K2RESTBroker is trying to encode the URL which is already encoded…so as a fix we have removed spaces in REST service endpoint URL and the k2 is still investigating the actually issue behind the k2 encoding the already encoded URL. So just ensure that your REST Service URL doesn’t have any spaces in it.

Below are the community posts which will give you related information regarding this.

http://community.k2.com/t5/K2-blackpearl/How-toHandle-Authorization-Token-while-Creating-Endpoints-REST/m-p/101521#M33759

Configuration setting to deal with Optional Parameters while creating SQL Service Instance

Have you ever faced this situation while creating a SmartObject method for a SQL stored procedure, if the SQL stored procedure has some optional parameters like below, but in SmartObject it still shown as a required parameters?

Sample stored procedure with optional parameters (parameters with default values)

CREATE PROCEDURE MyProcName
    @Parameter1 VARCHAR (100) = 'User'
AS
BEGIN
  SELECT 'HELLO ' + @Parameter1 AS [Message]
END

 

Here @parameter1 is an optional parameter which is when passed then Stored Procedure will return ‘Hello Parameter value’ if not passed then ‘Hello User’

2
SQL Execution

Now without changing the configuration setting if we create SmartObject then it will throw error as below  when we are not passing the parameter value.

1

Now when we pass parameter value then it will give the result

3.jpg

Now to make this parameter as optional we need to modify the service instance and set this attribute Use parameters for stored procedures to False (by Default it is True) and save.

ServiceInst2
Service Instance Setting

Now recreate the SmartObject and execute the method without passing the Parameter Value which will give you the result.

5.jpg

A simple yet very useful setting right 🙂 !!!!

 

Handling Complex Objects in K2 SmartObjects

Deserializing Complex Objects in SmartObjects

java-serialization.png

This post is in continuation to my previous post K2 Integration with REST Api Services where I’ve created an SMO for a REST Api. As api’s return you serialized response, we need to further deserialize them using the Deserialize methods of that particular type/object.

Now if you see the result in below screen shot which is the result of WeatherAPI, it is providing a Serialized objects for Clouds, Coord, Main, Sys. Now to get the individual properties of the above mentioned serialized types/objects, we need to further deserialize them. Lets see how we can do.

SMOResults.jpg

Now the SMO which we have created in last post needs to be modified using K2 Designer. Select the method from service instance (Here it is GetWeatherbyCityName) and map the properties as shown in below screen shots.

ServiceInstance.jpg

MainMethodMapping.jpg

Now if you see the mapped properties in above screen shot, Clouds is mapped to a memo property Clouds (Clouds) which is the serialized result from api. Once the method is created click add and select Deserialize method of clouds from service instance as shown below.

CloudsDesrialize.jpg

Now the Deserialize method takes the serialized value as input and returns the individual properties of Clouds type. You need to map the serialized value which we got from above method as input and map the individual return properties to SMO properties (Here the property is ALL).

DeserializeClouds.jpg

Now similar to above add deserialize methods of other class types (Coord, Main..) and map their respective properties.

AllMethods

Now once you finish,  it should like below.

Method.jpg

That’s it. Click Finish and execute the SMO to see the individual properties as below

 

Results

CloudsALL is the deserialized value from Clouds Object, Similarly CoordinatesLatitude, CoordinatesLongitude are the desreialized values from Coord object, similarly Main Object Values you can see there.

That’s it. This is how we can Deserialize complex objects.

Here we have seen only single level of complexity which means for every weather result object, we get only one cloud object, one Coord object and so on. But there could be cases of result with multi-level complexity which means for every single weather result object there could be multiple cloud objects or multiple Coord objects and so on. In that case we may not be able to deserialize as we did above. We need to create separate methods for each object like GetCloudsbyCityName, GetCoordbyCityName, GetMainValuesbyCityName and handle the methods in same way as we did above.

Also in some cases, Api methods takes serialized objects as an input values, in that case we need to use the serialize method of that objects first which returns us the serialized value and then we need to pass this serialized value to the main method (just opposite to the way we did above).

This is how we can handle complex objects in K2 Smartobjects.

 

Smartform List View With Fixed Header

While using the tables in web pages, if it contains many rows, that does not fit in the page height, a vertical scroll bar is generated on the right side of the page, allowing users to display the lower rows of the table. In scrolling down, however, the table headers are no longer visible, so users may need to scroll back up the page to check column headings.

In this case users would by far prefer to have the column headers kept steady at the top of the screen, while the scroll bar scrolls just the table rows.

Same issue arises in smart form while List view having lot of data and we are not using pagination ans when Smart form  having lot of views and list view  is some where between them.

Smartform doesn’t provide this feature but it doesn’t mean that we can’t be achieved this feature in…

View original post 752 more words

Creating SQL Server Service Instance

In K2 black pearl service instance is nothing but a service broker used to connect to multiple LOB’s (Line of Business) systems or data bases to get or post the data.  Using these Service Instances we will be creating smart objects which will be used in development of workflows and smart forms.

By default, K2 have provided the Service Brokers to connect below LOB’s which we use mostly

SQL Server

To connect to SQL Server Tables & Stored Procedures

Oracle

Web Services

WCF Services

Endpoint Assembly

To connect to .Net Assemblies/ DLL’s

AD Service

To connect to Active Directory

SharePoint Service

To connect to share point lists and libraries.

For the list of all available Service brokers open the SmartObjects – Services – Tester utility which comes by default with K2 installation at path C:\Program Files\K2 Blackpearl\bin

List of service brokers

soservicetester

Now let’s create a SQL Server Instance and go through options available

Step 1: Right Click on SQL Server Service and Select Register ServiceInstance

serviceinst1

Step 2: Enter the details as shown in below screen shot

Authentication mode need to be selected as service account to run this instance under K2 service account credentials.

serviceinst2

There is an attribute Use parameters for stored procedures for which by default value is true but I have set it as false for knowing the reason please read this Post.

Once provided all Database details and Database Server Details click Next

Step 3:  Now provide the service Instance name, display name & description and click Add

serviceinst4

That’s it we have completed creating a Service instance for a data base in SQL Server. Now you can expand and see the service instance that we have created under SQL Server Service, you can see all the tables and stored procedure available in the data base.

Now we can use this service instance for creating smart objects.