# OUT OF SERVICE - How to use a switch in a table - UI designer

## After building a table and dragging a switch field, you need TODO:

Usado em listapage, listaenv, Transaccao

![](/files/-LV0Vto0ae9KPoWDqjBl)

### 1. Give a name to the table with the switch. Example "isac":

![](/files/-LBVXEj2EKOoEmJtfES5)

### 2. In JS tab add:

* **isac** - nome da class da tabela
* **p\_*****status\_page*** - tag do checkbox/switch
* **p\_*****id*****\_fk** - if tag hidden add \_fk of each line for action purpose in the change function (3. point)
* **p\_id** *- name of the param that will be used in method changestatus()*
* webapps?r=\[*app*]/\[*page*]/\[*actionXXX*()]

```javascript
$('.isac').on('change','td input[name="p_status_page"]',function(){

        var isChecked = $(this).is(':checked'),
            id         = $(this).parents('tr').find('input[name="p_id_fk"]').val(),
            val        = isChecked ? 1 : 0;

        $.IGRP.request('webapps?r=igrp_studio/ListaPage/changeStatus',{
            params : {
                p_id : id,
                p_status_page : val
            },
            success:function(r){
                var type = r.status ? 'success' : 'danger',
                    msg  = r.status ? 'Estado alterado' : 'Estado não foi alterado';

             
                    $.IGRP.notify({
                        message : msg,
                        type    : type
                    });
            },
            fail:function(){

            }
        });

    });


```

### **OR**

#### **If the id tag is a column and not a hidden field, no need to add \_fk. See name=code without \_fk**

```javascript
$('.isac').on('change','td input[name="p_status"]',function(){
        var isChecked = $(this).is(':checked'),
            code = $(this).parents('tr').find("[item-name=codigo]").text(),
            val = isChecked ? 1 : 0;
      
        $.IGRP.request('webapps?r=igrp/transaccao/changeStatus',{
            params : {
                p_code : code,
        p_status : val
            },
            success:function(r){
                var type = r.status ? 'success' : 'danger',
                    msg = r.status ? 'Estado alterado!' : 'Estado não foi alterado!';

              
                    $.IGRP.notify({
                        message : msg,
                        type    : type
                    });
            },
            fail:function(){

            }
        });

    });


```

## 3. Add this lines to the controller.java

* **In the actionIndex()**

{% code title="actionIndex()" %}

```java
table1.setStatus(ac.getStatus());
table1.setStatus_check(ac.getStatus() == 1 ? ac.getStatus() : -1);
```

{% endcode %}

* **Import in the reserved import area:**

```
import org.json.JSONException;
import org.json.JSONObject;
import com.google.gson.Gson;
```

* **In the START-PRESERVED-AREA(CUSTOM\_ACTIONS)**

**Reading the params p\_id and p\_status of the javascript**

```
public Response actionChangeStatus() throws IOException, IllegalArgumentException, IllegalAccessException, JSONException {

        this.format = Response.FORMAT_JSON;
        int id = Core.getParamInt("p_id");
        int status = Core.getParamInt("p_status");
        boolean response = false;

        if (id != 0)) {
            Action page = new Action().findOne(id);
            if (page != null) {
                page.setStatus(status);
                if (page.update() != null)
                    response = true;
            }
        }

        JSONObject json = new JSONObject();
        json.put("status", response);     
        return this.renderView(json.toString());
    }
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://nosicode.gitbook.io/faq/advanced/how-to-use-a-switch-in-a-table-ui-designer.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.