代码之家  ›  专栏  ›  技术社区  ›  Herb Caudill

JQGrid:用于从外部表中选择项的下拉列表-DataValueField vs DataTextField

  •  3
  • Herb Caudill  · 技术社区  · 16 年前

    假设Items和ItemType具有数字主键ItemID和ItemTypeID。为每个项目分配一个ItemType。

    我有一个JQGrid来编辑项目。当不处于编辑模式时,我希望看到ItemType的名称,而不是ItemTypeID:

        TYPE       | TITLE
        -----------+--------------------
        Category A | Item 1
        Category A | Item 2
        Category B | Item 3
        Category B | Item 4
    

    在编辑模式下,我希望看到一个下拉列表,显示ItemType文本,但将ItemTypeID返回给服务器。

    以下是我到目前为止所做的(使用JQGrid的ASP.NET包装):

    <trirand:jqgrid id="Grid1" runat="server" ... >
        <columns>
            <trirand:jqgridcolumn datafield="ItemID" editable="false" visible="false" width="50" primarykey="true" />
            <trirand:jqgridcolumn datafield="ItemTypeID" editable="true" edittype="DropDown" editorcontrolid="ItemTypes" />
            <trirand:jqgridcolumn datafield="Title" editable="true" sortable="true" />
            ...
        </columns>
    </trirand:jqgrid>
    <asp:sqldatasource runat="server" id="ItemTypesDatasource" connectionstring="<%$ ConnectionStrings:Main %>" selectcommand="Select ItemTypeID,Title from ItemTypes order by Title" />
    <asp:dropdownlist runat="server" id="ItemTypes" datasourceid="ItemTypesDatasource" datavaluefield="ItemTypeID" datatextfield="Title" />
    

        TYPE       | TITLE
        -----------+--------------------
        100123     | Item 1
        100123     | Item 2
        100124     | Item 3
        100124     | Item 4
    

    3 回复  |  直到 16 年前
        1
  •  1
  •   Bili    16 年前

    对于那些使用javascrpt而不是asp.net包装器的用户,javascript的方式是使用formatter和UnformMatter:

    柱模型:

    编辑选项:{value:'1:Type1;2:类型2;3:类型3;4:类型4;5:Type5'}, 格式化程序:showTextFmatter,未格式化:未格式化showtext,

    我的格式化程序,您应该编写自己的格式,如下所示:

        function showTextFmatter (cellvalue, options, rowObject)   
        {  
           var vts={};
           if(options.colModel.editoptions.values==undefined)
           {
               vtStr = options.colModel.editoptions.value.split(';');
               for(var i =0;i<vtStr.length;i++)
               {
                  kv = vtStr[i].split(':');
                  vts[kv[0]]=vtStr[i]; 
               }
               options.colModel.editoptions.values = vts;
           }
           return options.colModel.editoptions.values[cellvalue];   
        }   
        function  unformatShowText (cellvalue, options)   
        { 
           return cellvalue.split(':')[0];  
        }  
    
        2
  •  0
  •   Herb Caudill    16 年前

    在这里找到了一个很好的解决方案: http://www.trirand.net/forum/default.aspx?g=posts&t=168

    这个想法是为了处理这个问题 CellBinding 事件,并查找与单元格包含的ID对应的文本。

    protected void JQGrid1_CellBinding(object sender, Trirand.Web.UI.WebControls.JQGridCellBindEventArgs e)
       {
          if (e.ColumnIndex == 1) // index of your dropdown column
          {
             e.CellHtml = LookupText(e.CellHtml);
          } 
       }
    

    LookupText EditValues (例如。 1:One;2:Two;3:Three

    我已经将所有这些逻辑包装到一个自定义列类(在VB.NET中)中,该类还根据您给出的SQL命令填充下拉列表。

    Public Class JqGridDropDownColumn
        Inherits Trirand.Web.UI.WebControls.JQGridColumn
    
        Private _SelectCommand As String
        '' /* The SQL command used to populate the dropdown. */
        '' /* We assume that the first column returned contains the value (e.g. BudgetID)  and the second column contains the text (e.g. Title). */
        Public Property SelectCommand() As String
            Get
                Return _SelectCommand
            End Get
            Set(ByVal value As String)
                _SelectCommand = value
            End Set
        End Property
    
        Private _DropDownNullText As String
        Public Property DropDownNullText() As String
            Get
                Return _DropDownNullText
            End Get
            Set(ByVal value As String)
                _DropDownNullText = value
            End Set
        End Property
    
        Private WithEvents Grid As JQGrid
        Private DropDownValues As DataTable
    
        Sub Init(g)
            Grid = g
            DropDownValues = ExecuteDataset(cs, CommandType.Text, Me.SelectCommand).Tables(0)
            DropDownValues.PrimaryKey = New DataColumn() {DropDownValues.Columns(0)}
            Me.EditValues = BuildEditValues(DropDownValues)
        End Sub
    
        '' /* Builds a string of the form "1:One;2:Two;3:Three" for use by the EditValues property. */
        '' /* This assumes that Table consists of two columns corresponding to the Value (e.g. BudgetID) and Text (e.g. Title), in that order. */ 
        Protected Function BuildEditValues(ByVal Table As DataTable) As String
            Dim Result As String = ""
            If Not String.IsNullOrEmpty(Me.DropDownNullText) Then
                Result = String.Format(":{0}", Me.DropDownNullText)
            End If
            For Each Row As DataRow In Table.Rows
                If Len(Result) > 0 Then Result &= ";"
                Result &= Row(0) & ":" & Row(1)
            Next
            Return Result
        End Function
    
    
        Private Sub Grid_CellBinding(ByVal sender As Object, ByVal e As Trirand.Web.UI.WebControls.JQGridCellBindEventArgs) Handles Grid.CellBinding
            '' /* Display the text (e.g. Title) rather than the value (e.g. BudgetID) */
            If Grid.Columns(e.ColumnIndex) Is Me Then
                e.CellHtml = LookupText(e.CellHtml)
            End If
        End Sub
    
        Private Function LookupText(ByVal Value As String) As String
            Dim MatchingRow As DataRow = DropDownValues.Rows.Find(Value)
            If MatchingRow IsNot Nothing Then
                Return MatchingRow(1) '' /* Column 1 is assumed to contain the text */
            Else
                Return ""
            End If
        End Function
    End Class
    

    你只需要打个电话 DropdownColumn.Init(MyGrid) 从网格的 init 事件希望这对别人有帮助。

        3
  •  -1
  •   João Guilherme    16 年前

    赫伯,问题是您使用的是datafield=“ItemTypeID”。你必须把它改成类似CategoryTitle的东西。

    这里还有一个例子 http://www.trirand.net/examples/editing_data/edit_types/default.aspx