Asp.net-fineui Development Practice-12

Source: Internet
Author: User

1. I found the example of line merging on the net, ExtJS wrote, I moved it to change the next, Fineui can also be used, is only to see, select and edit row extension column did not test, put out everyone look at the use of it.

    <script> F.ready (function () {//method span parameter (grid instance, row number, column number, combined state, combined quantity) var span = Funct Ion (grid, row, col, type, num) {//This is a column-hiding mechanism that finds columns that hide the effect of merging will be misplaced var hiddens = [], columns = GRI                D.columns;                var B = true; Ext.Array.each (columns, function (column, index) {if (Column.ishidden ()) {///IF  The column you want to hide hides the if (col = = index + 1) {//Merge cells do not take effect b                        = false;                }                    }                });                            if (b) {switch (type) {//type, line case ' row ': GetNode Find the node row is to find the line, query, with jquery Search all lines of TD, you can see the grid actually use table to spell TDS = Ext.get (grid                            . View.getnode (Row)). Query (' TD '); Locate the column by column number, edit the attribute rowspan=num merge number Ext.Get (Tds[col]). Set ({rowspan:num});                            Add the vertical center attribute, of course you can write Ext.get (Ext.get (Tds[col)). SetStyle ({' vertical-align ': ' Middle '});                                Loop the covered cell, destroy throw away for (i = row + 1; i < row + num; i++) {                            Ext.get (Ext.get (Grid.view.getNode (i)). Query (' TD ') [COL]). Destroy ();                        } break; Case ' col '://merge columns, as in line, did not try to write their own TDS = Ext.get (Grid.view.lockedView.                            GetNode (Row)). Query (' TD ');                            Ext.get (Tds[col]). Set ({colspan:num});                    Break            }                }            };            To perform the merge method, note the parameter span (F (' <% =grid1.clientid%> '), 2, 2, ' Row ', 3); Merge rows are executed when columns are hidden and displayed, otherwise the F (' <% =grid1.clientid%> ') will be misplaced. On (' Columnhide ', function () {sPan (F (' <% =grid1.clientid%> '), 2, 2, ' Row ', 3);            });                F (' <% =grid1.clientid%> '). On (' Columnshow ', function () {var Grid = F (' <% =grid1.clientid%> ');            Span (grid, 2, 2, ' Row ', 3);        });    }); </script>

Get this under the grid and see if you need to send an example.

2. Add a filter control on the column header, of course, you can add another

Query can be used, interested can write their own, or the method, in fact, referred to many times before, is added a property, and then No.

I added two properties, filter and FilterName to the source GridCloumn.cs, record what is displayed and turn on the display control

        private bool _filter = false;        <summary>        ///Enable filter function        ///</summary> [Category (categoryname.options)]        [ DefaultValue (True)]        [Description ("Enable filtering")] public        virtual BOOL filter        {            get            {                Return _ _ filter;            }            Set            {                _filter = value;            }        }        private string _filtername = "";        <summary>        ///Filter column        ///</summary> [Category (categoryname.options)]        [ DefaultValue (True)]        [Description ("Filter column")] public        virtual string filtername        {            get            {                return _filtername;            }            Set            {                _filtername = value;            }        }

This one will understand, and then I'll use these two attributes,

     <f:boundfield width= "100px" filter= "true" Filtername= ' Panelgrid1_textname ' columnid= "name"                datafield= "name" Dataformatstring= "{0}" headertext= "name"/>

Note filtername parameters, CNC parts of the ClientID, this I would like to use the ASP, not successful, can only be handwritten. Panelgrid1_textname is a text control, and I've also written an event to edit the postback filter refresh table. Property Plus is the implementation, of course, the Onfirstprerender method, drawing events, plus this sentence can be, you can see is added a property items is which control, of course, is panelgrid1_textname. The last true is the original format output meaning, if you want to add more than one control this items should be a number of groups, this has not been tried. It's even a success. 3. Add a sidebar to the grid, now there is the bottom of the Bar,extjs called Bbar, in fact, there are Tbar and Rbar Lbar, add a rbar, you can refer to their add, feel no big use. or change the source, this change is Grid.cs file, first find Pageitems,pageitems is bbar that I write a pageritems, is to stick, change a name. The next step is to find the Onfirstprerender method, to Riga,
            if (Pageritems.count > 0) {optionbuilder rbuilder = new Optionbuilder ();                Rbuilder.addproperty ("DisplayInfo", true);                Rbuilder.addproperty ("Store", Render_gridstoreid, True);                Jsarraybuilder ab = new Jsarraybuilder (); foreach (Controlbase item in Pageritems) {if (item. Visible) {ab. AddProperty (String.Format ("{0}", item.                    XID), true);  }}//cls: ' X-toolbar-paging ', Rbuilder.addproperty ("CLS", "' x-toolbar-paging                X-docked-bottom x-toolbar-docked-bottom x-toolbar-docked-bottom ' ", true); Rbuilder.addproperty ("Items", AB.                ToString (), true);                Rbarscript = String.Format ("var {0}=ext.create (' Ext.ux.SimplePagingToolbar ', {1});", Render_rbarid, Rbuilder); Ob.            AddProperty ("Rbar", Rbuilder, True); }

Here is the use of the array, you can study how to spell, and finally add to the Rbar, items are pageritems in the item. To the front desk if there is no problem can see Pageritems and Pageitems Horizontal can write events or something, he himself on the vertical row

Asp.net-fineui Development Practice-12

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.