Ayuda con función Jquery

eridamega

Lanero Reconocido
17 Mar 2006
1,339
Amigos buenas
Tengo esta función que me limita a 20 caracteres cuando se hace clic en submit, pero por algún motivo se ejecuta el else aun cuando el texto es menor de 20 caracteres.como puedo solucionar eso
El formaulario
Código:
<form method="post" action="" onSubmit="return validar();">
    <div>
        <label> Marcado</label><p></p>
    
        <!-- Este es el ID  y varia depediendo de la página que abra para el ejemplo puse 23-->
        <input type="hidden" id="productMainCategoryId" value="23">

        <textarea placeholder="marca aca" class="product-message" maxlength="250" name="marcado">    </textarea>
        <small class="float-xs-right">Máximo 200 caracteres</small>
        <p></p>

        <button class="btn btn-primary float-xs-right" type="submit" name="submitCustomizedData">guardar</button>
    </div>
</form>
La función
Código:
var productMainCategoryId = $('#productMainCategoryId').val();
 
function validar(largo, limite){
        //Almacenamos los valores
    nombre = $('.product-message').val();
    if (largo < limite){
        alert('La formula funciono con ' + largo + '. texto agregado');
        return true;
    }
    else{
        $("small.float-xs-right").html("<span style='color: #ff0000;'>Se excede el limite permitido</span>");
        alert('La formula funciono, pero te pasaste de los caracteres');
        return false;
    }
}
 
if (productMainCategoryId == 23 || productMainCategoryId == 27 || productMainCategoryId == 28){
    $("small.float-xs-right").text('Limite 20 caracteres');
  
    validar(nombre.length, 20);
}

Alguien podria ayudarme??
 
onSubmit="return validar(); aquí debería llevar los parámetros
@ciclomuisca gracias por responder disculpa mi ignorancia pero como lo hago.
Tengo otra pregunta aunque no es recomendado tener una función dentro de un condicional es la única forma que he podido hacer funcionar mi script.
Que pasa si dejo la función dentro del condicional if, el lint js me muestra este warning
Código:
Function statements should not be placed in blocks.Use a function expression or move the statement to the top of the outer function.
Código:
if (productMainCategoryId == 23 || productMainCategoryId == 27 || productMainCategoryId == 28) {
    $("small.float-xs-right").text('Limite 20 caracteres');

    function validar() {
        //Almacenamos los valores
        limiteCaracter = $('.product-message').val();

        //Comprobamos la longitud de caracteres
        if (limiteCaracter.length < 20) {
            alert('La formula funciono. texto agregado');
            return true;

        } else {
            $("small.float-xs-right").html("<span style='color: #ff0000;'>Se excede el limite permitido</span>");
            alert('La formula funciono, pero te pasaste de los caracteres');

            return false;
        }

    }

}
Te dejo mi único código, puedo dejarlo asi? es la única forma que he logrado que funcione.
Sinceramente gracias
 
La funcion debe quedar por fuera y el if lo puede dejar adentro , ¿que error le saca?

Hice un ejemplo, pero deje los return en false para que observe como seria.
Código:
<html>
<head>
    <title>prueba</title>
</head>
<body>
    <form method="post" action="#" onsubmit="return validar();">
        <div>
            <label>Marcado</label><p></p>

            <!-- Este es el ID  y varia depediendo de la página que abra para el ejemplo puse 23-->
            <input type="hidden" id="productMainCategoryId" value="23">

            <textarea placeholder="marca aca" class="product-message" maxlength="250" name="marcado"></textarea>
            <small class="float-xs-right">Máximo 200 caracteres</small>
            <p></p>

            <button class="btn btn-primary float-xs-right" type="submit" name="submitCustomizedData">guardar</button>
        </div>
    </form>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
    <script>
        var LIMITE = 20;

        function validar() {
            var productMainCategoryId = $('#productMainCategoryId').val();
            if (productMainCategoryId == 23 || productMainCategoryId == 27 || productMainCategoryId == 28) {
                $("small.float-xs-right").text('Limite 20 caracteres');

                //Almacenamos los valores
                nombre = $('.product-message').val();
                if (nombre.length < LIMITE) {
                    alert('La formula funciono con ' + nombre.length + '. texto agregado');
                    return false;
                }
                else {
                    $("small.float-xs-right").html("<span style='color: #ff0000;'>Se excede el limite permitido</span>");
                    alert('La formula funciono, pero te pasaste de los caracteres');
                    return false;
                }
            }
            return false;
        }

    </script>
</body>
</html>
 
Última edición por un moderador:
La funcion debe quedar por fuera y el if lo puede dejar adentro , ¿que error le saca?

Hice un ejemplo, pero deje los return en false para que observe como seria.
Código:
<html>
<head>
    <title>prueba</title>
</head>
<body>
    <form method="post" action="#" onsubmit="return validar();">
        <div>
            <label>Marcado</label><p></p>

            <!-- Este es el ID  y varia depediendo de la página que abra para el ejemplo puse 23-->
            <input type="hidden" id="productMainCategoryId" value="23">

            <textarea placeholder="marca aca" class="product-message" maxlength="250" name="marcado"></textarea>
            <small class="float-xs-right">Máximo 200 caracteres</small>
            <p></p>

            <button class="btn btn-primary float-xs-right" type="submit" name="submitCustomizedData">guardar</button>
        </div>
    </form>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
    <script>
        var LIMITE = 20;

        function validar() {
            var productMainCategoryId = $('#productMainCategoryId').val();
            if (productMainCategoryId == 23 || productMainCategoryId == 27 || productMainCategoryId == 28) {
                $("small.float-xs-right").text('Limite 20 caracteres');

                //Almacenamos los valores
                nombre = $('.product-message').val();
                if (nombre.length < LIMITE) {
                    alert('La formula funciono con ' + nombre.length + '. texto agregado');
                    return false;
                }
                else {
                    $("small.float-xs-right").html("<span style='color: #ff0000;'>Se excede el limite permitido</span>");
                    alert('La formula funciono, pero te pasaste de los caracteres');
                    return false;
                }
            }
            return false;
        }

    </script>
</body>
</html>
Gracias por responder. tu script esta de lujo, existe alguna forma que el texto de aviso
Código:
 $("small.float-xs-right").text('Limite 20 caracteres');
apareza justo depues de cargar la página y no al darle clic en guardar.
jpeg.jpg


Mi formula funciona bien, la función (la de mi código) esta dentro del if cuando la pase por http://jshint.com/ me arroja que la función no debe estar dentro del if, pero en el inspeccionador de Google no muestra ningún error, así la estoy usando
 

Los últimos temas