Hi I am trying to create custom widgets for my project, including program name and program type in widget. For field type I have used CJuiAutoComplete here my code is!
$ this-> Widgets ('zii.widgets.grid.CgrridView', array ('data provider' =>> $ this-> product order, 'id' = & gt; gridview_add_product ',' column '= & gt; array (array ('Header' = & gt; 'URL', 'value' = & gt; 'CHtml :: textfield ("program [$ data-> id] [url]", $ data-> url, array (\ 'Id \' = & gt; \ 'program_url _' '$ data-> ID,))'), array ('header' = & gt; 'type', 'value' = & gt; 'Yii :: app () - & gt; Controller- & gt; Widget ("zii.widgets.jui.CJuiAutoComplete", array ("name" => gt; "type", "attribute" => gt; resolution "," Source "= & gt; array (" A "," B "," C "," D "," E ")," value "=> $ data-> type,)) ' Type '= & gt;' raw ',' headerHalmoption '=> AR Ray (' style '=' gtc: 'width: 100px'), array), array ('class' = & gt;' cbttoncolom ',' Header ('label' = & gt; array '(' style '= & gt;' width: 100px '),' button '=> array (' linkToModel '= & gt; array (' label '= & gt; remove' , 'Click' = & gt; "function () {removeStreamRow ($ (this))}}",),),)))),),)); Now there is the Add button that dynamically adds the new line (name field, type 'autocomplete' and remove button) to CGridView. My JS script is below
var addProductRow = function () {$ ('# gridview_product .empty'). mother-father (). Remove (); $ ('# Gridview_product tr: last'). After (& lt; tr class = "odd"> & lt; td & gt; Input Name = "Type" id = "Product_ '+ Next Id +' _type "Class =" Ui-autocomplete-input "autocomplete =" off "type =" text "& gt; & lt; span class =" ui-helper-hidden-accessible "role =" status "aria-live =" polite " & Gt; & lt; / span & gt; & lt; / td & gt; & lt; td class = "button-column" & gt; class = "linkmodel" title = "remove" href = "# product_url _ '+ Next ID +' "& gt; Remove & lt; / a & gt; & lt; / td> & lt; / tr & gt;); NextId--;} Now when I dynamically add a new line through JS, the field does not show full functionality for "Type"
After adding HTML blocks to Gridview, you need to bind the input field with auto integer such as Events
$ (".ui-autocomplete-input"). Autocomplete ({source: function (request, response) {// you source}});