驗證檢查動態文本框與個人提交按鈕

我想創建類似下面的圖像。每次單擊按鈕保存時，都需要驗證文本字段（檢查它是否爲整數），向控制器發送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'); 
    } 
});

來源

2017-07-17 Daniel

嘗試使用類，而不是ID爲按鈕和文本框，並在JS選擇更改上課 – Pavan

是的，我同意@Pavan，因爲你有超過1個按鈕，所以你需要在你的視圖中提到類，因爲如果你使用id作爲JS中的選擇器，它將搜索/僅用第一個條目標識， –

@pavan謝謝！ – Daniel

做象下面這樣： -

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

來源

2017-07-17 06:13:12

謝謝！這非常有幫助！ – Daniel

@丹尼爾很高興幫助你:) :) –

驗證檢查動態文本框與個人提交按鈕

回答

相關問題