4

午後、私は PHP、HTML5、および Bootstrap を使用しています。5 つのタブで区切られたフォームを作成しました。このフォーム内には、いくつかの必須フィールドがあります。必須のすべての入力フィールドは「テキスト」であり、required="required" aria-required="true" でマークされています。

送信時に、現在のタブにある場合はhtml5検証でエラーがキャッチされますが、jqueryを少し使用して、入力されていない正しいタブと入力フィールドに戻り、アラートボックスを表示したいと思います。これが可能かどうかはわかりません..

どちらにしても、タブがタブ変更の必須フィールドであることを確認する方が簡単であれば..

ページには 1 つのフォームしかありません。

どうもありがとう

**編集**いじくり回した後、必須フィールドのアラート機能を作成しましたが、タブを変更して必須フィールドにフォーカスすることはまだありません。「productbutton」は、フォーム全体の送信ボタンの ID です。「product_form」は私のフォームのIDです。

$('#productbutton').click(function(){
var error = 0;
var msg = 'An Error Has Occured.\n\nRequired Fields missed are :\n';
$(':input[required]', '#product_form').each(function(){
    $(this).css('border','2px solid green');
    if($(this).val() == ''){
        msg += '\n' + $(this).attr('id') + ' Is A Required Field..';
        $(this).css('border','2px solid red');
        if(error == 0){ $(this).focus(); }
        error = 1;
    }
});
if(error == 1) {
    alert(msg);
    return false;
} else {
    return true;
}
});

基本的に、エラー = 1 の場合、入力 ID が欠落しているエラー メッセージがポップアップ表示されます。その後、フォームの送信に失敗し、false が返されます。見逃したフィールドに焦点を当て、フィールドの周りに赤い境界線を配置します。しかし、それはタブに焦点を当てていません..そうでなければ、フォームを送信します。

4

3 に答える 3