Column Properties

Columns are initially defined using the setColumnExpressions method. To assign a column property to a column use the setColumnProperty method referencing the column name specified in setColumnExpressions

Basic Properties

columnExpression (string)

This property defines the expression that represents the column in the grid. In most cases this is simply the column name but can also be a more complex SQL expression that is supported by the database. columnExpression is the only required column property and is assigned using the setColumnExpressions method that allows all the columns to be defined in a single method call

label (string)

Defines the text label displayed against the column. Defaults to the database column name if not specified. Column labels can be assigned with the setColumnLabels method or the setColumnProperty method

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"

			setColumnExpressions("CustomerID","EmployeeID","OrderDate","ShipVia");
			setColumnLabels("Customer","Employee","Order Date","Shipped Via");

			setColumnProperty("CustomerID","lookup","select CustomerID, CompanyName from Customers");
			setColumnProperty("EmployeeID","lookup","select EmployeeID, LastName & ', ' & FirstName from Employees");
			setColumnProperty("ShipVia","lookup","select ShipperID, CompanyName from Shippers");
			
			initialize()
		}
	}
	</script>

Run Sample

primaryKey (boolean)

For a grid to be editable or to act as a parent to a child control it is necessary for at least one column to be designated as a PrimaryKey. For multi-part primary keys every column that constitutes the key must have the PrimaryKey property set. In many cases DbNetGrid is able to automatically detect that a column is a PrimaryKey and will set this property automatically.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Customers"

			setColumnExpressions("CustomerID","CompanyName");

			setColumnProperty("CompanyName","label","Company Name");
			setColumnProperty("CustomerID","primaryKey", true;
			
			initialize()
		}
	}
	</script>

Run Sample

Additional Properties

aggregate (string)

The aggregate property specifies that an aggregate value for the column should be displayed in an aggregate row at the foot of the grid. Possible values are Sum, Avg, Min, Max and Count.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Orders join [Order Details] on Orders.OrderID = [Order Details].OrderID"

			setColumnExpressions(
				"[Order Details].ProductID",
				"Orders.OrderDate as FirstOrder",
				"Orders.OrderDate as LastOrder",
				"([Order Details].UnitPrice * [Order Details].Quantity) as TotalValue",
				"([Order Details].UnitPrice * [Order Details].Quantity) as AvgValue"
				)

			groupBy = true

			setColumnProperty("ProductID","lookup","select productid, productname from products")

			setColumnProperty("FirstOrder","aggregate","min")
			setColumnProperty("LastOrder","aggregate","max")
			setColumnProperty("TotalValue","aggregate","Sum")
			setColumnProperty("AvgValue","aggregate","Avg")
			
			initialize()
		}
	}
	</script>

Run Sample

audit (string)

Enables tracking of the date and the user that  changes made to the column in the edit dialog. Possible values are none, summary and detail. In summary mode only the date/user of the last change to the column is recorded, in detail mode all changes to the record are recorded including the previous value of the column and can be viewed in the Audit History dialog.

autoIncrement (boolean)

Indicates that the column value is auto-incrementing and therefore read-only. In the case of some columns such as SQL Server Identity columns this property is set automatically.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"

			setColumnExpressions(
				"EmployeeID",
				"LastName",
				"FirstName"
				)

			setColumnProperty("EmployeeID","autoincrement", true)
			
			initialize()
		}
	}
	</script>

baseTableName (string)

When using a view as a data source the baseTableName property can be used to indicate the name of the underlying table associated with the column

booleanDisplayMode (string)

This property determines how a boolean database value is displayed in the grid. Possible values are Checkbox, TrueFalse and YesNo. If not specified boolean values are displayed as a Checkbox

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Products"
	
				setColumnExpressions("ProductName","UnitPrice","UnitsInStock", "Discontinued");
	      setColumnProperty("Discontinued","booleanDisplayMode", "YesNo");
	
				initialize()
			}
	}
	</script>

Run Sample

bulkInsert (boolean)

Setting the bulkInsert column property will change the function of the Insert button to allow multiple records to inserted in a single action based on a selection from a list of values defined by the Lookup property (which must be assigned).

Run Sample

culture (string)

The culture property allows the default culture derived from the browser language to be overridden for a particular column. For example if a column represents a dollar amount you can force the value to be formatted as a dollar amount irrespective of the default culture.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var ordersGrid = new DbNetGrid("orders");

		with (ordersGrid)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"

                         setColumnProperties("Freight", {format:"c", culture:"en-US", toolTip:"Freight charge"});

			initialize()
		}
	}
	</script>

display (boolean)

Indicates that a column is not displayed in the grid. Used for columns that are editable or searchable but not to be displayed. Columns that are not displayed have their values returned as properties of the grid row which can be accessed using the columnValue method

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Suppliers"
				setColumnExpressions("CompanyName","Address & ', ' & City as addr","Address","City","Phone & '/' & Fax as phone_fax","Phone","Fax");
				setColumnLabels("CompanyName","Address","Address","City","Phone/Fax","Phone","Fax");
	
				setColumnProperty("addr","edit",false);
				setColumnProperty("address","display",false);
				setColumnProperty("city","display",false);
				setColumnProperty("phone_fax","edit",false);
				setColumnProperty("phone","display",false);
				setColumnProperty("fax","display",false);
	
				initialize()
		}
	}
	</script>

Run Sample

edit (boolean)

Indicates that a column is or is not editable. The default is true.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Suppliers"
				setColumnExpressions("CompanyName","Address & ', ' & City as addr","Address","City","Phone & '/' & Fax as phone_fax","Phone","Fax");
				setColumnLabels("CompanyName","Address","Address","City","Phone/Fax","Phone","Fax");
	
				setColumnProperty("addr","edit",false);
				setColumnProperty("address","display",false);
				setColumnProperty("city","display",false);
				setColumnProperty("phone_fax","edit",false);
				setColumnProperty("phone","display",false);
				setColumnProperty("fax","display",false);
	
				initialize()
			}
	}
	</script>

Run Sample

editControlType (string)

The editControlType property allows you to manually specify the type of control used to edit the database value. A default value is assigned based on the type and size of the database column. For example, an editControlType of Html will make the editor an HTML Editor rather than the default Text editor for a text column.

Edit Control Types

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Products"
				setColumnExpressions("ProductID","ProductName","CategoryID");
	
				setColumnProperty("CategoryID","editControlType","RadioButtonList");
				setColumnProperty("CategoryID","lookup","select categoryid, categoryname from categories");
				setColumnProperty("CategoryID","required",true);
				setColumnProperty("CategoryID","editControlProperties",{RepeatDirection : "Horizontal", RepeatColumns:2});
	
				initialize()
			}
	}
	</script>

Run Sample

editControlProperties (object)

The editControlProperties property can be used to assign values to the .Net controls used to create the editable controls. For example the following example sets the RadioButtonList server-control RepeatDirection and RepeatColumns properties

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Products"
				setColumnExpressions("ProductID","ProductName","CategoryID");
	
				setColumnProperty("CategoryID","editControlType","RadioButtonList");
				setColumnProperty("CategoryID","editControlProperties",{RepeatDirection : "Horizontal", RepeatColumns:2});
				initialize()
			}
	}
	</script>

Run Sample

editDisplay (boolean)

When set to false hides the edit field in the edit input form. The field is created but is hidden and can therefore be

editFormat (string)

Specifies an edit format mask if different from the display Format property. Values are the standard .NET date-time and numeric formatting strings.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{
				connectionString = "SamplesDatabase"
				fromPart = "Orders"
	
				setColumnExpressions("OrderID","OrderDate","RequiredDate","ShippedDate","Freight");
	      setColumnProperties("ShippedDate", {format:"MMM yyyy", editFormat : "d", toolTip:"Date shipped"});
	
				initialize()
			}
	}
	</script>

Run Sample

editLookup (string)

Specifies a lookup for an edit column when different from the Lookup property.

editMaxThumbnailHeight (number)

Specifies the maximum height of an image associated with a column when displayed as a thumbnail in the edit dialog. The width of the image is scaled in proportion to the height.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				fromPart = "Employees"
	
	      setColumnProperties("Photo", "editMaxThumbnailHeight", 60);
	
				initialize()
			}
	}
	</script>

editStyle (string)

Allows CSS style attributes to be assigned to an edit field.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				fromPart = "Products"
	
				setColumnExpressions("ProductName","UnitPrice","UnitsInStock");
	
				setColumnProperty("UnitPrice","style","background-color:gold");
				setColumnProperty("UnitsInStock","editStyle","background-color:gold;font-weight:bold");
				initialize()
		  }
	}
	</script>

Run Sample

filter (boolean)

Indicates that the column has a filter in the grid header.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				fromPart = "Orders"
	
				setColumnExpressions("CustomerID","EmployeeID","OrderDate","ShipVia","ShipCountry");
	      setColumnProperty("CustomerID","label", "Customer");
	      setColumnProperty("CustomerID","lookup", "select customerid, companyname from customers");
	      setColumnProperty("CustomerID","filter", true);
				setColumnProperty("EmployeeID","label", "Employee");
				setColumnProperty("EmployeeID","lookup", "select employeeid, lastname from employees");
				setColumnProperty("EmployeeID","filter", true);
				setColumnProperty("OrderDate","filter", true);
				setColumnProperty("ShipCountry","filter", true);
				setColumnProperty("ShipVia","lookup", "select shipperid, companyname from shippers");
				setColumnProperty("ShipVia","filter", true);
				initialize()
		 }
	}
	</script>

Run Sample

filterMode (string)

Sets the style of the column Filter in the grid header. Can be set to List for a drop-down list of possible values or Input where a free-text column filter is entered.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				setColumnExpressions("CustomerID","EmployeeID","OrderDate","ShipVia","ShipCountry");
				setColumnProperty("OrderDate","filter", true);
				setColumnProperty("OrderDate","filterMode", "Input");
				initialize()
		  }
	}
	</script>

Run Sample

foreignKey (boolean)

Indicates that the column is acting as a foreign key in a child grid (either linked or nested). A ForeignKey column is paired with a PrimaryKey column in the parent control in order to establish the relationship between the 2 controls.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var ordersGrid = new DbNetGrid("orders");
		var orderLinesGrid = new DbNetGrid("orderLines");

		with (orderLinesGrid)
		{
			connectionString = "SamplesDatabase"
			fromPart = "[Order Details]"

			setColumnExpressions("OrderID","ProductID","UnitPrice","Quantity","Discount");
      setColumnProperty("OrderID", "foreignKey", true);
		}

		with (ordersGrid)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"

			setColumnExpressions("OrderID","OrderDate","RequiredDate","ShippedDate","Freight");

			addLinkedControl(orderLinesGrid);
			initialize()
		}
	}

	</script>

Run Sample

format (string)

Specifies a format mask for a date-time or numeric value.  Values are the standard .NET date-time and numeric formatting strings. Use the EditFormat property to specify a distinct format string for the editable value. By default, formatting uses the culture indicated by the browser language (or server culture). You can specify the culture for formatting a particular column using the culture property.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var ordersGrid = new DbNetGrid("orders");

		with (ordersGrid)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"

			setColumnExpressions("OrderID","OrderDate","RequiredDate","ShippedDate","Freight");

     	setColumnProperties("OrderDate", {format:"D",  toolTip:"Date ordered"});
      setColumnProperties("RequiredDate", {format:"d",  toolTip:"Date required"});
      setColumnProperties("ShippedDate", {format:"MMM yyyy", editFormat : "d", toolTip:"Date shipped"});
      setColumnProperties("Freight", {format:"c", toolTip:"Freight charge"});

			initialize()
		}
	}
	</script>

Run Sample

For text based columns that contain web site or e-mail addresses the value richText can be used with the format property to automatically convert the values into hyperlinks.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var contactsGrid = new DbNetGrid("contactsGrid");

		with (contactsGrid)
		{
			...

     	                setColumnProperty("website","format","richText");
    	                setColumnProperty("email","format","richText");

			initialize()
		}
	}
	</script>

Run Sample

initialValue (string)

Supplies an initial default value for a column when adding a new record

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				fromPart = "Employees"

				...
				setColumnProperty("TitleOfCourtesy","initialValue","Mr");
				...
			}
	}
	</script>

inlineEdit (boolean)

Setting this property to "true" will cause the column value to be editable directly inside the grid.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "SamplesDatabase"
				fromPart = "Products"

				setColumnExpressions("ProductID","ProductName","SupplierID","CategoryID","UnitPrice","Discontinued");
				setColumnProperty("ProductID","display",false);
				setColumnProperty("SupplierID",{lookup : "select supplierid, companyname from suppliers",editControlType : "TextBoxLookup", inlineEdit : true});
				setColumnProperty("CategoryID",{lookup : "select categoryid, categoryname from categories", inlineEdit : true});
				setColumnProperty("UnitPrice",{format : "C", inlineEdit : true, required : true});
				setColumnProperty("Discontinued",{inlineEdit : true});
				updateRow = false
				initialize()
			}
	}
	</script>

Run Sample

insertReadOnly (boolean)

Specifies that the column cannot be edited when a record is being added.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"

			setColumnExpressions("EmployeeID","FirstName","LastName","BirthDate","HireDate")
			setColumnProperty("FirstName","UpdateReadOnly",true)
			setColumnProperty("LastName","UpdateReadOnly",true)
			setColumnProperty("FirstName","Required",true)
			setColumnProperty("LastName","Required",true)
			setColumnProperty("BirthDate","ReadOnly",true)
			setColumnProperty("HireDate","InsertReadOnly",true)

			initialize()
		}
	}
	</script>

Run Sample

isBoolean (boolean)

Specifies that the column should behave like a boolean (bit) column (accepting only true/false). Some databases do not have a dedicated boolean type and with this property you can make a different data type such as an integer act like a boolean database type.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "Oracle"
				fromPart = "Products"

				setColumnExpressions("ProductName","UnitPrice","UnitsInStock", "Discontinued");
				setColumnProperty("Discontinued","isBoolean", true);

				initialize()
			}
	}
	</script>

lookup (string)

The lookup property is used to convert a value to/from its descriptive value typically held in a separate database table. The lookup property has 3 functions:

The lookup property can be specified as either an SQL statement or as a Javascript array. When specified as an SQL Statement the first column is the foreign key column that is matched against the column value and the second value is the descriptive value. When specified as a JavaScript array it should be as an array of 2 element string arrays.

Lookup as a SQL statement

The first column in the SQL statement is the value assigned to the edit field. The second column is the descriptive value displayed to the user. When a lookup is searchable ( i.e editControlType is AutoCompleteLookup or TextBoxSearchLookup) the second column (and any subsequent columns) will be searched against using the supplied user token. If only a single column is specified the column is used as the value and descriptive text.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase";
			setColumnExpressions("CustomerID","CompanyName","Region");			
			setColumnProperty("Region","lookup","select state_code, state_description from us_states")
			setColumnProperty("Region","label","State")
			initialize()
		}
	}
	</script>

Run Sample

Lookup as a Javascript array

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase";
			setColumnExpressions("CustomerID","CompanyName","Region");			
			setColumnProperty("Region","lookup","[['AK','Arkensas'],['CA','California'],['ID','Idaho'],['MT','Massachusetts'],['NM','New Mexico'],['OR','Oregon'],['WA','Washington'],['WY','Wyoming']]")
			setColumnProperty("Region","label","State")
			initialize()
		}
	}
	</script>

Run Sample

The way a lookup is implemented in the Edit Dialog can be controlled by setting the editControlType property to one of the following values DropDownList (default), TextBoxLookup, AutoCompleteLookup, TextBoxSearchLookup, ListBox or RadioButtonList

Run Sample

Using Lookup to add an aggregate value

In addition to descriptive values Lookups can also be used select aggregate values when used in a grid display context

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase";
			fromPart = "categories"
		        setColumnExpressions("CategoryName","Description","CategoryID");
		        setColumnLabels("Name","Description","Products");
		        setColumnProperty("CategoryID","lookup","select CategoryID, count(*) from products group by CategoryID");
		        setColumnProperty("CategoryID","primaryKey",true);
			initialize()
		}
	}
	</script>

Run Sample

lookupSearchMode (string)

The lookupSearchMode property is used to indicate if the search (via the search dialog) should be made directly against the column value or indirectly against the descriptive text as defined by the Lookup property. Possible values are SearchText or SearchValue.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"
			setColumnExpressions("OrderID","CustomerID","OrderDate","Freight")
			setColumnProperty(["OrderID","OrderDate","Freight"],"search",false)
			setColumnProperty("CustomerID",{label : "Customer", lookupSearchMode : "SearchText", lookup : "select CustomerID, CompanyName from Customers" })
			initialize()
		}

		var dbnetgrid2 = new DbNetGrid("dbnetgrid2");
		with (dbnetgrid2)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"
			setColumnExpressions("OrderID","CustomerID","OrderDate","Freight")
			setColumnProperty(["OrderID","OrderDate","Freight"],"search",false)
			setColumnProperty("CustomerID",{label : "Customer", lookupSearchMode : "SearchValue", lookup : "select CustomerID, CompanyName from Customers" })
			initialize()
		}
	}
	</script>

Run Sample

placeHolder (string)

Specifies text for the edit input placeholder

Run Sample

maxThumbnailHeight (number)

Specifies the maximum height of an image associated with a column when displayed as a thumbnail in the grid. The width of the image is scaled in proportion to the height.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{	
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Employees"
			setColumnExpressions("EmployeeID","FirstName","LastName","Photo");
			setColumnProperty("Photo",{uploadExtFilter:"png,jpg,gif", maxThumbnailHeight:100});
			setColumnProperty("EmployeeID","primaryKey", true);
			initialize()
		}
	}
	</script>

Run Sample

readOnly (boolean)

Indicates if a field is read-only in both insert and update mode. The column is displayed in the edit dialog but the value cannot be altered.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"

			setColumnExpressions("EmployeeID","FirstName","LastName","BirthDate","HireDate")
			setColumnProperty("FirstName","UpdateReadOnly",true)
			setColumnProperty("LastName","UpdateReadOnly",true)
			setColumnProperty("FirstName","Required",true)
			setColumnProperty("LastName","Required",true)
			setColumnProperty("BirthDate","ReadOnly",true)
			setColumnProperty("HireDate","InsertReadOnly",true)

			initialize()
		}
	}
	</script>

Run Sample

required (boolean)

When set to true then a value must be entered when editing the value

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"

			setColumnExpressions("EmployeeID","FirstName","LastName","BirthDate","HireDate")
			setColumnProperty("FirstName","Required",true)
			setColumnProperty("LastName","Required",true)

			initialize()
		}
	}
	</script>

Run Sample

search (boolean)

Indicates if a column is searchable (via the search dialog). Default is true.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Orders"
			setColumnExpressions("OrderID","CustomerID","OrderDate","Freight")
			setColumnProperty(["OrderID","OrderDate","Freight"],"search",false)
			setColumnProperty("CustomerID",{label : "Customer", lookupSearchMode : "SearchText", lookup : "select CustomerID, CompanyName from Customers" })
			initialize()
		}
	}
	</script>

searchLookup (string)

Specifies a lookup for the column in the search dialog when different from the Lookup property.

sequenceName (string)

Specifies the name of an Oracle sequence or Firebird generator that is used to generate the primary key value.

	<script>
	jQuery(document).ready( init )

	function init()
	{
			var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
			with (dbnetgrid1)
			{	
				connectionString = "Oracle"
				fromPart = "Employees"
				setColumnExpressions("EmployeeID","FirstName","Lastname")
				setColumnProperty("EmployeeID","primaryKey", true);
				setColumnProperty("EmployeeID","sequenceName", "Employee_Sequence");

				initialize()
			}
	}
	</script>

simpleSearch (boolean)

Indicates that a column is eligible to be searched against with the Simple Search dialog.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "customers"

			setColumnExpressions("CompanyName","ContactName","Address","City","Phone","Fax");

			setColumnProperty("Address","simpleSearch", false);
			setColumnProperty("Phone","simpleSearch", false);
			setColumnProperty("Fax","simpleSearch", false);

			searchDialogMode = "simple"
			initialize()
		}
	}
	</script>

Run Sample

spellCheck (boolean)

Indicates that a spell checking should be enabled for this column in the edit dialog. To enable for all column use the grid spellCheck property.

style (string)

Specifies CSS style attributes that are applied to the column when displayed in the grid.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Products"

			setColumnExpressions("ProductName","UnitPrice","UnitsInStock");

			setColumnProperty("UnitPrice","style","background-color:gold");
			setColumnProperty("UnitsInStock","editStyle","background-color:gold;font-weight:bold");

			initialize()
		}
	}
	</script>

Run Sample

totalBreak (boolean)

Identifies a column which triggers the creation of sub-totals when the column value changes.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "((customers inner join orders on orders.customerid = customers.customerid) inner join [order details] on [order details].orderid = orders.orderid)"
	        updateRow=true
		    insertRow=false
			
			setColumnExpressions("Orders.CustomerID","Orders.OrderID","[Order Details].ProductID","[Order Details].UnitPrice","[Order Details].Quantity","([Order Details].UnitPrice * [Order Details].Quantity) as OrderValue");

			setColumnProperty("CustomerID", "label", "Company");
			setColumnProperty("CustomerID", "lookup", "select CustomerID, CompanyName from customers");
			setColumnProperty("CustomerID", "totalBreak", true);

			setColumnProperty("OrderID", "totalBreak", true);
			setColumnProperty("ProductID", "lookup", "select productid, productname from products");
			setColumnProperty("UnitPrice", "aggregate", "Avg");
			setColumnProperty("UnitPrice", "format", "C");
			setColumnProperty("Quantity", "aggregate", "Sum");

			setColumnProperty("OrderValue", "aggregate", "Sum");
			setColumnProperty("OrderValue", "format", "C");

			initialize()

		}
	}
	</script>

Run Sample

toolTip (string)

Specifies a tooltip for the edit control that will be displayed when the mouse hovers over the control

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var orderLinesGrid = new DbNetGrid("orderLines");

		with (orderLinesGrid)
		{
			connectionString = "SamplesDatabase"
			fromPart = "[Order Details]"

			setColumnExpressions("OrderID","ProductID","UnitPrice","Quantity","Discount");
			setColumnProperties("ProductID", {label:"Product",lookup:"select productid, productname from products"});
			setColumnProperties("UnitPrice", {format:"c",toolTip:"Enter the net price (without tax)"});  
			setColumnProperties("Quantity",  {toolTip:"Enter quantity currently in stock"});  
			setColumnProperties("Discount", {format:"p",toolTip:"Enter discount as a percentage"});
			initialize()
		}
	}
	</script>

Run Sample

unique (boolean)

If set to true the column value will be checked for uniqueness when edited. Can be set on more than one column in which case the combination of column values must be unique. Any column that has the unique property set will automatically have the required property set to true.

Run Sample

updateReadOnly (boolean)

Specifies that the column cannot be edited when a record is being amended.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"

			setColumnExpressions("EmployeeID","FirstName","LastName","BirthDate","HireDate")
			setColumnProperty("FirstName","UpdateReadOnly",true)
			setColumnProperty("LastName","UpdateReadOnly",true)
			setColumnProperty("FirstName","Required",true)
			setColumnProperty("LastName","Required",true)
			setColumnProperty("BirthDate","ReadOnly",true)
			setColumnProperty("HireDate","InsertReadOnly",true)

			initialize()
		}
	}
	</script>

Run Sample

uploadExtFilter (string)

Specifies a comma separated inclusive list of valid file extensions that can be selected for uploading.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid2 = new DbNetGrid("dbnetgrid2");
		with (dbnetgrid2)
		{
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Employees"
			setColumnExpressions("EmployeeID","FirstName","LastName","Photo");
			setColumnProperty("Photo",{uploadExtFilter:"png,jpg,gif", maxThumbnailHeight:100});
			setColumnProperty("EmployeeID","primaryKey", true);
			initialize()
		}
	}
	</script>

Run Sample

uploadMaxFileSize (number)

Specifies the maximum size in KB of a file that can be uploaded.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid2 = new DbNetGrid("dbnetgrid2");
		with (dbnetgrid2)
		{
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Employees"
			setColumnExpressions("EmployeeID","FirstName","LastName","Photo");
			setColumnProperty("Photo",{uploadExtFilter:"png,jpg,gif", uploadMaxFileSize:500});
			setColumnProperty("EmployeeID","primaryKey", true);
			initialize()
		}
	}
	</script>

Indicates if an existing file can be overwritten when uploading a new file.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid2 = new DbNetGrid("dbnetgrid2");
		with (dbnetgrid2)
		{
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Employees"
			setColumnExpressions("EmployeeID","FirstName","LastName","Photo");
			setColumnProperty("Photo",{uploadExtFilter:"png,jpg,gif", uploadOverwrite:true});
			setColumnProperty("EmployeeID","primaryKey", true);
			initialize()
		}
	}
	</script>

uploadRootFolder (string)

If a column is storing the path to an uploaded file then the uploadRootFolder must be specified to indicate where on the server the uploaded files should be saved.

	<script>
	jQuery(document).ready( init )

	function init()
	{
		var dbnetgrid1 = new DbNetGrid("dbnetgrid1");
		with (dbnetgrid1)
		{
			connectionString = "SamplesDatabaseVistaDB"
			fromPart = "Documents"
			setColumnExpressions("DocumentID","DocumentDescription","FilePath")
			setColumnProperty("FilePath",{uploadRootFolder:"~/samples/DbNetGrid/Upload Files",uploadExtFilter:"txt, doc, xls, pdf, ppt, jpg, gif"})
			setColumnProperty("FilePath","uploadOverwrite",true)

			initialize()
		}
	}
	</script>

Run Sample

view (boolean)

Controls the appearance of the column in the View Dialog

width (number)

Specifies the width of a column edit control