APEX_ITEM Parte 2 Guardando Check Boxes con Ajax y manteniendo el valor en paginación + Oracle Apex + Jquery

Buen dia , continuando con el manejo de apex_items, hoy veremos como guardar el valor de un checkbox sin necesidad de hacer submit a la pagina y manteniendo el valor si  usamos la paginacion en un reporte.

En mi anterior tutorial veiamos  el manejo simple de un checkbox

Para este fin vamos a usar:

  • Colecciones / Collections
  • Ajax / apex.server.process
  • Interactive report
  • PlSql
Video demo:
Link demo apex, user: demo / pass: demo
Primero crearemos una coleccion, nombre: \’EMPLEADOS_COL\’ , y se creara a partir de un query de los empleados, notemos que tengo una columna donde me indica si el empleado pertenece al departamento seleccionado.

Documentacion  de colecciones

declare
l_sql varchar2(4000);
l_nombre_coleccion varchar2(4000) := \'EMPLEADOS_COL\';
begin

if apex_collection.collection_exists (p_collection_name => l_nombre_coleccion)
then
apex_collection.delete_collection(p_collection_name => l_nombre_coleccion);
end if;

l_sql :=\'select empno
, ename
, deptno
, sal
, case when deptno = :P23_DEPARTAMENTO then 1 else 0 end pertenece
, 0 ind_cambio
from emp\';

apex_collection.create_collection_from_query_b
(
p_collection_name => l_nombre_coleccion
, p_query => l_sql
, p_names => apex_util.string_to_table(\'P23_DEPARTAMENTO\')
, p_values => apex_util.string_to_table(:P23_DEPARTAMENTO)
);

end;

Luego usaremos crearemos un reporte con la coleccion, aqui agregaremos el apex_item.checkbox2.

select seq_id
, c001 empno
, c002 ename
, c003 deptno
, c004 sal
, apex_item.hidden(p_idx => 1
, p_value => seq_id) ||
apex_item.checkbox2(p_idx => 2
, p_value => c005
, p_checked_values => 1) pertenece
, c006 ind_cambio
from apex_collections
where collection_name = \'EMPLEADOS_COL\'

Luego crearemos una accion dinamica para capturar el click en el checkbox.

Dentro crearemos una accion de JavaScript, aqui llamaremos un proceso AJAX (apex.server.process), para actualizar la coleccion.

console.log(this.triggeringElement);

var elem = this.triggeringElement;
var estaMarcado = $(elem).is(\':checked\');
var seqId = $(elem).parent().find(\"input[name=\'f01\']\").val();

//console.log(estaMarcado);
//console.log(seqId);

apex.server.process(\"Actualizar_Coleccion\",
{ x01: seqId
, x02: estaMarcado
}
, {success: function(pdata){
console.log(pdata.mensaje);
}
}
// , {dataType: \"text\"}
);

En el proceso AJAX .

* Actualizamos el atributo 6 del coleccion que es nuestro indicador que hubo un cambio en ese registro.
* Actualizamos el atributo 5 con 1 si esta el valor CHECKED y 0 si no lo es.
* Escribimos un objeto JSON para luego si deseamos personalizar el mensaje de nuestro cambio.

begin
apex_collection.update_member_attribute (
p_collection_name => \'EMPLEADOS_COL\',
p_seq => apex_application.g_x01,
p_attr_number => 5,
p_attr_value => case when apex_application.g_x02 = \'true\' then \'1\' else \'0\' end
);

apex_collection.update_member_attribute (
p_collection_name => \'EMPLEADOS_COL\',
p_seq => apex_application.g_x01,
p_attr_number => 6,
p_attr_value => 1
);

apex_json.open_object;
apex_json.write(p_name => \'mensaje\', p_value=> \'Actualizado correctamente\');
apex_json.close_object;
exception
when others then
apex_json.open_object;
apex_json.write(p_name => \'mensaje\', p_value=> \'Error al actualizar\');
apex_json.close_object;

end;

Finalmente creamos un proceso Pl/Sql para actualizar los valores en tabla.

* Notemos que en el proceso de ajax podemos hacer esta actualizacion.

for c_emp in (select c001 empno
, c005 pertenece -- c005 es de pertenencia
from apex_collections
where collection_name = \'EMPLEADOS_COL\'
and c006 != 0 -- todos los que han cambiado de valor
)
loop

if c_emp.pertenece = 1 then
update emp
set deptno = :P22_DEPARTAMENTO
where empno = c_emp.empno;

else
update emp
set deptno = null
where empno = c_emp.empno;
end if;

end loop;

Published by Angel O. Flores Torres

System engineer, Applications engineer, working with C# and Oracle Apex 5, 5.1 since 2017. I specialize in Oracle APEX (Oracle Application Express )

One thought on “APEX_ITEM Parte 2 Guardando Check Boxes con Ajax y manteniendo el valor en paginación + Oracle Apex + Jquery

  1. HiYour article is great but I am looking for the same exact solution but using \”Select All\” check box to select all rows in the report page and preserve the selections while pagination to use the checked values \”Record ID\” for processing another process in a PL/SQL process.Thank you,

    Like

Leave a Reply to Unknown Cancel reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: