26000 - How to Enable Editing in a JSP TableView

Sample 26000: How to Enable Editing in a JSP TableView

Overview

This sample shows how to create and render a TableView with editing enabled. This sample creates a TableViewComposite, which is a TransformationBean™ that is composed of other TransformationBeans that include the following subcomponents: MenuBar, NavigationBar, TableView, Title, and Footer.

Here are the steps for creating a simple TableView with an ActionProvider:

Create a TableModel.
Create a TableView.
Set the model on the TableView.
Create an ActionProvider.
Set the ActionProvider on the TableView.
Render the TableView.

The code shown on the Full Code tab will create a TableModel and ActionProvider and display a default TableViewComposite with that model and ActionProvider. It will also enable editing on the member, row, and cell levels.

For simplicity, this sample uses its own static data model for the TableView. In most real-world use cases, users will connect to live data and not create their own data model. For more information about how to connect the TableView to live data, see Sample 25997.

Customizations

The following customizations are explained in this example:

Row-level editing
Member-level editing
Using a cell editor

Row-level editing

Add a <sas:TableView> tag and a <sas:Edit> tag to enable row-level editing:

<sas:TableViewComposite id="sas_TableView1" model="sas_model" actionProvider="sas_actionProvider" scope="session"> 
   <sas:RelationalMenuBar/>
   <sas:TableView>
      <sas:Edit enabled="true"/>
   </sas:TableView>
</sas:TableViewComposite>

Member-level editing

Modify the <sas:Edit> tag to enable member level editing:

<sas:Edit enabled="true" 
singleRowEditing="false"/>

Using a cell editor

Add the following import to the top of the servlet:

import javax.swing.DefaultComboBoxModel;

Add code to the servlet to create the model for the cell editor:

   String items[] = {"F", "M"}; 
   DefaultComboBoxModel comboBoxModel = new DefaultComboBoxModel(items);
   session.setAttribute("comboBoxModel",comboBoxModel);

Modify the TableView tag to use a combo box for Gender, and specify the comboBoxModel to be used:

<sas:TableViewComposite id="tableView1"  scope="session" render="false">
   <sas:RelationalMenuBar />
   <sas:TableView>
      <sas:Edit enabled="true"/>
      <sas:CellEditor startRow="1" endRow="-1" startColumn="3" endColumn="3">
         <sas:CellContentsChoiceBoxEditor model="comboBoxModel" /> 
      </sas:CellEditor>
   </sas:TableView>
</sas:TableViewComposite>

About editing dynamic data

This example uses static hard-coded data. However, if you are connecting to live data via an adapter, such as the JDBCToTableModelAdapter, you will need to call the following on your adapter in order to enable editing of the dataset model.

setReadOnly(false);

Additional Documentation

For a list of samples for common tasks, see SAS Note 32218.
The SAS AppDev Studio Developer's Site contains detailed information that will assist you when developing Web applications with SAS AppDev Studio, including an API reference and the custom tag reference for the sas tagset.

These sample files and code examples are provided by SAS Institute Inc. "as is" without warranty of any kind, either express or implied, including but not limited to the implied warranties of merchantability and fitness for a particular purpose. Recipients acknowledge and agree that SAS Institute shall not be liable for any damages whatsoever arising out of their use of this material. In addition, SAS Institute will provide no support for the materials contained herein.

Instructions

Build a new Web application project in SAS^® AppDev Studio by using the Model 2 Servlet template.
The template will generate a servlet and a JSP file, which, by default, are named Model2ExampleControllerServlet.java and Model2ExampleViewer.jsp. Replace the contents of these files with the code below.
Execute the servlet on the test Tomcat server.

Tip: For help with building a Web application project and testing a Web application, see SAS Note 32218.

Code for Model2ExampleViewer.jsp


<%@ taglib uri="http://www.sas.com/taglib/sas" prefix="sas" %>
<%@ page pageEncoding="UTF-8"%>

<html>
<head>
    <link href="styles/sasComponents.css" rel="STYLESHEET" type="text/css">
</head>
<body>

<sas:TableViewComposite ref="tableView"  scope="session" >
	<sas:RelationalMenuBar />
	<sas:TableView>
	  <sas:Edit enabled="true"/>
	  <sas:CellEditor startRow="1" endRow="-1" startColumn="3" endColumn="3"> 
		<sas:CellContentsChoiceBoxEditor model="comboBoxModel" /> 
	  </sas:CellEditor>
	</sas:TableView>
</sas:TableViewComposite>

</body>
</html>

Code for Model2ExampleControllerServlet.java

Required changes

If you did not use the default values during the generation of the project, you might need to update the following values.

The package for the servlet.
package servlets;
The servlet name.
public class Model2ExampleControllerServlet.java ...
The URL mapping for the action provider, which must match the servlet mapping for the servlet.
sas_actionProvider.setControllerURL(request.getContextPath()+ "/Model2Example");
The JSP page that the servlet forwards to.
RequestDispatcher rd = getServletContext().getRequestDispatcher("/Model2ExampleViewer.jsp");


package servlets;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import javax.swing.DefaultComboBoxModel;
import javax.swing.table.DefaultTableModel;
import javax.swing.table.TableModel;

import com.sas.actionprovider.HttpActionProvider;
import com.sas.servlet.tbeans.tableview.html.TableViewComposite;
import com.sas.swing.models.SortableTableModelAdapter;

public class Model2ExampleControllerServlet extends
		javax.servlet.http.HttpServlet {
	// Declare a default version ID since parent class implements
	// java.io.Serializable
	private static final long serialVersionUID = 1L;

	/*
	 * doPost() Respond to the Post message.
	 */
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		// Note: Calling doGet to provide same behavior to POST and GET HTTP
		// methods.
		doGet(request, response);
	}

	/*
	 * doGet() Respond to the Get message.
	 */
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		// Note: Add User DO_GET code here
		HttpSession session = request.getSession();

		// Setup the ActionProvider
		HttpActionProvider actionProvider = null;
		synchronized (session) {
			if (session != null) {
				actionProvider = (HttpActionProvider) session
						.getAttribute("actionProvider");
			}
			// if ActionProvider is null, create one and put it on the session
			if (actionProvider == null) {
				actionProvider = new HttpActionProvider();
				actionProvider.setLocale(request.getLocale());
				actionProvider.setControllerURL(request.getContextPath()
						+ "/Model2Example");
				actionProvider.setName("actionProvider");
				// store object in its scope
				if (session != null)
					session.setAttribute("actionProvider", actionProvider);
			}
			// else execute the ActionProvider command
			else {
				actionProvider.executeCommand(request, response, response
						.getWriter());
			}
		}

		TableViewComposite tableView = null;
		synchronized (session) {
			if (session != null) {
				tableView = (TableViewComposite) session
						.getAttribute("tableView");
			}
			if (null == tableView) {
				tableView = new TableViewComposite();
				String columnNames[] = { "Name", "Age", "Sex", "Hobby" };
				String data1[] = { "Bob", "42", "M", "Sailing" };
				String data2[] = { "Mary", "33", "F", "Gardening" };
				String data3[] = { "Jane", "27", "F", "Shopping" };
				String data4[] = { "Tom", "65", "M", "Reading" };
				String data5[] = { "Dave", "23", "M", "Skiing" };
				Object data[][] = new Object[5][4];
				data[0] = data1;
				data[1] = data2;
				data[2] = data3;
				data[3] = data4;
				data[4] = data5;
				TableModel defaultTableModel = new DefaultTableModel(data,
						columnNames);
				SortableTableModelAdapter adapter = new SortableTableModelAdapter(
						defaultTableModel);
				tableView.setModel(adapter);

				// set the actionProvider on the table
				tableView.setActionProvider(actionProvider);
				session.setAttribute("tableView", tableView);

				// Create a model for the cell editor. 
				String items[] = { "", "F", "M" };
				DefaultComboBoxModel comboBoxModel = new DefaultComboBoxModel(
						items);
				session.setAttribute("comboBoxModel", comboBoxModel);

			}

		}

		RequestDispatcher rd = getServletContext().getRequestDispatcher(
				"/Model2ExampleViewer.jsp");
		rd.forward(request, response);

	}
}