FineUI表格、窗体、按钮组及事件

最新推荐文章于 2023-03-30 16:13:09 发布

转载最新推荐文章于 2023-03-30 16:13:09 发布 · 819 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lcidy/p/8952916.html

文章标签：

#ui

本文介绍了一个使用表格展示数据并实现按钮触发窗体显示的示例，演示了如何通过鼠标事件、按钮点击事件来操作窗体及传递参数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//表格

@(F.Grid().IsFluid(true).CssClass("blockpanel").Title("表格").ShowHeader(true).ShowBorder(true).ID("Grid1").DataIDField("Id").DataTextField("Name")
          .Columns(
                        F.RowNumberField(),
                        F.RenderField().HeaderText("姓名").DataField("Name").Width(100),
                        F.RenderField().HeaderText("性别").DataField("Gender").FieldType(FieldType.Int).RendererFunction("renderGender").Width(80),
                        F.RenderField().HeaderText("入学年份").DataField("EntranceYear").FieldType(FieldType.Int).Width(100),
                        F.RenderCheckField().HeaderText("是否在校").DataField("AtSchool").RenderAsStaticField(true).Width(100),
                        F.RenderField().HeaderText("所学专业").DataField("Major").RendererFunction("renderMajor").ExpandUnusedSpace(true),
                        F.RenderField().HeaderText("分组").DataField("Group").RendererFunction("renderGroup").Width(80),
                       F.RenderField().HeaderText("注册日期").DataField("LogTime").FieldType(FieldType.Date).Renderer(Renderer.Date).RendererArgument("yyyy-MM-dd").Width(100)
                         )
                  .DataSource(DataSourceUtil.GetDataTable())  //绑定数据来源
       )

//按钮组

@(F.Menu().ID("ChangeFlightContextMenu") 
       .Items(
               F.MenuButton().ID("ChangeFlightBtn").Text("按钮1").Icon(Icon.Find).Listener("click","selectChangeFlight"),
               F.MenuButton().ID("CTOTCoordinateBtn").Text("按钮2").Icon(Icon.ArrowEw).Listener("click", "FlightCTOTCoordinate"),
               F.MenuButton().ID("FlightDetailBtn").Text("按钮3").Icon(Icon.Magnifier).Listener("click", "SelectFlightInfo")
                  )
        )

//窗体

@(F.Window().ID("Window1").Title("编辑").EnableIFrame(true).EnableMaximize(true).EnableResize(true).Target(Target.Parent).OnClose(Url.Action("Window1_Close")).IsModal(true).Width(550).Height(350).Hidden(true))

1，鼠标右击事件 .Listener("beforerowcontextmenu","onRowChangeFlightContextMenu") //右击时间是beforerowcontextmenu

鼠标右击事件函数

function onRowChangeFlightContextMenu() {
F.ui.ChangeFlightContextMenu.show();
return false; //禁止右击默认时间
}

2，按钮单击事件 .Listener("click", "函数名SelectFlightInfo") //单击事件是click

行单击事件 .Listener("rowclick","SelectFlightInfo") //行单击事件

行双击事件 .Listener("rowdblclick","SelectFlightInfo") //行双击事件

单击事件函数往后台传参

function selectChangeFlight() {
var Id = F.ui.Grid1.getSelectedRow(); //获取鼠标选中行Id
var iframeWindowUrl = '@Url.Content("/控制器名/方法名")';
F.ui.Window1.show(iframeWindowUrl + '?id=' + Id + '&type=值');
}

id与=之间不允许有空格，同理type和=之间也不允许有空格

3，单击按钮窗体显示 .Listener("click", "F.ui.Window1.show()")

4，自定义回发参数（改变Config的值）

F.TextBox().ID("OperateTime").Text("Configs.GetValue("OperateTime")").OnClick(Url.Action("TextChange"),new Parameter("val", "F.ui.OperateTime.getValue()"),

new Parameter("key", "F.ui.OperateTime.id"))

　　　后台方法

public ActionResult TextChange（string val,string key）

{

Configs.setValue(key,val);

return UIHelper.Result;

}

转载于:https://www.cnblogs.com/lcidy/p/8952916.html