2013-06-21 116 views
1

在ASP.NET应用程序中,存在一个在后面的代码中定义侦听器的网格面板。我们遇到的问题与mousedown事件有关。 在mousedown上,由于稍后进行了某些处理,因此选中该行。下面是代码:EXT.NET事件处理问题

C#:

Ext.Net.ConfigItem cItem = new Ext.Net.ConfigItem(); 
cItem.Mode = Ext.Net.ParameterMode.Raw; 
cItem.Name = "listeners"; 
cItem.Value += "{'mousedown':function(e){ if(e.target != null) setGridCurrentRow(" + gridView.ID + ",e);}}"; 
... 

JavaScript的:

function setGridCurrentRow(grid, e) { 

    var parent = Ext.fly(e.target).findParent(grid.getView().rowSelector, grid.getView().rowSelectorDepth); 

    if (parent) {  // if no row selected 
     grid.currentRow = grid.store.getRange()[parent.rowIndex].data; 
    } 
    else {    // else - row selected 
     grid.currentRow = grid.getRowsValues()[0]; 
    } 

问题被点击的网格行的组合时就产生了。该行被选中,这很好,但不显示组合值。看起来好像组合中只有一个值(当前在网格行中显示的值)。

enter image description here

但是,使用键盘导航时,该组合被打开并显示所有的值。

enter image description here

似乎对网格行覆盖组合的MouseDown事件的鼠标按下事件。我的问题是:如何在不丢失默认组合行为的情况下进行行选择?

编辑:

下面是一个简单的例子,我给自己定,在这种行为转载:

<%@ Page Language="C#" AutoEventWireup="true" %> 

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script type="text/javascript"> 
    function setGridCurrentRow(grid, e) { 
     var parent = Ext.fly(e.target).findParent(grid.getView().rowSelector, grid.getView().rowSelectorDepth); 

     if (parent) {  // if no row selected 
      grid.currentRow = grid.store.getRange()[parent.rowIndex].data; 
     } 
     else {    // else - row selected 
      grid.currentRow = grid.getRowsValues()[0]; 
     } 
    } 
</script> 

<script runat="server"> 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     if (!X.IsAjaxRequest) 
     { 
      Ext.Net.ConfigItem cItem = new Ext.Net.ConfigItem(); 
      cItem.Mode = Ext.Net.ParameterMode.Raw; 
      cItem.Name = "listeners"; 
      cItem.Value += "{'keydown':function(e){ if(e.getKey()==9){setGridCurrentRow(" + TestGrid.ID + ",e);}}"; 
      cItem.Value += ",'mousedown':function(e){ if(e.target != null) setGridCurrentRow(" + TestGrid.ID + ",e);}"; 
      cItem.Value += ",'command':function(command,gridRecord){alert('Here I am!');}}"; 
      TestGrid.CustomConfig.Add(cItem); 

      TestStore.DataSource = Data; 
      this.TestStore.DataBind();    
     } 
    } 

    private object[] Data 
    { 
     get 
     { 
      return new object[] 
      { 
       new object[] { 1, "f", "First", "" }, 
       new object[] { 2, "s", "Second", "" }, 
       new object[] { 3, "f", "First", "" }, 
       new object[] { 4, "t", "Third", "" }, 
       new object[] { 5, "f", "Fourth", "" },     
      }; 
     } 
    }   

</script> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <ext:ResourceManager ID="ResourceManager1" runat="server" /> 
    <form id="form1" runat="server"> 
    <div> 
     <ext:Store ID="TestStore" runat="server" > 
      <Reader> 
       <ext:ArrayReader IDProperty="ID" > 
        <Fields> 
         <ext:RecordField Name="ID"></ext:RecordField> 
         <ext:RecordField Name="TestText"></ext:RecordField> 
         <ext:RecordField Name="TestValue"></ext:RecordField> 
         <ext:RecordField Name="ButtonText"></ext:RecordField> 
        </Fields>      
       </ext:ArrayReader> 
      </Reader> 
     </ext:Store> 
     <ext:GridPanel ID="TestGrid" runat="server" StoreID="TestStore" Width="600" Height="350" ClicksToEdit="1" TrackMouseOver="true" Selectable="true" > 
      <ColumnModel ID="TestModel"> 
       <Columns> 
        <ext:Column ColumnID="TestText" Header="TestText" MenuDisabled="true"> 
         <Editor> 
          <ext:TextField ID="TestText_Text" runat="server"></ext:TextField>        
         </Editor> 
        </ext:Column> 
        <ext:Column ColumnID="TestValue" Header="Value" MenuDisabled="true"> 
         <Editor> 
          <ext:ComboBox ID="TestValue_Combo" runat="server" Editable="false" ForceSelection="true"> 
           <Items> 
            <ext:ListItem Text="First" Value="1" /> 
            <ext:ListItem Text="Second" Value="2" /> 
            <ext:ListItem Text="Third" Value="3" /> 
            <ext:ListItem Text="Fourth" Value="4" /> 
            <ext:ListItem Text="Fifth" Value="5" /> 
           </Items> 
          </ext:ComboBox> 
         </Editor> 
        </ext:Column> 
        <ext:Column ColumnID="TestButton" Header="Edit" MenuDisabled="true"> 
         <Commands>        
          <ext:ImageCommand Icon="ApplicationEdit" CommandName="Edit" Text="Edit" ></ext:ImageCommand> 
         </Commands> 
        </ext:Column>  
       </Columns> 
      </ColumnModel> 
      <SelectionModel > 
       <ext:CheckboxSelectionModel ID="TestSelectionModel" runat="server" ></ext:CheckboxSelectionModel> 
      </SelectionModel> 
     </ext:GridPanel> 
    </div> 
    </form> 
</body> 
</html> 
+0

请提供完整的测试案例。我会调查。 –

+0

@DaniilVeriga:谢谢你的回复!不幸的是,我无法提供完整的示例,因为这是我们巨大项目的一部分,它有很多C#和javaScript代码。在这里我已经隔离了与问题相关的部分。此外,我添加了图像以更好地解释情况。有什么想法吗?提前致谢! –

+0

不幸的是,我对可能的原因没有任何想法。那么,应该可以将一个巨大的项目剥离为一个简单的测试用例。是的,可能需要一些时间。另一个选择是采取[一些基本的例子](http://examples.ext.net/#/GridPanel/ArrayGrid/Simple/),并扩展它的相关功能,直到它开始重现问题。 –

回答

1

该调用导致行为:

grid.getRowsValues()[0]; 

我不知道为什么,但作为一种解决方案,请尝试将其替换为:

grid.getStore().getAt(0).data 
+0

太棒了,这工作,谢谢! –