Que es Ace Editor y por que interfiere en mi ajax?!

mayid · #1 (**permalink**) 30/05/2011, 16:57

De un momento para otro, mi web devuelve las llamadas ajax con un monton de estilo css, que no se de donde sale. Y lo curioso es que me pasa en local y en remoto. Pero por qué? No se que es ace_editor, y sin embargo está interfiendo en mis respuestas ajax:

Cita:

.ace_editor { position: absolute; overflow: hidden; font-family: "Menlo", "Monaco", "Courier New", monospace; font-size: 12px; }.ace_scroller { position: absolute; overflow-x: scroll; overflow-y: hidden; }.ace_content { position: absolute; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}.ace_composition { position: absolute; background: #555; color: #DDD; z-index: 4;}.ace_gutter { position: absolute; overflow-x: hidden; overflow-y: hidden; height: 100%;}.ace_gutter-cell.ace_error { background-image: url("data:image/gif,GIF89a%10%00%10%00%D5%00%00%F5or%F5%87%88%F5nr %F4ns%EBmq%F5z%7F%DDJT%DEKS%DFOW%F1Yc%F2ah%CE(7%CE )8%D18E%DD%40M%F2KZ%EBU%60%F4%60m%DCir%C8%16(%C8%1 9*%CE%255%F1%3FR%F1%3FS%E6%AB%B5%CA%5DI%CEn%5E%F7% A2%9A%C9G%3E%E0a%5B%F7%89%85%F5yy%F6%82%80%ED%82%8 0%FF%BF%BF%E3%C4%C4%FF%FF%FF%FF%FF%FF%00%00%00%00% 00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00 %00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%0 0%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00% 00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00 %00%00%00%00%00%00%00!%F9%04%01%00%00%25%00%2C%00% 00%00%00%10%00%10%00%00%06p%C0%92pH%2C%1A%8F%C8%D2 H%93%E1d4%23%E4%88%D3%09mB%1DN%B48%F5%90%40%60%92G %5B%94%20%3E%22%D2%87%24%FA%20%24%C5%06A%00%20%B1% 07%02B%A38%89X.v%17%82%11%13q%10%0Fi%24%0F%8B%10%7 BD%12%0Ei%09%92%09%0EpD%18%15%24%0A%9Ci%05%0C%18F% 18%0B%07%04%01%04%06%A0H%18%12%0D%14%0D%12%A1I%B3% B4%B5IA%00%3B"); background-repeat: no-repeat; background-position: 4px center;}.ace_gutter-cell.ace_warning { background-image: url("data:image/gif,GIF89a%10%00%10%00%D5%00%00%FF%DBr%FF%DE%81%FF %E2%8D%FF%E2%8F%FF%E4%96%FF%E3%97%FF%E5%9D%FF%E6%9 E%FF%EE%C1%FF%C8Z%FF%CDk%FF%D0s%FF%D4%81%FF%D5%82% FF%D5%83%FF%DC%97%FF%DE%9D%FF%E7%B8%FF%CCl%7BQ%13% 80U%15%82W%16%81U%16%89%5B%18%87%5B%18%8C%5E%1A%94 d%1D%C5%83-%C9%87%2F%C6%84.%C6%85.%CD%8B2%C9%871%CB%8A3%CD%8B 5%DC%98%3F%DF%9BB%E0%9CC%E1%A5U%CB%871%CF%8B5%D1%8 D6%DB%97%40%DF%9AB%DD%99B%E3%B0p%E7%CC%AE%FF%FF%FF %00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%0 0%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00% 00%00%00%00%00%00%00%00%00%00%00%00%00%00%00!%F9%0 4%01%00%00%2F%00%2C%00%00%00%00%10%00%10%00%00%06a %C0%97pH%2C%1A%8FH%A1%ABTr%25%87%2B%04%82%F4%7C%B9 X%91%08%CB%99%1C!%26%13%84*iJ9(%15G%CA%84%14%01%1A %97%0C%03%80%3A%9A%3E%81%84%3E%11%08%B1%8B%20%02%1 2%0F%18%1A%0F%0A%03'F%1C%04%0B%10%16%18%10%0B%05%1 CF%1D-%06%07%9A%9A-%1EG%1B%A0%A1%A0U%A4%A5%A6BA%00%3B"); background-repeat: no-repeat; background-position: 4px center;}.ace_editor .ace_sb { position: absolute; overflow-x: hidden; overflow-y: scroll; right: 0;}.ace_editor .ace_sb div { position: absolute; width: 1px; left: 0;}.ace_editor .ace_print_margin_layer { z-index: 0; position: absolute; overflow: hidden; margin: 0; left: 0; height: 100%; width: 100%;}.ace_editor .ace_print_margin { position: absolute; height: 100%;}.ace_editor textarea { position: fixed; z-index: -1; width: 10px; height: 30px; opacity: 0; background: transparent; appearance: none; border: none; resize: none; outline: none; overflow: hidden;}.ace_layer { z-index: 1; position: absolute; overflow: hidden; white-space: nowrap; height: 100%; width: 100%;}.ace_text-layer { font-family: Monaco, "Courier New", monospace; color: black;}.ace_cjk { display: inline-block; text-align: center;}.ace_cursor-layer { z-index: 4; cursor: text; pointer-events: none;}.ace_cursor { z-index: 4; position: absolute;}.ace_line { white-space: nowrap;}.ace_marker-layer { cursor: text; pointer-events: none;}.ace_marker-layer .ace_step { position: absolute; z-index: 3;}.ace_marker-layer .ace_selection { position: absolute; z-index: 4;}.ace_marker-layer .ace_bracket { position: absolute; z-index: 5;}.ace_marker-layer .ace_active_line { position: absolute; z-index: 2;}.ace_marker-layer .ace_selected_word { position: absolute; z-index: 6; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}.ace_dragging .ace_marker-layer, .ace_dragging .ace_text-layer { cursor: move;}redirigir

abimaelrc · #2 (**permalink**) 30/05/2011, 17:05

Bueno como ace_editor tiene un punto antes, representa una clase, busca en tu plantilla si se presenta una etiqueta con alguna clase que se llame ace_editor. Creo que te responderían mejor los de CSS que aca en PHP

mayid · #3 (**permalink**) 30/05/2011, 17:08

Mira, yo estimo que son estilos para mensajes de error. Pero no se por qué aparecen, si el error en sí no aparece.

No, no son estilos mios. Yo hice la web y no los puse. Ademas, busqué por si era alguna inyeccion pero no es.

En fin, estoy haciendo debug a ver si aparece algun error causante de esto!

mayid · #4 (**permalink**) 30/05/2011, 17:30

Traslado el tema a Frameworks JS porque hice pruebas en PHP para detectar el problema y me dieron resultados raros. Si yo imprimo algo en la primera linea, pues incluso así me aparece todo ese codigo css incrustado antes de lo que yo imprimo! Hago die("prueba"); y me aparece al final de todo el css.

Mi conclusion es que es el plugin de ajax forms el que esta dando error. Pero hasta ahora andaba bien!!! Y de repente no anda ni en local ni en remoto :/

Aclaro que ese codigo no me interfiere todas las respuestas ajax. Solo las que tienen que ver con un script de registro de usuarios aparentemente. Ademas, que el mensaje de lado servidor es un ok, y que se evalua success.

Va algo de codigo:

Código Javascript:

Ver original<script type="text/javascript">
jQuery(document).ready(function($) {
    
    controlador = 'app/controlador_frontal.php';
 
    /* paises */
    $("form select[name=pais]").change(function(){
        
        seleccionado = $(this).children("option:selected").val(); 
        $("form select[name=region]").load(controlador, {id_pais:seleccionado});
    })      
});
 
jQuery(document).ready(function($) {
    
    jQuery.validator.addMethod("seleccionado", function(value, element) {
        
        return (value == 0) ? false : true;
        
    }, "Debes elegir tu pais");
 
    // validacion
    $(".form form").validate({
        rules: {
            cclave: { equalTo: "#clave" },      
            pais:{ seleccionado: true },
            region:{ seleccionado: true },
            dia:{ digits: true },
            anio:{
                required: true,
                digits: true,
                minlength: 4,
                min: 1900
            }
        },  
        messages: {
            nombre: "Debes escribir tu nombre",
            apellido: "Debes escribir tu apellido",
            //nick: "Debes escribir tu apodo",
            clave: "Elige tu contraseña",
            cclave: "Escribe la misma contraseña",
            email: "verifica tu email",
            pais: "elige tu pais",
            region: "elige tu region",
            dia: "escribe el dia",
            //anio: "escribe un año de 4 cifras",
            nacimiento: "escribe tu fecha de nacimiento",
            foto: "sube una foto",
            captcha: "escribe el codigo captcha"
        }
        }); 
    
    // formularios ajax     
    var options = { 
        dataType:  'html',
        success:   enviar // tras validacion de foto.   
    };  
   
    $(".form form").ajaxForm(options);  // inicializacion
    
    function enviar(texto, status, xhr, $form){
        
        texto = texto.replace(/<\/?[^>]+>/gi, '');                  // quitamos html que impone ajaxForm
        texto = texto.replace(/^(\s|\&nbsp;)*|(\s|\&nbsp;)*$/g,""); // quitamos espacios en blanco (trim)
        
        if (texto == "redirigir")
            window.location='<?php echo HTTP_RAIZ."galeria"; ?>';
        else
        {
            $("span.captcha img").attr("src", "<?php echo HTTP_APP; ?>utiles/captcha/captcha.php"+  '?' + (new Date()).getTime());
            $(".mensajeError").css("display", "block").text(texto); 
        }
    }
})
 
</script>

mayid · #5 (**permalink**) 30/05/2011, 17:45

Bien, una solucion temporal fue cambiar esto por esto:

Código Javascript:

Ver original//if (texto == "redirigir")
        if ( texto.search("redirigir") )

No habituado a usar json, yo devuelvo texto. Y recuerdo que el plugin jquery forms agrega cabeceras html en las respuestas. Por eso yo usaba expresiones regulares para limpiar la respuesta. Y bueno, ahora no se por qué empieza a aparecer css, pero lo esquivo buscando la palabra "redirigir". Me vale por ahora, hasta que implemente json.

mayid · #6 (**permalink**) 02/06/2011, 08:07

Ya me estaba pareciendo muy raro esto, porque me aparecio el mismo problema en otra web! Así que probé con navegadores diferentes y veo que el problema solo aparece en Chrome.