X-Editable - Create Record

Hello, implementing the x-editable extension, to create an record online, I have a little problem, i dont know where should I place these codes (Save button click,Reset button click and [color=#333333]php code), [/color][font="Helvetica Neue, Helvetica, Arial, sans-serif"][color="#333333"][size=4]I highlight below[/size][/color][/font].

fuente web : vitalets.github.io/x-editable/docs.html#newrecord

============================================================

[b]

[/b]

View Create:

[size=2]

[/size]

[size=2]$model= new Perfiles;[/size]

[size=2] $this->widget(‘editable.EditableDetailView’, array([/size]

'data'       => $model,

[size=2] //you can define any default params for child EditableFields [/size]

'url'        => $this->createUrl('Perfiles/updateUser'), //common submit url for all fields


'params'     => array('YII_CSRF_TOKEN' => Yii::app()->request->csrfToken), //params for all fields


'emptytext'  => 'Sin valor',


'apply' => true, //you can turn off applying editable to all attributes

[size=2] [/size][size=2]‘placement’ => ‘right’,[/size]

'attributes' => array(


    array(


        'name' => 'perfilesId',


        'editable' => array(


            'type'       => 'text',


            'inputclass' => 'input-large',


            'emptytext'  => 'special emptytext',                


            'validate'   => 'function(value) {


                if(!value) return "User Name is required (client side)"


            }'


        )


    ),


    array(


        'name' => 'nombre',


        'editable' => array(


            'type'       => 'text',


            'inputclass' => 'input-large',


            'emptytext'  => 'special emptytext',                


            'validate'   => 'function(value) {


                if(!value) return "User Name is required (client side)"


            }'


        )


    ),   


    array(


        'name' => 'descripcion',


        'editable' => array(


            'type'       => 'text',


            'inputclass' => 'input-large',


            'emptytext'  => 'special emptytext',                


            'validate'   => 'function(value) {


                if(!value) return "User Name is required (client side)"


            }'


        )


    ), 


    array( //select loaded from ajax.


        'name' => 'activo',


        'editable' => array(


            'type'   => 'select',


            'title'=>'Estado del Usuario',


            'source' => 	array('0'=>'Inactivo','1'=>'Activo'), 


        )


    ),                      


)


));

[size=2]?>[/size]

</div><br>

<div class="editable-buttons">

&lt;?php


&#036;this-&gt;widget('bootstrap.widgets.TbButton', array(


	'label'=&gt;'Guardar Nuevo',


	'htmlOptions'=&gt;array(


		'class'=&gt;'btn btn-primary',


		'onclick'=&gt;'js: 

[size=2] [/size][size=2]’)[/size]

[size=2] [/size][size=2]));[/size]

[size=2] [/size][size=2]?>[/size]

&lt;button id=&quot;reset-btn&quot; class=&quot;btn&quot;&gt;cancel&lt;/button&gt;

</div>

<div class="editable-error-block"></div>

</form>

=============================================================

Save button click [color="#ff00ff"] ?????????? Where?[/color]

  • [color=#48484C]$[/color]color=#93A1A1.[/color][color=#48484C]click[/color][color=#93A1A1]([/color][color=#1E347B]function[/color]color=#93A1A1[/color][color=#48484C] [/color][color=#93A1A1]{[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]editable[/color][color=#93A1A1]([/color][color=#DD1144]‘submit’[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#93A1A1]{[/color][color=#48484C] [/color]
  • [color=#48484C] url[/color][color=#93A1A1]:[/color][color=#48484C] [/color][color=#DD1144]’/newuser’[/color][color=#93A1A1],[/color][color=#48484C] [/color]
  • [color=#48484C] ajaxOptions[/color][color=#93A1A1]:[/color][color=#48484C] [/color][color=#93A1A1]{[/color]
  • [color=#48484C] dataType[/color][color=#93A1A1]:[/color][color=#48484C] [/color][color=#DD1144]‘json’[/color][color=#48484C] [/color][color=#93A1A1]//assuming json response[/color]
  • [color=#48484C] [/color][color=#93A1A1]},[/color][color=#48484C] [/color]
  • [color=#48484C] success[/color][color=#93A1A1]:[/color][color=#48484C] [/color][color=#1E347B]function[/color][color=#93A1A1]([/color][color=#48484C]data[/color][color=#93A1A1],[/color][color=#48484C] config[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]{[/color]
  • [color=#48484C] [/color][color=#1E347B]if[/color][color=#93A1A1]([/color][color=#48484C]data [/color][color=#93A1A1]&&[/color][color=#48484C] data[/color][color=#93A1A1].[/color][color=#48484C]id[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]{[/color][color=#48484C] [/color][color=#93A1A1]//record created, response like {"id": 2}[/color]
  • [color=#48484C] [/color][color=#93A1A1]//set pk[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]editable[/color][color=#93A1A1]([/color][color=#DD1144]‘option’[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#DD1144]‘pk’[/color][color=#93A1A1],[/color][color=#48484C] data[/color][color=#93A1A1].[/color][color=#48484C]id[/color][color=#93A1A1]);[/color]
  • [color=#48484C] [/color][color=#93A1A1]//remove unsaved class[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]removeClass[/color]color=#93A1A1;[/color]
  • [color=#48484C] [/color][color=#93A1A1]//show messages[/color]
  • [color=#48484C] [/color][color=#1E347B]var[/color][color=#48484C] msg [/color][color=#93A1A1]=[/color][color=#48484C] [/color][color=#DD1144]‘New user created! Now editables submit individually.’[/color][color=#93A1A1];[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]addClass[/color]color=#93A1A1.[/color][color=#48484C]removeClass[/color]color=#93A1A1.[/color][color=#48484C]html[/color]color=#93A1A1.[/color][color=#48484C]show[/color]color=#93A1A1;[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]hide[/color]color=#93A1A1;[/color][color=#48484C] [/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]off[/color]color=#93A1A1;[/color][color=#48484C] [/color]
  • [color=#48484C] [/color][color=#93A1A1]}[/color][color=#48484C] [/color][color=#1E347B]else[/color][color=#48484C] [/color][color=#1E347B]if[/color][color=#93A1A1]([/color][color=#48484C]data [/color][color=#93A1A1]&&[/color][color=#48484C] data[/color][color=#93A1A1].[/color][color=#48484C]errors[/color][color=#93A1A1]){[/color][color=#48484C] [/color]
  • [color=#48484C] [/color][color=#93A1A1]//server-side validation error, response like {"errors": {"username": "username already exist"} }[/color]
  • [color=#48484C] config[/color][color=#93A1A1].[/color][color=#48484C]error[/color][color=#93A1A1].[/color][color=#48484C]call[/color][color=#93A1A1]([/color][color=#1E347B]this[/color][color=#93A1A1],[/color][color=#48484C] data[/color][color=#93A1A1].[/color][color=#48484C]errors[/color][color=#93A1A1]);[/color]
  • [color=#48484C] [/color][color=#93A1A1]}[/color][color=#48484C] [/color]
  • [color=#48484C] [/color][color=#93A1A1]},[/color]
  • [color=#48484C] error[/color][color=#93A1A1]:[/color][color=#48484C] [/color][color=#1E347B]function[/color]color=#93A1A1[/color][color=#48484C] [/color][color=#93A1A1]{[/color]
  • [color=#48484C] [/color][color=#1E347B]var[/color][color=#48484C] msg [/color][color=#93A1A1]=[/color][color=#48484C] [/color][color=#DD1144]’’[/color][color=#93A1A1];[/color]
  • [color=#48484C] [/color][color=#1E347B]if[/color][color=#93A1A1]([/color][color=#48484C]errors [/color][color=#93A1A1]&&[/color][color=#48484C] errors[/color][color=#93A1A1].[/color][color=#48484C]responseText[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]{[/color][color=#48484C] [/color][color=#93A1A1]//ajax error, errors = xhr object[/color]
  • [color=#48484C] msg [/color][color=#93A1A1]=[/color][color=#48484C] errors[/color][color=#93A1A1].[/color][color=#48484C]responseText[/color][color=#93A1A1];[/color]
  • [color=#48484C] [/color][color=#93A1A1]}[/color][color=#48484C] [/color][color=#1E347B]else[/color][color=#48484C] [/color][color=#93A1A1]{[/color][color=#48484C] [/color][color=#93A1A1]//validation error (client-side or server-side)[/color]
  • [color=#48484C] $[/color][color=#93A1A1].[/color][color=#48484C]each[/color][color=#93A1A1]([/color][color=#48484C]errors[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#1E347B]function[/color][color=#93A1A1]([/color][color=#48484C]k[/color][color=#93A1A1],[/color][color=#48484C] v[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]{[/color][color=#48484C] msg [/color][color=#93A1A1]+=[/color][color=#48484C] k[/color][color=#93A1A1]+[/color][color=#DD1144]": "[/color][color=#93A1A1]+[/color][color=#48484C]v[/color][color=#93A1A1]+[/color][color=#DD1144]"<br>"[/color][color=#93A1A1];[/color][color=#48484C] [/color][color=#93A1A1]});[/color]
  • [color=#48484C] [/color][color=#93A1A1]}[/color][color=#48484C] [/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]removeClass[/color]color=#93A1A1.[/color][color=#48484C]addClass[/color]color=#93A1A1.[/color][color=#48484C]html[/color]color=#93A1A1.[/color][color=#48484C]show[/color]color=#93A1A1;[/color]
  • [color=#48484C] [/color][color=#93A1A1]}[/color]
  • [color=#48484C] [/color][color=#93A1A1]});[/color]
  • [color=#93A1A1]});[/color]

[font="Monaco, Menlo, Consolas, Courier New, monospace"][size="2"][color="#93a1a1"]

[/color][/size][/font]

Reset button click: [color="#ff00ff"]?????????? where [/color]

  • [color=#48484C]$[/color]color=#93A1A1.[/color][color=#48484C]click[/color][color=#93A1A1]([/color][color=#1E347B]function[/color]color=#93A1A1[/color][color=#48484C] [/color][color=#93A1A1]{[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]editable[/color][color=#93A1A1]([/color][color=#DD1144]‘setValue’[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#1E347B]null[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]//clear values[/color]
  • [color=#48484C] [/color][color=#93A1A1].[/color][color=#48484C]editable[/color][color=#93A1A1]([/color][color=#DD1144]‘option’[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#DD1144]‘pk’[/color][color=#93A1A1],[/color][color=#48484C] [/color][color=#1E347B]null[/color][color=#93A1A1])[/color][color=#48484C] [/color][color=#93A1A1]//clear pk[/color]
  • [color=#48484C] [/color][color=#93A1A1].[/color][color=#48484C]removeClass[/color]color=#93A1A1;[/color][color=#48484C] [/color][color=#93A1A1]//remove bold css[/color]
  • [color=#48484C] [/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]show[/color]color=#93A1A1;[/color]
  • [color=#48484C] $[/color]color=#93A1A1.[/color][color=#48484C]hide[/color]color=#93A1A1;[/color][color=#48484C] [/color]
  • [color=#93A1A1]});[/color]

[font="Monaco, Menlo, Consolas, Courier New, monospace"][size="2"][color="#93a1a1"]

[/color][/size][/font]

php code: [color="#ff00ff"]?????????? where [/color]

[font="Monaco, Menlo, Consolas, Courier New, monospace"][size="2"][color="#93a1a1"]

<?php

if($model->isNewRecord) {

    Yii::app()-&gt;clientScript-&gt;registerScript('new-model', '


        &#036;(&quot;#save-btn&quot;).click(function() {


            &#036;(this).parent().parent().find(&quot;.editable&quot;).editable(&quot;submit&quot;, {


                url: &quot;'.&#036;this-&gt;createUrl('Perfiles/createPerfiles').'&quot;,


                data: '.CJSON::encode(array('YII_CSRF_TOKEN' =&gt; Yii::app()-&gt;request-&gt;csrfToken)).',


                ajaxOptions: { dataType: &quot;json&quot; },                    


                success: function(data, config) {


                    if(data &amp;&amp; data.id) {


                        &#036;(this).editable(&quot;option&quot;, &quot;pk&quot;, data.id);


                        &#036;(this).removeClass(&quot;editable-unsaved&quot;);


                        &#036;(&quot;#msg&quot;).removeClass(&quot;alert-error&quot;).addClass(&quot;alert-success&quot;)


                                 .html(&quot;User created&#33; Now you can update it.&quot;).show();


                        &#036;(&quot;#save-btn&quot;).hide();


                    } else {


                        config.error.call(this, data &amp;&amp; data.errors ? data.errors : &quot;Unknown error&quot;);


                    }


                },


                error: function(errors) {


                    var msg = &quot;&quot;;


                    if(errors &amp;&amp; errors.responseText) { 


                        msg = errors.responseText;


                    } else {


                        &#036;.each(errors, function(k, v) { msg += v+&quot;&lt;br&gt;&quot;; });


                    } 


                    &#036;(&quot;#msg&quot;).removeClass(&quot;alert-success&quot;).addClass(&quot;alert-error&quot;)


                             .html(msg).show();         


                 }


            });


        });


    ');   


}

?>[/color][/size][/font]