¡Caminando hacia el éxito!

Aprende en Comunidad

Avalados por :

Problema de arrastrar y soltar en SAP HANA: solución con jQuery y sap.ui.ux3.shell

  • Creado 01/03/2024
  • Modificado 01/03/2024
  • 8 Vistas
0
Cargando...

Hola a todos,

Estoy enfrentando el mismo problema que Samba en el Centro de Desarrollo de SAP HANA http://scn.sap.com/thread/3480868 .

Intenté usar funciones de arrastrar y soltar usando jQuery. Sin el sap.ui.ux3.shell todo funciona bien. Pero cuando pongo el contenido de la página en un shell, el arrastrar y soltar ya no funciona.


<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.ui.commons, sap.ui.table, sap.ui.ux3"
                data-sap-ui-theme="sap_goldreflection">
       
        </script>
        <script type="text/javascript" src="js/commons.js"></script>
        <script type="text/javascript" src="js/model.js"></script>         <!-- gateway access -->
        <script type="text/javascript" src="js/filter.js"></script>
       
        <!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required
        <link rel="stylesheet" type="text/css" href="css/custom.css">
       
        <script>
       
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-core'); 
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-widget'); 
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-mouse'); 
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-draggable');
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-droppable'); 
        $.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-sortable'); 

......
......
var oShell =    
            
Pedro Pascal
Se unió el 07/03/2018
Pinterest
Telegram
Linkedin
Whatsapp

4 Respuestas

0
Cargando...

Hola Ramesh,

Gracias por tu respuesta.

En el método "onBeforeRendering" desvinculo los eventos. Puedes usar $( "#oWInputLayout .sapUiVltCell" ).unbind(), pero he leído sobre problemas con un desvinculado general. El método preferido es especificar los eventos que deseas desvincular.

Así que mi solución fue desvincular todos los posibles eventos de arrastre:

$( "#oWInputLayout .sapUiVltCell" ).unbind("draginit dragstart drag dragend");

Espero haberte ayudado.

Saludos

Kai

Respondido el 15/04/2024
LUCIANO RIOJA GHIOTTO
Se unió el 13/07/2019
0
Cargando...

Hola Kai,

¡Buena idea! ¿Puedes publicar lo que has escrito en "onBeforeRendering" para desvincular el arrastrable? ¿Es solo "   $( "#oWInputLayout .sapUiVltCell" ).draggable('disable')    "?


Saludos,

Ramesh

Respondido el 15/04/2024
LUCIANO RIOJA GHIOTTO
Se unió el 13/07/2019
0
Cargando...

Buen trabajo

Respondido el 15/04/2024
LUCIANO RIOJA GHIOTTO
Se unió el 13/07/2019
0
Cargando...

¡Hola a todos!

Hoy encontré la solución en la documentación:

SAPUI5 SDK - Demo Kit

        
            La inscripción del evento debe realizarse en el método onAfterRendering del Control, por lo que el enlace del evento se repite siempre después de que el control se vuelva a renderizar (se crean nuevos elementos DOM y se descartan los antiguos). Además, para evitar fugas de memoria, el enlace del evento debe eliminarse (con jQuery.unbind()) en el método "onBeforeRendering" y en el método "exit" (que se llama antes de que se destruya el Control).
        
    

Por lo tanto, en mi caso, coloqué lo siguiente en la función onAfterRenderin del controlador correspondiente:

        
            onAfterRendering: function() {
                //Wareneingang
                //Permitir arrastrar y soltar, el alcance regula a dónde se puede arrastrar, aquí dentro también se pueden cargar funciones, por ejemplo: start:function() { //hacer algo }.
                $(function() {
                    $("#oWInputLayout .sapUiVltCell").draggable({handle: "#oWInputLayout .sapUiVltCell .sapUiLbl", appendTo: 'body', zIndex: 1500, containment: 'DOM', revert: 'invalid', helper: 'clone', addClasses: false, scope: "Create-TA"
                    });
                });
                $(function() {
                    $("#oWTaLayout").droppable({scope: "Create-TA"});
                });
                //...
            }
        
    

Espero que esto ayude.

Kai

Respondido el 15/04/2024
LUCIANO RIOJA GHIOTTO
Se unió el 13/07/2019

contacto@primeinstitute.com

(+51) 1641 9379
(+57) 1489 6964

© 2024 Copyright. Todos los derechos reservados.

Desarrollado por Prime Institute

¡Hola! Soy Diana, asesora académica de Prime Institute, indícame en que curso estas interesado, saludos!
Hola ¿Puedo ayudarte?