JQGrid: ดรอปดาวน์สำหรับการเลือกรายการจากตารางต่างประเทศ - DataValueField กับ DataTextField

สมมติว่ารายการและ ItemTypes มีคีย์หลักที่เป็นตัวเลข ItemID และ ItemTypeID แต่ละรายการจะได้รับการกำหนดประเภทรายการ

ฉันมี JQGrid เพื่อแก้ไขรายการ เมื่อไม่อยู่ในโหมดแก้ไข ฉันต้องการเห็นชื่อของ ItemType ไม่ใช่ ItemTypeID:

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

ในโหมดแก้ไข ฉันต้องการดูดรอปดาวน์ที่แสดงข้อความ ItemType แต่จะส่งคืน ItemTypeID ไปยังเซิร์ฟเวอร์

นี่คือสิ่งที่ฉันมีจนถึงตอนนี้ (โดยใช้ ASP.NET wrapper สำหรับ JQGrid):

<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" />

ปัญหาคือเมื่อไม่อยู่ในโหมดแก้ไข ระบบจะแสดง ItemTypeID ที่เป็นตัวเลข แทนที่จะเป็นป้ายกำกับข้อความ:

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

มีวิธีใดบ้างที่จะให้ JQGrid เคารพความแตกต่างระหว่าง DataValueField และ DataTextField (ไม่ว่าจะใช้ jQuery API หรือปลั๊กอิน ASP.NET)


person Herb Caudill    schedule 21.12.2009    source แหล่งที่มา


คำตอบ (3)


สำหรับผู้ที่ใช้ javascrpt ไม่ใช่ wrapper ของ asp.net วิธีจาวาสคริปต์คือการใช้ฟอร์แมตเตอร์และตัวไม่ฟอร์แมต:

แบบจำลองคอลัมน์:

ตัวเลือกการแก้ไข:{value:'1:Type1;2:Type2;3:Type3;4:Type4;5:Type5'}, formatter:showTextFmatter, unformat:unformatShowText,

ฟอร์แมตเตอร์ของฉัน คุณควรเขียนของคุณเองดังนี้:

    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];  
    }  
person Bili    schedule 03.05.2010

พบวิธีแก้ปัญหาที่ดีที่นี่: 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 ของ Grid หวังว่านี่จะช่วยใครซักคน

person Herb Caudill    schedule 02.03.2010

เฮิร์บ ปัญหาคือคุณกำลังใช้ datafield="ItemTypeID" คุณต้องเปลี่ยนเป็นบางอย่างเช่น CategoryTitle

นี่คือตัวอย่าง http://www.trirand.net/examples/editing_data/edit_types/default.aspx

person João Guilherme    schedule 06.01.2010
comment
โปรดอ่านคำถามอีกครั้ง - นี่ไม่ได้ช่วยอะไรจริงๆ ปัญหาคือฉันต้องการจัดเก็บ ID (เช่น ItemTypeID) แต่แสดงชื่อ (เช่น Title) - person Herb Caudill; 02.03.2010