Model view controller EXT.net-通过实体的网格面板，带有下拉列表、日期、Pin编辑和删除

标题听起来很有意思，所以让我来解释一下。我非常擅长磨出Web表单，这是我在使用框架和MVC方面的第二次尝试（不要问第一次）。从这样的表开始：

    <asp:ObjectDataSource runat="server" ID="MilestonesObjectSource" SelectMethod="GetByProject"
        DeleteMethod="DeleteMilestone" TypeName="TCProjectManagement.Models.MilestonesAddition">
        <SelectParameters>
            <asp:Parameter DefaultValue="6" Name="ProjectID" Type="Int32" />
        </SelectParameters>
        <DeleteParameters>
            <asp:Parameter Type="Int32" Name="Id" />
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Type="Int32" Name="Id" />
            <asp:Parameter Type="Int32" Name="Number" />
            <asp:Parameter Type="String" Name="Name" />
            <asp:Parameter Type="Int32" Name="Status_Id" />
            <asp:Parameter Type="DateTime" Name="PlannedDate" />
            <asp:Parameter Type="DateTime" Name="LatestEstimate" />
            <asp:Parameter Type="Int32" Name="MilestoneType_ID" />
        </UpdateParameters>
    </asp:ObjectDataSource>

标题：里程碑
Id int-自动，主键
Project_Id int-FK，一个项目的多个里程碑，目前提供静态设置
数字int
名称varchar（50）
状态\ Id int-FK一个状态到一个里程碑
计划日期日期
最晚估计日期
MilestoneType_ID int-FK一对一里程碑

它们都位于SQL server上，由实体拉入，然后由ObjectDataSource拉入，如下所示：

    <asp:ObjectDataSource runat="server" ID="MilestonesObjectSource" SelectMethod="GetByProject"
        DeleteMethod="DeleteMilestone" TypeName="TCProjectManagement.Models.MilestonesAddition">
        <SelectParameters>
            <asp:Parameter DefaultValue="6" Name="ProjectID" Type="Int32" />
        </SelectParameters>
        <DeleteParameters>
            <asp:Parameter Type="Int32" Name="Id" />
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Type="Int32" Name="Id" />
            <asp:Parameter Type="Int32" Name="Number" />
            <asp:Parameter Type="String" Name="Name" />
            <asp:Parameter Type="Int32" Name="Status_Id" />
            <asp:Parameter Type="DateTime" Name="PlannedDate" />
            <asp:Parameter Type="DateTime" Name="LatestEstimate" />
            <asp:Parameter Type="Int32" Name="MilestoneType_ID" />
        </UpdateParameters>
    </asp:ObjectDataSource>

太好了。数据提取似乎没问题。我还有几个对象源专门处理外键，所以我将跳过它们，因为它们似乎正在工作

我遇到的问题是试图把许多似乎不太协调的例子拼凑在一起。我的目标不分先后：

1） Pin编辑：点击要编辑的按钮，再次点击确认。与其让别人推断双击进行更改，不如这样做。到目前为止，这类方法很有效。
2） 外键下拉列表：不处于编辑模式时，应显示FK的“名称”字段。在“编辑”中，它应该是选项的下拉列表（只有三个）。无论我做什么，这都是空白。
3） 删除：按下按钮吹走一行。我把按钮放在那里，但它是一个用于编辑的JS副本。我需要使用什么才能将其删除？
4） 日期：这根本不起作用。其中一个奇怪的部分是，从SQL server的日期类型来看，它在实体中被更改为DateTime，并且始终保持这种状态。但是，我无法获得所需的ext:DateField控件来配合提供的数据，因为它显示时间，并且在编辑时完全空白。。我知道我在这里做错了什么。
5） 保存更改：不太确定设置是否正确（或完全正确）。

Javascript的规定：

<script type="text/javascript">
            var pinEditors = function (btn, pressed) {
                var columnConfig = btn.column,
                column = columnConfig.column;

                if (pressed) {
                    column.pinOverComponent();
                    column.showComponent(columnConfig.record, true);
                } else {
                    column.unpinOverComponent();
                    column.hideComponent(true);
                }
            };
            var pinDeleters = function (btn, pressed) { };
        </script>

var pinEditors=功能（btn，按下）{
var columnConfig=btn.column，
column=columnConfig.column；
如果（按下）{
column.pinOverComponent（）；
column.showComponent（columnConfig.record，true）；
}否则{
column.unpinOverComponent（）；
hideComponent列（true）；
}
};
var pinDeleters=函数（btn，按下）{}；

和ASP代码：

    <ext:GridPanel ID="MilestonesGridPanel" runat="server" Title="Milestones" Width="1000px"
        Height="300px">
        <Store>
            <ext:Store ID="MilestonesGridStore" runat="server" DataSourceID="MilestonesObjectSource">
                <Model>
                    <ext:Model runat="server" IDProperty="Id">
                        <Fields>
                            <ext:ModelField Name="Id" Type="Int" />
                            <ext:ModelField Name="Number" Type="Int" />
                            <ext:ModelField Name="Name" Type="String" />
                            <ext:ModelField Name="Status_Id" Type="Int" />
                            <ext:ModelField Name="PlannedDate" />
                            <ext:ModelField Name="LatestEstimate" />
                            <ext:ModelField Name="MilestoneType_ID" Type="Int" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        </Store>
        <ColumnModel>
            <Columns>
                <ext:Column ID="IdColumn" runat="server" DataIndex="Id" Text="DBID" Visible="false" />
                <ext:ComponentColumn ID="NumberColumn" runat="server" DataIndex="Number" OverOnly="true"
                    Pin="true" Flex="1" Text="Number" Editor="true">
                    <Component>
                        <ext:NumberField ID="NumberColumnNumberField" runat="server" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="NameColumn" runat="server" DataIndex="Name" OverOnly="true"
                    Pin="true" Flex="1" Text="Name" Editor="true">
                    <Component>
                        <ext:TextField ID="NameColumnTextField" runat="server" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="StatusColumn" runat="server" DataIndex="Status_Id" OverOnly="true"
                    Pin="true" Flex="1" Text="Status" Editor="true">
                    <Component>
                        <ext:ComboBox ID="StatusColumnDropDownBox" runat="server" QueryMode="Local" Editable="false"
                            StoreID="MilestoneStatusStore" DisplayField="Name" ValueField="ID" EmptyText="Empty" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="PlannedDateColumn" runat="server" DataIndex="PlannedDate"
                    OverOnly="true" Pin="true" Flex="1" Text="Planned Date" Editor="true">
                    <Renderer Format="Date" FormatArgs="'m/d/y'" />
                    <Component>
                        <ext:DateField ID="PlannedDateColumnTextField" runat="server" Format="MM/dd/yyyy"
                            EmptyText="Empty" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="LatestEstimateColumn" runat="server" DataIndex="LatestEstimate"
                    OverOnly="true" Pin="true" Flex="1" Text="Latest ETA" Editor="true">
                    <Renderer Format="Date" FormatArgs="'m/d/y'" />
                    <Component>
                        <ext:DateField ID="LatestEstimateColumnTextField" runat="server" Format="MM/dd/yyyy"
                            EmptyText="Empty" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="MilestoneTypeColumn" runat="server" DataIndex="MilestoneType_ID"
                    OverOnly="true" Pin="true" Flex="1" Text="Milestone Type" Editor="true">
                    <Component>
                        <ext:ComboBox ID="MilestoneTypeColumnComboBox" runat="server" QueryMode="Local" Editable="false"
                            StoreID="MilestoneTypesStore" DisplayField="Name" ValueField="ID" EmptyText="Empty" />
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="EditColumn" runat="server" Width="30" PinAllColumns="false"
                    AutoWidthComponent="false" OverOnly="true" Text="Edit" Sortable="False">
                    <Component>
                        <ext:Button ID="EditButton" runat="server" ToolTip="Pin Editors" Icon="Pencil" AllowDepress="true"
                            EnableToggle="true" Width="25">
                            <Listeners>
                                <Toggle Fn="pinEditors" />
                            </Listeners>
                        </ext:Button>
                    </Component>
                </ext:ComponentColumn>
                <ext:ComponentColumn ID="DeleteColumn" runat="server" Width="30" PinAllColumns="false"
                    AutoWidthComponent="false" OverOnly="true" Text="Delete" Sortable="False">
                    <Component>
                        <ext:Button ID="DeleteButton" runat="server" ToolTip="Delete Milestone" Icon="Delete"
                            AllowDepress="true" EnableToggle="false" Width="25">
                            <Listeners>
                                <Click Handler="#{MilestonesGridStore}.remove(this.parentMenu.dataRecord)" />
                            </Listeners>
                        </ext:Button>
                    </Component>
                </ext:ComponentColumn>
            </Columns>
        </ColumnModel>
        <SelectionModel>
            <ext:RowSelectionModel runat="server" Mode="Single">
                <Listeners>
                    <Select Handler="#{DeleteMilestoneGridButton}.enable();" />
                    <Deselect Handler="if (!#{MilestonesGridPanel}.selModel.hasSelection()) { 
                                #{DeleteMilestoneGridButton}.disable();
                                       }" />
                </Listeners>
            </ext:RowSelectionModel>
        </SelectionModel>
        <Buttons>
            <ext:Button ID="AddtoMilestoneGridButton" runat="server" Text="Insert" Icon="Add">
                <Listeners>
                    <Click Handler="#{MilestonesGridStore}.insert(0, {}); #{MilestonesGridPanel}.editingPlugin.startEditByPosition({row:0, column:0});" />
                </Listeners>
            </ext:Button>
            <ext:Button ID="DeleteMilestoneGridButton" runat="server" Text="Delete" Icon="Delete"
                Disabled="true">
                <Listeners>
                    <Click Handler="#{MilestonesGridPanel}.deleteSelected();
                                    if (!#{MilestonesGridPanel}.hasSelection()) {
                                        #{DeleteMilestoneGridButton}.disable();
                                    }" />
                </Listeners>
            </ext:Button>
            <ext:Button ID="RefreshMilestonesGridButton" runat="server" Text="RefresH" Icon="Reload">
                <Listeners>
                    <Click Handler="#{MilestonesGridStore}.load();" />
                </Listeners>
            </ext:Button>
            <ext:Button ID="SaveMilestoneGridButton" runat="server" Text="Save" Icon="Disk">
                <Listeners>
                    <Click Handler="#{MilestonesGridStore}.sync();" />
                </Listeners>
            </ext:Button>
        </Buttons>
    </ext:GridPanel>

---

2日更新：我让下拉框工作，但它们显示的是ID号而不是值。我采纳的一个建议是

，它似乎不起作用，因为（我认为）数据不是GetById的返回类型（ModelProxy）的成员。