PDA

View Full Version : [CLOSED] why text disapear when click the dropdown column



hdsoso
Aug 14, 2013, 4:03 PM
when click the downdown column which id is "col_menu", when the column cell text disapear. why?
please see
http://screencast.com/t/6rxcMCeAo7d

I wrote a test case , could you please resolve this issue?



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="role_menu1.aspx.cs" Inherits="extdemo.admin.pages.role_menu1" %>



<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script>
var roleRenderer = function (value) {
if (!Ext.isEmpty(value)) {
return App.store_role1.getById(value).data.rolename;
}
return value;
};
var menuRenderer = function (value) {
if (value != null && value != '') {
var r = App.store_menu.getNodeById(value);
if (!Ext.isEmpty(r)) {
return r.data.name;
}
}
return r.data.name;
};

var fn1 = function (value) {
this.field.onTriggerClick();
App.btn_save.setDisabled(false);
};
var fn2 = function (value) {

this.field.onTriggerClick();
App.btn_save.setDisabled(false);
};
var menu_sel = function (item, record, node, index, e) {

App.ddf_menu.select(record.data.name, record.data.id);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server"></ext:ResourceManager>

<ext:GridPanel runat="server" ID="gp_role" Title="角色菜单管理11">
<Listeners>
<BeforeRender Handler="this.getBinComponent('store_menu').load();" />
</Listeners>
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="btn_add" runat="server" Icon="Add" Text="新增">
<Listeners>
<Click Handler="App.store_role.insert(0,{rolename:'新角色'});App.btn_ save.enable();"></Click>
</Listeners>
</ext:Button>
<ext:Button runat="server" Text="删除" Icon="Delete" ID="btn_del">
<Listeners>
<Click Handler="var selection = #{RowSelectionModel}.getSelection();
if (selection) {
#{gp_role}.store.remove(selection);
};App.btn_save.enable();" />
</Listeners>
</ext:Button>
<ext:Button ID="btn_save" runat="server" Icon="Disk" Text="确定" Disabled="True">

</ext:Button>

</Items>
</ext:Toolbar>
</TopBar>
<Store>
<ext:Store runat="server" ID="store_role" AutoLoad="false">
<Proxy>
<ext:AjaxProxy Url="~/admin/pages/role_menu_handler1.ashx">
<ActionMethods Read="GET"></ActionMethods>
<Reader>
<ext:JsonReader Root="data" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="id">
<Fields>
<ext:ModelField runat="server" Name="id">
</ext:ModelField>
<ext:ModelField runat="server" Name="roleid"></ext:ModelField>
<ext:ModelField runat="server" Name="menuid"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Bin>
<ext:TreeStore runat="server" ID="store_menu">
<Listeners>
<Load Handler="App.store_role.load();" />
</Listeners>
<Proxy>
<ext:AjaxProxy Url="../handlers/Handler_menu11.ashx">
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model ID="Model3" runat="server" IDProperty="id">
<Fields>
<ext:ModelField runat="server" Name="id"></ext:ModelField>
<ext:ModelField runat="server" Name="name"></ext:ModelField>

</Fields>
</ext:Model>
</Model>
</ext:TreeStore>
</Bin>


<ColumnModel>
<Columns>
<ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" />
<ext:Column ID="Column1" runat="server" DataIndex="id" Text="编号"></ext:Column>
<ext:Column ID="Column2" runat="server" Text="角色" DataIndex="roleid" Flex="1">
<Renderer Fn="roleRenderer" />

<Editor>
<ext:SelectBox runat="server" ID="cb_role" DisplayField="rolename" ValueField="id">
<Store>
<ext:Store runat="server" ID="store_role1">
<Model>
<ext:Model ID="Model2" runat="server">
<Fields>
<ext:ModelField runat="server" Name="id"></ext:ModelField>
<ext:ModelField runat="server" Name="rolename"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:SelectBox>
</Editor>
<EditorOptions>
<Listeners>
<StartEdit Fn="fn1" Delay="1" />
</Listeners>
</EditorOptions>
</ext:Column>
<ext:Column ID="col_menu" runat="server" DataIndex="menuid" Flex="1" Text="菜单">
<Renderer Fn="menuRenderer"></Renderer>
<Editor>
<ext:DropDownField runat="server" Editable="False" ID="ddf_menu" Mode="ValueText" TriggerIcon="SimpleArrowDown">
<Component>
<ext:TreePanel ID="TreePanel1" runat="server" RootVisible="false" Animate="true" AutoScroll="true" StoreID="store_menu">

<ColumnModel>
<Columns>
<ext:TreeColumn ID="TreeColumn1" runat="server" Text="名称" DataIndex="name" Flex="1">
</ext:TreeColumn>
</Columns>
</ColumnModel>
<DirectEvents>
<ItemDblClick OnEvent="NodeDbClick">
<ExtraParams>
<ext:Parameter runat="server" Name="id" Value="record.data.id" Mode="Raw" />
<ext:Parameter runat="server" Name="name" Value="record.data.name" Mode="Raw" />
<ext:Parameter runat="server" Name="leaf" Value="record.data.leaf" Mode="Raw" />
</ExtraParams>
</ItemDblClick>
</DirectEvents>
</ext:TreePanel>

</Component>
</ext:DropDownField>


</Editor>
<EditorOptions>
<Listeners>
<StartEdit Fn="fn2" Delay="1" />
</Listeners>
</EditorOptions>
</ext:Column>

</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1" runat="server">
</ext:PagingToolbar>
</BottomBar>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
</Plugins>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel" Mode="Multi" runat="server" />
</SelectionModel>

</ext:GridPanel>
</form>
</body>
</html>




using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;

namespace extdemo.admin.pages
{
public partial class role1
{


public int id { get; set; }
public string rolename { get; set; }
public string info { get; set; }

}
public partial class rolemenu1
{
public int id { get; set; }
public int roleid { get; set; }
public int menuid { get; set; }

}
public partial class role_menu1 : System.Web.UI.Page
{

protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
store_role1.DataSource = new role1[]
{
new role1() {id = 1, rolename = "role1", info = "role1"},
new role1() {id = 2, rolename = "role2", info = "role2"},
new role1() {id = 3, rolename = "role3", info = "role3"},
new role1() {id = 4, rolename = "role4", info = "role4"},
};
store_role1.DataBind();

}
}


protected void NodeDbClick(object sender, DirectEventArgs e)
{
string id = e.ExtraParams["id"];
string text = e.ExtraParams["name"];
string leaf = e.ExtraParams["leaf"];
if (leaf == "true")
{
ddf_menu.SetValue(id, text);
}
}
}
}




using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Ext.Net;

namespace extdemo.admin.pages
{
/// <summary>
/// role_menu_handler1 的摘要说明
/// </summary>
public class role_menu_handler1 : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "application/json";
var requestParams = new StoreRequestParameters(context);
int start = requestParams.Start;
int limit = requestParams.Limit;
int count;
var data = PageRoleList(0, 3, out count);
var datas = new Paging<object>(data, count);
context.Response.Write(JSON.Serialize(datas));
}

public class rolemenu
{
public int id { get; set; }
public int roleid { get; set; }
public int menuid { get; set; }
}

public List<rolemenu> PageRoleList(int start, int limit, out int count)
{
int totalRecords = 3;
count = totalRecords;
var ll = new List<rolemenu>
{
new rolemenu{ id = 1,roleid=1,menuid=1},
new rolemenu{ id = 2,roleid=2,menuid=2},
new rolemenu{ id = 3,roleid=3,menuid=3},
};

return ll;
}

public bool IsReusable
{
get
{
return false;
}
}
}
}



using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;

namespace extdemo.admin.handlers
{
/// <summary>
/// Handler_menu11 的摘要说明
/// </summary>
public class Handler_menu11 : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/json";
string str =
"[{'id':'1','name':'客户关系系统','pid':'0','url':'','expa nded': true,children:[{'id':'2','name':'客户管理','pid':'1','url':'pages/customer1.aspx','leaf':true},{'id':'7','name':'客户回 收站','pid':'1','url':'pages/customer_hsz.aspx','leaf':true}]},{'id':'11','name':'用户管理','pid':'0','url':'','exp anded': true,children:[{'id':'12','name':'修改密码','pid':'11','url':'pages/passreset.aspx','leaf':true}]},{'id':'13','name':'权限管理','pid':'0','url':'','exp anded': true,children:[{'id':'14','name':'角色菜单分配','pid':'13','url':'pages/role_menu.aspx','leaf':true},{'id':'15','name':'用户 角色分配','pid':'13','url':'pages/user_role.aspx','leaf':true},{'id':'16','name':'角色 管理','pid':'13','url':'pages/role1.aspx','leaf':true},{'id':'17','name':'菜单管理', 'pid':'13','url':'pages/menu1.aspx','leaf':true}]},{'id':'24','name':'新菜单','pid':'0','url':'33333', 'leaf':true}]";

context.Response.Write(str);
context.Response.End();
}





public bool IsReusable
{
get
{
return false;
}
}
}
}

Daniil
Aug 14, 2013, 6:45 PM
Hi @hdsoso,

I think you should use a DropDownField's SyncValue. An example is here:
http://examples2.ext.net/#/Form/DropDownField/ValueText_Mode/

In your case I can suggest to try something like this.

<ext:DropDownField>
<SyncValue Fn="syncValue" />
</ext:DropDownField>

var syncValue = function (value, text) {
var me = this,
r = App.store_menu.getNodeById(value),
text,
originalSyncValue = me.syncValue;

if (r) {
text = r.data.name;
} else {
text = value;
}

me.syncValue = Ext.emptyFn;
me.setValue(value, text);
me.syncValue = originalSyncValue;
};