DbNetSuite Sample

Example

Source

Menu

|

|

Run as

Documents and images can be maintained by uploading them to the file system and storing the path in the database or by uploading the file directly into a database column capable of storing binary data. In the first example the name of the folder into which the files are uploaded is specified by the uploadRootFolder property. In both examples the types of files that can be uploaded are restricted using the uploadExtFilter property. The maximum size of thumbnail images can be controlled via the column maxThumbnailHeight property. The sample also demonstrates use of the onFileUploaded event to assign a default description.

Storing images in the file system	Storing images in the database
Storing documents in the file system	Storing documents in the database

Include the client JavaScript & CSS libraries

	<link rel="stylesheet" type="text/css" href="dbnetsuite.css.ashx" />
	<script language="JavaScript" src="dbnetsuite.js.ashx"></script>

Client-side configuration script

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

	function init()
	{
		var dbnetedit1 = new DbNetEdit("dbnetedit1");
		with (dbnetedit1)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Documents"
			setColumnExpressions("DocumentID","DocumentDescription","FilePath")
			setColumnLabels("DocumentID","Description","Image")
			setColumnProperty("FilePath",{uploadRootFolder:"~/samples/Files",uploadExtFilter:"png,jpg,gif"})
			fixedFilterSql = "FilePath like '%.png' or FilePath like '%.jpg' or FilePath like '%.gif'";
			bind("onFileUploaded", assignFileName);
		
			initialize()
		}

		var dbnetedit2 = new DbNetEdit("dbnetedit2");
		with (dbnetedit2)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Employees"
			setColumnExpressions("EmployeeID","FirstName","LastName","Photo");
			setColumnProperty("Photo",{uploadExtFilter:"png,jpg,gif",maxThumbnailHeight : 60});
			setColumnProperty("EmployeeID","primaryKey", true);

			initialize()
		}
		
		var dbnetedit3 = new DbNetEdit("dbnetedit3");
		with (dbnetedit3)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Documents"
			setColumnExpressions("DocumentID","DocumentDescription","FilePath")
			setColumnLabels("DocumentID","Description","PDF")
			setColumnProperty("FilePath",{uploadRootFolder:"~/samples/Files",uploadExtFilter:"pdf"})
			fixedFilterSql = "FilePath like '%.pdf'";
			bind("onFileUploaded", assignFileName);
		
			initialize()
		}		
		
		var dbnetedit4 = new DbNetEdit("dbnetedit4");
		with (dbnetedit4)
		{
			connectionString = "SamplesDatabase"
			fromPart = "Documents"
			setColumnExpressions("DocumentID","DocumentDescription","blob")
			setColumnLabels("DocumentID","Description","PDF")
			
			bind("onFileUploaded", assignFileName);
			setColumnProperty("blob","uploadExtFilter","pdf")
			fixedFilterSql = "Blob is not null";			
			initialize()
		}			
		
	}
	
	function assignFileName(sender, args)
	{
		if (sender.getInputControl("DocumentDescription").val() == "")
			sender.getInputControl("DocumentDescription").val(args.fileName.split(".")[0])
	}
	</script>

HTML markup

<table>
	<tr>
		<td style="vertical-align:top">
			<fieldset>
			<legend>Storing images in the file system</legend>
				<div id="dbnetedit1"></div>
			</fieldset>
		</td>
		<td style="vertical-align:top">
			<fieldset>
			<legend>Storing images in the database</legend>
				<div id="dbnetedit2"></div>
			</fieldset>
		</td>
	</tr>
	<tr>
		<td style="vertical-align:top">
			<fieldset>
			<legend>Storing documents in the file system</legend>
				<div id="dbnetedit3"></div>
			</fieldset>
		</td>
		<td style="vertical-align:top">
			<fieldset>
			<legend>Storing documents in the database</legend>
				<div id="dbnetedit4"></div>
			</fieldset>
		</td>
	</tr>	
</table>