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

时间:2017-07-17 05:54:47

标签: jquery ruby-on-rails ruby ajax simple-form

我正在尝试创建类似下图的内容。 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');
  }
});

1 个答案:

答案 0 :(得分:2)

如下所示: -

$('#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');
        }
    });
});

或者您可以在要检查的输入框中添加公共类,然后执行以下操作: -

$('#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;
    }
});