JQGrid搜索等功能的配置Word文件下载.docx

JQGrid搜索等功能的配置Word文件下载.docx

《JQGrid搜索等功能的配置Word文件下载.docx》由会员分享，可在线阅读，更多相关《JQGrid搜索等功能的配置Word文件下载.docx（27页珍藏版）》请在冰点文库上搜索。

['

equal'

'

notequal'

less'

lessorequal'

'

greater'

greaterorequal'

beginswith'

doesnotbeginwith'

isin'

isnotin'

endswith'

doesnotendwith'

contains'

doesnotcontain'

],

groupOps:

[{op:

AND"

text:

all"

},{op:

OR"

any"

}],

matchText:

match"

rulesText:

rules"

},

colModelOptions

Asof3.5releasejqGridusesacommonsearchoptionsthatcanbeusedoneverysearchmethod.BelowisalistoftheseoptionsthatshouldbesetincolModel.Notethatsomeoptionsarenotapplicableforparticularmethod.

Option

Type

Desscription

Default

search

boolean

Determinesifthefieldcanbesearched.

true

stype

string

Determinesthesearchtypeofthefield.Canbetext-alsoainputelementwithtypetextiscreatedandselect-aselectelementiscreated

text

searchoptions

object

Objectwhichcontaindefinition,eventsandotherpropertiesforthesearchedfield.Seebelow

Thesearchoptionsobjecthavethefollowingproperties:

Thesearchoptionsarenotapplicabletocustomsearchmethod.Thismethodusesseparateoptions.

Property

Description

dataUrl

Thisoptionisvalidonlyfortheelementsoftypeselect-i.estype:

'

select'

.Theoptionrepresenttheurlfromwhereweloadtheselectelement.Whenthisoptionissettheelementwillbefilledwithvaluesfromtheajaxrequest.Thedatashouldbeavalidhtmlselectelementwiththedesiredoptions.Byexampletherequestshouldcontain<

select>

<

optionvalue=“1”>

One<

/option>

<

optionvalue=“2”>

Two<

/select>

.Thisiscalledonlyonce.

buildSelect

function

ThisoptionhavesenseonlyifthedataUrlparameterisset.Incasewheretheserverresponsecannotbuildtheselectelementyoucanuseyouronfunctiontobuildtheselect.Thefunctionshouldreturnastringcontainingtheselectandoptionsvalue（s）asdescribedindataUrloption.Parameterpassedtothisfunctionistheserverresponse

dataInit

Ifsetthisfunctioniscalledonlyoncewhentheelementiscreated.Tothisfunctionwepasstheelementobject.

dataInit:

function（elem）{

dosomething

}

Alsousethisfunctiontoattachdatepicker,timepickerandetc.Example:

dataInit:

function（elem）{

$（elem）.datepicker（）;

}

dataEvents

array

Listofeventstoapplytothedataelement;

uses$（”#id”）.bind（type,[data],fn）tobindeventstodataelement.Shouldbedescribedlikethis:

dataEvents:

[

{type:

'

click'

data:

{i:

7},fn:

function（e）{console.log（e.data.i）;

}},

keypress'

fn:

function（e）{console.log（'

）;

}}

]

attr

attrisobjectwherewecansetvalidattributestothecreatedelement.Byexample:

attr:

{title:

“Sometitle”}

Willsetatitleofthesearchedelement

searchhidden

Bydefaulthiddenelemntsinthegridarenotsearchable.Inordertoenablesearchingwhenthefieldishiddensetthisoptiontotrue

sopt

Thisoptionisusedonlyinadvancedsinglefieldsearchinganddeterminestheoperationthatisappliedtotheelement.Ifnotsetalltheavailableoptionswillbeused.Allavailableoptionare:

['

eq'

ne'

lt'

le'

gt'

ge'

bw'

bn'

in'

ni'

ew'

en'

cn'

nc'

]

Thecorrespondingtextsareinlanguagefileandmeanthefollowing:

Notethattheelementsinsoptarraycanbemixedinanyorder.

defaultValue

Ifnotemptysetadefaultvalueinthesearchinputelement.

value

mixed

Theoptionisusedonlyforstypeselectanddefinestheselectoptionsinthesearchdialogs.WhensetforstypeselectanddataUrloptionisnotset,thevaluecanbeastringorobject.

Iftheoptionisastringitmustcontainasetofvalue:

labelpairswiththevalueseparatedfromthelabelwithacolon（:

）andendedwith（;

）.Thestringshouldnotendedwitha（;

）-editoptions:

{value:

“1:

One;

2:

Two”}.Ifsetasobjectitshouldbedefinedaspairname:

value-editoptions:

{1:

One'

;

Two'

}}

Note:

whenthedataUrlinsearchoptionsobjectisnotusedforthesearchtypeselect,thedefinitionsfortheselectaretakenfirstfromsearchoptionsvaluepropertyandifthisisnotdefinedaeditoptionsvaluepropertyisused-i.eeditoptions:

one;

two”,…}.Seebelowhowtousetheseoptionsindifferentsearchmethods.

colModelconventions:

script>

jQuery（"

#grid_id"

）.jqGrid（{

colModel:

...

{name:

price'

index:

width:

60,search:

true,stype:

text'

searchoptions:

{dataInit:

datePick,attr:

{title:

SelectDate'

}}},

...

]

}）;

datePick=function（elem）

{

jQuery（elem）.datepicker（）;

/script>

Whatyouneedtoknow

Allsearchmodulesusestheurlparameteringridtoperformthesearch.Insomemethodsthereisadditionalseparateoptionfortheurlwhichcanbeusedtoo.

WhenthesearchisperformedthepostDataarrayisfilledwiththeneededdataforthesearch.

Theparametersearchingridoptionsissettotrueinordertoindicatethesearching.Serversidethenameofthisis_search（notethedifference）whichcanbeobtainedusingtheGETorPOSTdataarray.

WhenthegridistriggeredwhenusingtherefreshbuttoninNavigatorthesearchoptionissettofalse.

EverysearchmethodcreatesitsownmethodtoclearthesearcheddatafrompostDataarray.Usethesemethodstodothis.

ToolbarSearching

Thismethodconstructsearchingcreatinginputelementsjustbelowtheheaderelementsofthegrid.Whentheheaderelementsareresizedtheinputsearchelementsarealsoresizedaccordingtothenewwidth.

Themethodusestheurloptioningridtoperformasearchtotheserver.

Whenthesearchisactivated,anarrayoftypename:

valueispostedtotheserver.NotethatthisarrayisaddedtothepostDataparameter.Wepostonlyfieldsthathaveanenteredvalue.Whenweclearthethesearchform,thevaluesaredeletedfromthepostDataarray.Whenpostingtotheserver,wetrytopass,notthename,buttheindexsetincolModel.Whentheindexisnotfoundweusethename.Additionally,weadda_search=truetotheposteddata.

Installation

InordertousethismethodaCustommoduleshouldbecheckedwhenyoudownloadthegrid.FormoreinformationrefertoDownload

CallingConvetion

）.filterToolbar（options）;

orusingthenewAPI

）.jqGrid（'

filterToolbar'

options）;

Where:

grid_idistheidofalreadyconstructedgrid

optionsisaobjectcontainingdifferentconfigurationsetting.Seebelow

Thiscommandwillcreateasearchelementssomethinglikethis:

ThismethodusesthedefinitionsforsearchingfromcolModel.SeeConfiguration

TheoptionsinfilterToolbarmethodare

type

autosearch

Searchisperformedaccordingtothefollowingrules:

fortextelementwhenaEnterkeyispressedwhileinputtingvaluesandsearchisperformed.Forselectelementwhenthevaluechanges.Thesearchparameteringridissettotrueandajaxcallismade.

beforeSearch

eventwhichfiresbeforeasearch.Itiscalledbeforetriggeringthegrid.Iftheeventreturntruetriggeringdoesnotoccur.Inthiscaseyoucanconstructyourownsearchparametersandtriggerthegridtosearchthedata.Anyotherreturnvaluecausestriggering.

null

afterSearch

eventwhichfiresafterasearch

beforeClear

eventwhichfiresbeforeclearingenteredvalues（i.e.,clearToolbarisactivated）.Itiscalledbeforeclearingthedatafromsearchelements.Iftheeventreturntruetriggeringdoesnotoccur.Inthiscaseyoucanconstructyourownsearchparametersandtriggerthegrid.Anyotherreturnvaluecausestriggering.

afterClear

eventwhichfiresafterclearingenteredvalues（i.e.,clearToolbaractivated）

Thesoptoptioninsearchoptionsdoesnothaveefectinthismethod.

WhenwecreatetoolbarsearchwithfilterToolbarwecreateadditionalmethodsasfollow

Method

triggerToolbar

Whenthismethodiscalledasearchisperformed,thesearchparameteringridbecomestrueandajaxcallismadetotheserver

clearToolbar

Whencalledclearthesearchvaluessendarequestwithsearchoptionsettofalseandsetthedefaultoneifavailable

toggleToolbar

Toggelesthetoolbarwiththesearchelements

Usingtheadditionalmethods

Themethodslistedaboveshouldbeusedthisway:

varsgrid=$（"

）[0];

sgrid.triggerToolbar（）;

CustomSearching

Thismethodcanbecalledtoconstructancustomsearchformforthegrid.

Themethodusesthe