variable is not defined in JS

0

I have a dynamic input that I draw with

for (var j = 0; j < valorCantidad; j++) {
    contador = contador + 1;
    jQuery('#tblTabla1 tr:last').after('<tr>' +
        '<td align="center" class="valorId">' + contador + '</td>' +
        '<td align="center" class="valorInt">' + valorInterno + '</td>' +
        '<td align="center" class="valorFa">' + valorFa + '</td>' +
        '<td align="center" class="valorArt">' + valorAr + '</td>' +
        '<td align="center">'+
            '<input type="text" id="numeroSerie-' + contador + '" name="Serie" placeholder="Ingrese número de serie" class="form-control" onblur="validacionSeries(numeroSerie-' + contador + ');" />'+
            '<div id="divError-' + contador + '"></div>'+
        '</td>'+
    '</tr>'); 

and this is my function

<script>
    function validacionSeries(txt) {
        alert("ok"+txt);
        var m = document.getElementById(valorTxt).value;
        alert(m);
        var expreg = new RegExp("^[0-9]{15,19}$");

        if (expreg.test(m)) {
            alert("ok");
        } else {
            alert("no");
        };
    };
</script>

As you can see, I add a JS onblur="validacionSeries(numeroSerie-' + contador + ');" method to the textbox, but it sends me a message of numeroSerie that is not defined, I do not understand why, if I remove the variable that passed as a parameter the function is executed well (only that I put in the function without parameter a alert ).

    
asked by Ivxn 07.07.2016 в 00:33
source

3 answers

1

The error you're seeing is because numeroSerie-1 is not a valid variable name in JavaScript, the - character takes it as the subtraction operator.

On the other hand I see that you are assigning the event directly to the <input> element through the onblur attribute. It is recommended that you avoid assigning the event handlers directly on an element, instead it is better to assign them by code, thus keeping the HTML structure somewhat cleaner.

In your specific case you can even create a single event handler that handles all the rows. Here is a minimal example:

function validacion(txt) {
  return /^[0-9]{15,19}$/.test(txt);
};

$('#tblTabla1').on('blur', '.serie', function(event) {
  var input = $(event.target);
  var txt = input.val();
  var span = input.next('.error');
  span.toggle(!validacion(txt));
});

for (var i = 1; i <= 10; i++) {
    $('#tblTabla1 tr:last').after('<tr>' +
        '<td>' + i + '</td>' +
        '<td>' +
            '<input class="serie" />'+
            '<span class="error" style="display:none">Error</span>'+
        '</td>' +
    '</tr>'); 
}
.error {
  color: #f00;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tblTabla1">
  <tr></tr>
</table>
    
answered by 07.07.2016 / 02:49
source
2

By parts:

The example that you put is incomplete, try to make it more complete. Among other things it would help to know what you want to do (and to propose better solutions).

In this case, it gives you the error because when you do

'... onblur="validacionSeries(numeroSerie-' + contador + ');"'

that numeroSerie that should be a string, is not as such.

To see a bit the idea I modified it a bit, it does not seem like the best solution but I'll leave you what I changed (I did not see what you wanted to do afterwards, besides the valorTxt I do not know what it is )

link

I do not know if you still want to put the numeroSerie as String in the function, if so, what is said, it has to be like String

Greetings

    
answered by 07.07.2016 в 16:18
1

If what you are looking for is how to validate the pattern ^[0-9]{15,19}$ we can do it using HTML5 which to date is well supported: link in the code look how it is defined myElementToAdd

var contador = 1;
function agregarInput(){
var myElementToAdd = '<input type="text" id="numeroSerie-' + contador + '" name="Serie" placeholder="Ingrese número de serie" class="form-control" pattern="^[0-9]{15,19}$" />'
$('#resultado').append(myElementToAdd);
}

   function validacionSeries(txt) {
        alert("ok"+txt);
        var m = document.getElementById(valorTxt).value;
        alert(m);
        var expreg = new RegExp("^[0-9]{15,19}$");

        if (expreg.test(m)) {
            alert("ok");
        } else {
            alert("no");
        };
    };
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="agregarInput()">agregar input</button>
<div id=resultado></div>
    
answered by 07.07.2016 в 01:55