Configuring Data Types With Ninja Table
There are several data types you can have while creating a table column in a specific table using Ninja Tables. It’s pretty cool and very exciting as it makes the table more interactive and user-friendly. In Ninja Tables, you will get six different data types along with custom formatting which make the user interaction more compulsive.
In this tutorial, I will cover how to use different data types for creating different user interactivity. At first, you have to create a table by giving a table name using Ninja Tables plugin. Then you will be taken to the Add Table Column page. Next, you have to create a table column for the respective table. While creating the table column you have to fill up an input field named data types.
Ninja Tables plugin has six data types by default. They are as follows:
Now, I will show independently how to use each of the data types within a particular table.
1. Single Line Text Field
First of all, you can start with the Single Line Text Field data type. While creating the table column. In the HTML field, you can write names, any attribute or general statement and so on. To create the field, you have to fill up the Data Type input field from the drop-down list. If you choose Single Line Text Field as data type
A table has been created with a column named Name.
Now, add some data to the column by going to the Table Rows part. Next, you will find a dialogue box where one single line text input field exists as an input field.
Then fill up the fill by clicking the Add button.
2. Text Area
If you want to add multiple lines in a field, choose Text Area as the data type. You can add as much line as you want.
Now, add some data to the column by going to the Table Rows part. Next, you will find a dialogue box where you will find the text input field exists as an input field.
Now, you can add multiple lines to address the field.
3. HTML Field
If you want to have multiple rich options while filling the input field then you should choose the HTML Field as the data type. By choosing HTML Field, you can bold text, make the text italic, can change text color and so on.
You can add a photo, can have a list, you can post any video and create any link to the text here. The output of the field is like the following screenshot.
These are some functionalities of the HTML Field data type.
4. Numeric Value
If you want the input field would only contain the number only, then you can choose Numeric Value as the data type. It can limit your input in the number field only. You can sort your data in ascending and descending order using the numeric value.
You can put numbers only in input field and output would be like the following screenshot.
This is what Numeric Value data type is.
5. Date Field
Date Field is used to have a date input field in your form. By default, this data type contains 8 formats in general.
If these options do not make you happy, you can add mone format as your own by clicking Custom option. By default, it stays in Standard with its 8 inbuilt formats.
While adding data, you will have the following output.
Now, you can customize the data format if the default items don’t satisfy you. To do so, just click on the Custom and put your desired format in the input field.
In this case, you will have the following output.
This is how you can manage Date Field while adding data to a specific field.
6. Select Field
Last but not the least, you will get another exceptional data type in Ninja Table, that is Select Field. This data type allows you to give some option in a drop-down fashion while adding data to any column field. If you need to add the same field again and again, then you can add this field. This might lessen your task in some cases and enhance the productivity. Now, let’s have a look at this unique data type.
It’s really pretty cool, just choose the Select Field from the drop-down list of the data type while creating a column. Immediately another input field will be open with a text area input field below the Data Type field named Select Items. Type your expected items one after another according to your given column name.
Now, if you want to input data to this column field, just click on the blank space of that field. Then, you will discover a drop-down list as you have given earlier in the Select Items.
Select one of the items from them to fill up the field.
Then, the field will be filled according to your selected item. Then click on the Add button to complete the input procedure in the column field.
This is how you can use the Select Field.
Now, let’s have a look at the total view of the input fields.
The output of this input fields as follows. For your better understanding, it’s given below.