Tengo la siguiente tabla: Todos los datos aquí son dinámicos, cargados desde la base de datos.
<table> <tr class="items"> <td>Name: <input type="text" class="name" value="Steven"></td> <td>Employed: <input type="text" class="emp_stat" value="Y"></td> <td>Minimum Salary: <input type="text" class="min_sal" value="200"></td> <td>Location: <input type="text" class="country" value="USA"></td> </tr> <tr class="items"> <td>Name: <input type="text" class="name" value="John"></td> <td>Employed: <input type="text" class="emp_stat" value="N"></td> <td>Minimum Salary: <input type="text" class="min_sal" value="0"></td> <td>Location: <input type="text" class="country" value="USA"></td> </tr> <tr class="items"> <td>Name: <input type="text" class="name" value="Mark"></td> <td>Employed: <input type="text" class="emp_stat" value="Y"></td> <td>Minimum Salary: <input type="text" class="min_sal" value="200"></td> <td>Location: <input type="text" class="country" value="USA"></td> </tr> </table> <button id="btn_add">Add More</button> //will create new tr with inputs <button id="btn_save">Save</button> $('.items').each(function(){ $emp_stat= $(this).find($('.emp_stat').text()); $min_sal = $(this).find($('.min_sal').val()); if($emp_stat == 'Y' && $min_sal < 100){ alert('Min Salary must be above 100 $.'); }else{ //else do something } });Lo que quiero hacer aquí es; En todo Valor Empleado = Y, digamos que el Salario Mínimo debe ser 100 . Si alguien pone menos de cien 100 quiere dar algún tipo de ventana emergente de validación si hace clic en guardar btn y para Valor empleado = N, quiero deshabilitar las entradas de salario mínimo. ¿Cómo hacerlo? Esto está en editar/nueva página. en btn_add agregará nuevos con entradas con la misma condición.
¿Cómo hacer en Jquery?
Su selector está mal.
$(esto).find('.emp_stat').val()
$(esto).find('.min_sal').val()
esto devuelve los valores correctos.
Considera lo siguiente.
$(function() { function checkSalary(row, salary) { // Given a Row element, check if 2nd Input is "Y" and then check if Salary is less than given Salary or 100 if (salary == undefined) { salary = 100; } var result = false; if ($("td:eq(1) input", row).val() == "Y") { result = parseInt($("td:eq(2) input", row).val()) < 100; } // If less than 100, result will be false return result; } function checkAll(className) { // Assume all are correct var result = true; // Check Each Row, by given class name $(className).each(function(index, element) { var check = checkSalary(element); if (!check) { $(element).removeClass("alert"); } else { $(element).addClass("alert"); } // Combined verification // true && true = true // true && false = false result = result && check; }); return result; } $("#btn_save").click(function(event) { event.preventDefault(); return checkAll(".items"); }); }); .alert td:nth-child(3) input { border: 1px solid red; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tr class="items"> <td>Name: <input type="text" value="Steven"></td> <td>Employed: <input type="text" value="Y"></td> <td>Minimum Salary: <input type="text" value="200"></td> <td>Location: <input type="text" value="USA"></td> </tr> <tr class="items"> <td>Name: <input type="text" value="John"></td> <td>Employed: <input type="text" value="N"></td> <td>Minimum Salary: <input type="text" value="0"></td> <td>Location: <input type="text" value="USA"></td> </tr> <tr class="items"> <td>Name: <input type="text" value="Mark"></td> <td>Employed: <input type="text" value="Y"></td> <td>Minimum Salary: <input type="text" value="200"></td> <td>Location: <input type="text" value="USA"></td> </tr> </table> <button id="btn_add">Add More</button> <button id="btn_save">Save</button> Este es un ejemplo de un método de verificación de formulario simple. Utiliza .each() para iterar cada una de las filas de una tabla. Tiene una condición específica, si Empleado es "Y", entonces verifique que el Salario sea lo suficientemente alto.