使用SmarGWT DynamicForm和Form项创建嵌套的DynamicForm

Question

我有一个工作的SmarGWT数据源，它返回嵌套的JSON，如下所示：

{username:"tom",password:"pwd",userType:{id:1,name:"admin user type"}}

示例DataSource如下所示：

DataSourceTextField usernameField = new DataSourceTextField("username", "User Name");
DataSourceTextField passwordField = new DataSourceTextField("password", "Password");
DataSourceIntegerField userTypeIdField = new DataSourceIntegerField ("id", "User Type Id");
userTypeIdField.setValueXPath("userType/id");

然后，我可以将这个DS绑定到一个列表网格和/或表单上，这样可以正常地显示数据。

如果我创建一个与这个DS相关联的DynamicForm，我想要创建一个新的记录。我有一个用户名和密码文本框，这个文本框很好，我有一个SelectItem，它将id返回给用户类型(1用于Admin，2用于Oher)。

当我们从该表单中获取数据并查看从表单发送到DS的JSON时，如下所示：

{username:"newuser",password:"newpwd",userTypeId:1}

但我更希望：

{username:"newuser",password:"newpwd",userType:{id:1}}

因为这个JSON版本的数据会很好地转换成我想要发送给控制器的对象，然后控制器会将这个对象存档。但是，我不知道DynamicForm和/或SelectItem是否能够做到这一点。

我知道其中一种可行的方法是，当我将JSON发送回一个insert或update时查看它。在transformRequest中，我可以手动调整JSON以删除userTypeId:1，并在其中添加userType:{id:1}。

或者，我可以查看一个嵌套的DataSource，我已经很久没有这样做了。

我只是不确定从SmarGWT的角度来看，这将是一个更好的主流解决方案。

如果我需要更多的信息，请告诉我，我会更新这个问题。提前感谢您的帮助！

Answer 1

这太简单了。首先，在UserType的数据源中，我认为这非常简单。usertypeId，userTypeName，UserTypeDescription如下所示：

private DataSourceIntegerField userTypeIdField;
private DataSourceTextField userTypeNameField;
private DataSourceTextField userTypeCodeField;

现在假设您为用户提供了一个数据源，您可能有用于userId、用户名、密码等的字段，如果UserType是其中的一部分，那么您应该这样做：

private DataSourceField userTypeField;  // notice it is a DataSourcField

至于宣言：

    userTypeField = new DataSourceField();
    userTypeField.setTitle("User Type");
    userTypeField.setName("userType");
    userTypeField.setTypeAsDataSource(UserTypeDataSource.getInstance());

如果您知道您正在获得嵌套的JSON或XML数据，这是一种很好的方法。我还知道，在某些情况下，有人使用数据源字段的DataSource设置将嵌套的JSON格式夷为平地。

在SmartGWT DynamicForm端，您可以接受字段并添加setDataPath绑定，如下所示：

    userTypeField.setName("userType");
    userTypeField.setPickListWidth(210);
    userTypeField.setTitle("User Type");
    userTypeField.setOptionDataSource(userTypeDS);
    userTypeField.setRequired(true);
    userTypeField.setDisplayField("userTypeName");
    userTypeField.setValueField("userTypeId");
    userTypeField.setDataPath("userType/userTypeId");

因此，如果您有一个用户DynamicForm，并且希望设置一个UserType，则DataPath将保留嵌套的JSON，因此您将拥有如下内容：

user:
{"userId":1,"username":"test","password":"password",
    "userType":{"userTypeId":2}
}

这看起来很简单，但也许这会帮到别人。