Return false does not work within each

1

I'm going through a table with data, pressing search takes the value of the input and looks for it in the table, when it finds it I need to cut the execution of the function, which is what I can not do thanks.

function BuscarCodigo() {
  $("#table tbody tr").each(function() {
    if ($(this).find("td:eq(0)").text() == $('#codigo').val()) {
      alert("codigo ya ingresado");
      return false;//no funciona , no detiene la ejecucion de la funcion
    }
  });
  //estos alerts no deberian mostrarse por que necesito detener la ejecucion en el "return false" 
  alert("llego");//aca no deberia llegar 
  alert("llego");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input id="codigo" type="text"> 
<button type="button" onclick="BuscarCodigo()"> Buscar</button>
<table id="table">
  <thead>
    <tr>
      <th>Codigo</th>
      <th>Cantidad</th>
    </tr>
  </thead>
  <tbody>
    <tr id="1">
      <td>4859</td>
      <td>2</td>
    </tr>
    <tr id="2">
      <td>2568</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
    
asked by Javier Antonio Aguayo Aguilar 13.11.2017 в 16:32
source

3 answers

2

The problem is that the return is for the foreach not for the function, what it does there is that it does not continue iterating but it follows the function, you could try something like that

function BuscarCodigo() {
  var fin = false;
  $("#table tbody tr").each(function() {
    if ($(this).find("td:eq(0)").text() == $('#codigo').val()) {
      alert("codigo ya ingresado");
      fin = true;
      return false;//no funciona , no detiene la ejecucion de la funcion
    }
  });
  //estos alerts no deberian mostrarse por que necesito detener la ejecucion en el "return false" 
  if(fin) {
   return false;
  }
  alert("llego");//aca no deberia llegar 
  alert("llego");

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input id="codigo" type="text"> 
<button type="button" onclick="BuscarCodigo()"> Buscar</button>
<table id="table">
  <thead>
    <tr>
      <th>Codigo</th>
      <th>Cantidad</th>
    </tr>
  </thead>
  <tbody>
    <tr id="1">
      <td>4859</td>
      <td>2</td>
    </tr>
    <tr id="2">
      <td>2568</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
    
answered by 13.11.2017 / 16:59
source
2

Yes it works, in fact it is the correct way to leave a each , but not a function. when doing return false is not cutting the execution of the function but the each method, you could check doing a console.log to the iterated row and if you look for the first value, it will only show this and not the second one. To exit the function you could have a bandera (seencontro) . and at the end of the function only returns that flag that will have the status of the search.

function BuscarCodigo() {
  var seencontro = false;
  $("#table tbody tr").each(function() {
    if ($(this).find("td:eq(0)").text() == $('#codigo').val()) {
      // Para verificar que si se corta el each
      console.log($(this).find("td:eq(0)").text());
      alert("codigo ya ingresado");
      seencontro =true;// si se encontró el valor , seteamos la bandera a true
      return false;//si funciona detiene la ejecución del each
    }
  });
  // retornamos la bandera.
  return seencontro;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="codigo" type="text"> 
<button type="button" onclick="BuscarCodigo()"> Buscar</button>
<table id="table">
  <thead>
    <tr>
      <th>Codigo</th>
      <th>Cantidad</th>
    </tr>
  </thead>
  <tbody>
    <tr id="1">
      <td>4859</td>
      <td>2</td>
    </tr>
    <tr id="2">
      <td>2568</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
    
answered by 13.11.2017 в 17:04
0

I think you're looking for the equivalent of the Array.prototype.some . The problem is that jQuery does not bring this function, but you can add it like this:

jQuery.fn.some = function(fn, thisArg) {
  var result;

  for (var i=0, iLen = this.length; i<iLen; i++) {

    if (this.hasOwnProperty(i)) {

      if (typeof thisArg == 'undefined') {
        result = fn(this[i], i, this);

      } else {
        result = fn.call(thisArg, this[i], i, this);
      }

      if (result) return true;
    }  
  }
  return false;
}

With what your code would look something like this:

jQuery.fn.some = function(fn, thisArg) {
  var result;

  for (var i=0, iLen = this.length; i<iLen; i++) {

    if (this.hasOwnProperty(i)) {

      if (typeof thisArg == 'undefined') {
        result = fn(this[i], i, this);

      } else {
        result = fn.call(thisArg, this[i], i, this);
      }

      if (result) return true;
    }  
  }
  return false;
}

function BuscarCodigo() {
  var fin = $("#table tbody tr").some(function(el) {
    if ($(el).text().lastIndexOf($('#codigo').val())!=-1) {
      return true;
    }
  });
  if(fin) {
    alert("codigo ya ingresado");
    return false;
  }
 

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input id="codigo" type="text"> 
<button type="button" onclick="BuscarCodigo()"> Buscar</button>
<table id="table">
  <thead>
    <tr>
      <th>Codigo</th>
      <th>Cantidad</th>
    </tr>
  </thead>
  <tbody>
    <tr id="1">
      <td>4859</td>
      <td>2</td>
    </tr>
    <tr id="2">
      <td>2568</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
    
answered by 13.11.2017 в 17:31