验证检查带有单独提交按钮的动态文本框

Question

我正在尝试创建如下图所示的内容。 Each section is dynamically generated using simple-form

每次单击保存按钮时，都需要验证文本字段（检查它是否为整数），向控制器发送 ajax 而不是重定向到任何页面。我编写的代码只能检查第一个字段，但无法检查其余字段。如何使每个按钮只检查/提交相应文本框的 ajax？这是我的代码

- @students.each do |student|
  .same-category
    .collapsible-container
      .collapsible-head
        .wrap
          .index
            h1 = student.register_no
          .name
            h3 = student.name
          .grade
            h1 U
            h5 x20.21
          .arrow
            #arrow-toggle =image_tag('arrow.svg', class: ['arrow-down', 'test'])

        .collapsible-body
          .wrap-content
            .station-grade A: <12.01s
            .station-grade B: 12.01 - 13.11
            .station-grade C: 13.11 - 14.11
            .station-grade D: 14.21 - 15.11
            .station-grade E: 15.31 - 16.51

          .score-input
            = f.input '#', label: false, wrapper: false, input_html: { class: ['result-entry-textbox'], value: @station_score }
            button#result-entry-save.result-save-button SAVE

JQuery

$('#result-entry-save').click(function() {
    var checkIsNum = /^\d+$/.test('#result-entry-textbox');
    if(isNaN(checkIsNum)) {
      alert('not num');
    } else {
      alert('is num');
  }
});

Answer 1

按如下操作：-

$('#result-entry-save').click(function() {
    $('input[type="textbox"]').each(function(){ 
        var checkIsNum = /^\d+$/.test($(this));
        if(isNaN(checkIsNum)) {
          alert('not num');
        } else {
          alert('is num');
        }
    });
});

或者您可以在要检查的输入框中添加常见的 class，然后执行以下操作：-

$('#result-entry-save').click(function() {
    $('.common-class-name').each(function(){ 
        var checkIsNum = /^\d+$/.test($(this));
        if(isNaN(checkIsNum)) {
          alert('not num');
        } else {
          alert('is num');
        }
  });
});

注意：- 您可以像下面这样在单个警报中显示多个警报，而不是显示多个警报：-

$('#result-entry-save').click(function() {
    var checkval = true;
    $('input[type="textbox"]').each(function(){ 
        var checkIsNum = /^\d+$/.test($(this));
        if(isNaN(checkIsNum)) {
           checkval = false;
        } else {
          checkval = true;
        }
    });
    if(checkval == false){
        alert("some input fields have non-integer value.Check and correct!");return false;
    }
});

验证检查带有单独提交按钮的动态文本框

Validation Check for dynamic textbox with individual submit button

ruby

ajax

jquery

ruby-on-rails

simple-form