Ext.Net Link Button on Client Side

Question

I have created window on sever side with LinkButton on bottom

  <ext:Window runat="server" ID="winIndex" Title="Test">
        <AutoLoad Url="index.html" Mode="IFrame" />
        <Buttons>
            <ext:LinkButton runat="server" ID="btn" Text="Test Button">
                <Listeners>
                    <Click Handler="Ext.msg.alert('Alert','test');" />
                </Listeners>
            </ext:LinkButton>
        </Buttons>
    </ext:Window>

i wanted to create this window on client side using javascript this is what i tried

var CreateWindow = function () {
            var windowConfig = {
                id: "winIndex",
                hidden: false,
                closeAction: "hide",
                title: "Test",
                buttons: [
                    {
                        id: "btn",
                        text: "Test Button",
                        listeners:
                            {
                                click:
                                {
                                    fn: function (el, e) {
                                        Ext.msg.alert('Alert','test');
                                    }
                                }
                            }
                    }
                ],
                autoLoad: {
                    url: "index.html",
                    nocache: true,
                    mode: "iframe",
                    showMask: true,
                    triggerEvent: "show",
                    reloadOnEvent: true
                }
            }
            new Ext.Window(windowConfig)
        }

Window rendered perfectly using javascript too except LinkButton. it draws normal button rather than LinkButton but i need link button just like server side ext control. Any help will be appreciated.

Answer 1

From your code snippet I am assuming you are referring to Ext.NET 1.x and Ext JS 3.x.

If so, by default, when using the buttons configuration option for a new Ext.Window, the default component used will be Ext.Button s.

LinkButtons are a useful extension from Ext.NET, and they have their xtype as netlinkbutton so you would have to explicitly set that, for example:

new Ext.Window({
    title: "Test",
    height: 300,
    width: 300,
    buttons: [{
        id: "btn",
        xtype: 'netlinkbutton',
        text: "Test Button",
        listeners: {
            click: {
                fn: function (el, e) {
                    Ext.Msg.alert('Alert', 'test');
                }
            }
        }
    }]
}).show();

Notice the key thing is xtype: netlinkbutton

Hope that helps!

PS Note that in Ext.NET 3, the LinkButton is renamed to HyperLinkButton and its xtype is now nethyperlinkbutton .

Answer 2

use netlinkbutton as xtype in ExtJs. netlinkbutton is exactly what LinkButton is in Ext.net