search

extnet / Ext.NET

35 stars 41 forks source link

absent: ext-action and ext-actionref components #1791

Closed fabriciomurta closed 4 years ago

fabriciomurta commented 4 years ago

Found: Ext.NET 7.0.0-preview4_2020-07-13.

The ext-action and ext-actionref tags does not exist in Ext.NET 7, so there's no way to use the feature.

While ext-action refers to an actual Ext JS class, the ext-actionref one is a helper to allow referencing actions defined throughout a web page.

Sencha documentation: Ext.Action - Ext JS 7.2.0 docs

WebForms examples matching ActionRef

  1. Action > Basic > Grid
  2. Action > Basic > Simple
  3. TreePanel > Advanced > Remote_Mode
  4. TreePanel > Advanced > Remote_Mode_with_Service
AndreyChechel commented 4 years ago

Fixed in 7.0.0. The following sample demonstrates how the implemented ext-action and ext-actionRef can be used.

@page  "{handler?}"
@model GridModel

@{
    ViewData["Title"] = "Test page";
    Layout = null;
}

<!DOCTYPE html>
<html>

<head>
    <title>GridPanel and Store - Ext.NET Examples</title>
    <link href="/css/site.css" rel="stylesheet" />

    <script>
        var template = '<span style="color:{0};">{1}</span>';

        var change = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value);
        };

        var pctChange = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
        };
    </script>
</head>

<body>
    <div>

        <ext-action id="SellAction"
                    Text="Sell stock"
                    Disabled="false"
                    Handler="var rec = App.gp1.getSelectionModel().getSelection()[0]; if (rec) { Ext.Msg.alert('Sell', 'Sell ' + rec.get('company')); }" />

        <ext-action ID="BuyAction"
                    Text="Buy stock"
                    Disabled="false"
                    Handler="var rec = App.gp1.getSelectionModel().getSelection()[0]; if (rec) { Ext.Msg.alert('Buy', 'Buy ' + rec.get('company')); }" />

        <ext-menu ID="ContextMenu" runat="server">
            <items>
                <ext-actionRef runat="server" action="BuyAction" />
                <ext-actionRef runat="server" action="SellAction" />
            </items>
        </ext-menu>

        <ext-store data="Model.GridData" storeId="companyStore2">
            <fields>
                <ext-dataField name="company" />
                <ext-numberDataField name="price" />
                <ext-numberDataField name="change" />
                <ext-numberDataField name="pctChange" />
                <ext-dateDataField name="lastChange" dateFormat="M/d HH:mmtt" />
            </fields>
        </ext-store>

        <ext-gridPanel id="gp1"
                       title="Array Grid"
                       width="700"
                       height="350"
                       frame="true"
                       store="companyStore2" contextMenuId="ContextMenu">
            <columns>
                <ext-column text="Company" dataIndex="company" flex="1" />
                <ext-column text="Price" dataIndex="price" renderer="Ext.util.Format.usMoney" />
                <ext-column text="Change" dataIndex="change" renderer="change" />
                <ext-column text="Change %" dataIndex="pctChange" renderer="pctChange" />
                <ext-dateColumn text="Last Updated" dataIndex="lastChange" width="120" format="yyyy-MM-dd" />
            </columns>
            <selModel>
                <ext-rowSelectionModel runat="server">
                </ext-rowSelectionModel>
            </selModel>
            <dockedItems>
                <ext-toolbar>
                    <Items>
                        <ext-actionRef action="SellAction" />
                        <ext-actionRef action="BuyAction" />
                    </Items>
                </ext-toolbar>
            </dockedItems>
        </ext-gridPanel>

    </div>
</body>
</html>
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Ext.Net;

namespace sandbox.slim.Pages
{
    public class GridModel : PageModel
    {
        public List<object> GridData { get; set; }

        public void OnGet()
        {
            GridData = new List<object>
            {
                new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
            };
        }
    }
}