0

最も一般的な種類の例のように見えますが、私がやろうとしていることとまったく同じ例を見つけることができないようです. バックエンドに JSP を使用しており、タブがクリックされるたびに検証のためにデータベースにアクセスしています。5 つのタブがあり、それぞれにフォームがあり、これはこれらのフォームの情報を編集するためのものであるため、テキスト フィールドは既に入力されています。編集されている場合は、これらのフィールドの情報を検証する必要があります。すでに - タブがクリックされたときはいつでも、情報が正しくない場合、ユーザーは先に進むことができません。ここで注意が必要なのは、ユーザーは 5 つのタブのいずれかをクリックすることができ、ユーザーがタブをナビゲートするときに従わなければならない特定の順序がないことです。そして、それが私の問題を抱えているところです。これが私のコードです：

$(function() {
    $("#tabs").tabs({
    select: function(event, ui) {
    var $emptabs = $('#tabs').tabs();
    var selected = $emptabs.tabs('option', 'selected');
    //$('#tabs-' + selected).on('focusout', function() {
    //tabChange();
    alert('validating tab ' + ui.index);
    }
    });
    var firstName = $("#firstname").val();
    var middleInitial = $("#middleinitial").val();
    var lastName = $("#lastname").val();
    var suffix = $("#suffix").val();
    var gender = $("#gender").val();
    var dob = $("#dob").val();
    var ssn1 = $("#ssn1").val();
    var ssn2 = $("#ssn2").val();
    var ssn3 = $("#ssn3").val();
    var password1 = $("#password1").val();
    var password2 = $("#password2").val();
    var mrtlStsCd = $("#mrtlstscd").val();
    var strAddr1 = $("#straddr1").val();
    var strAddr2 = $("#straddr2").val();
    var city = $("#city").val();
    var state = $("#state").val();
    var zipCode = $("#zipcode").val();
    var zipPls4= $("#zippls4").val();
    var country = $("#country").val();
    var hmPhone = $("#hmphone").val();
    var cellPhone = $("#cellphone").val();

    $.ajax({
        async : "false",
        type: "POST", 
        url: "http://localhost/test/ActionServlet",
        data: { firstname: firstName, middleinitial: middleInitial, lastname: lastName, suffix: suffix, empgender: gender, dob: dob, ssn1: ssn1, ssn2: ssn2, 
                ssn3: ssn3, password1: password1, password2: password2, mrtlstscd: mrtlStsCd, straddr1: strAddr1, straddr2: strAddr2, city: city, state: state, zipcode: zipCode, zippls4: zipPls4, 
                country: country, hmphone: hmPhone, cellphone: cellPhone, step:1 },
        success: function(data) {
            var xmlDoc = null;

            if (window.DOMParser)
            {
               parser = new DOMParser();
               xmlDoc = parser.parseFromString(data,"text/xml");
            }
            else // Internet Explorer
            {
               xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
               xmlDoc.async = false;
               xmlDoc.loadXML(data); 
            }

            var status = xmlDoc.getElementsByTagName("status")[0].childNodes[0].nodeValue;

            if (status == "ok")
            {
                var nextPageID = xmlDoc.getElementsByTagName("nextpageid")[0].childNodes[0].nodeValue;
                 alert('valid');
                $('#personalmessage').hide();
                $emptabs.tabs('select', selected+1);
            }
            else if (status == "errors")
            {
                alert('not valid');
                var errorElements = xmlDoc.getElementsByTagName("error");
                var errors = "";

                for (var x= 0; x < errorElements.length; x++) 
                {
                    errors += errorElements[x].childNodes[0].nodeValue + "<br>";
                }

                $('#personalmessage').show();
                $("h2").html(errors);   
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            $('#personalmessage').show();
            $("h2").html(errorThrown);  
        }
    });
});
4

1 に答える 1

0

誰も私の質問に答えなかったので、ここで開発者に助けてもらいました。ここにいる誰も答えを知らなかったか、答えたくないだけだったと思います。いずれにせよ、私は私の解決策を共有するのに十分親切です. 親ページでは、タブ スクリプトは次のようになります。

var $prevseltab = 0;
var $tabfuncs = {};
var $preventDefault;
var $bindTabs;
$(function() {
    $("#tabs").tabs();

    $preventDefault = function(e){
        e.preventDefault();
    }

    $bindTabs = function(){
        $("#tabs").bind("tabsselect", function(e, tab) {
            $tabfuncs[$prevseltab](e,tab.index);
            return false;
        });
    };

    $bindTabs();    
});

子ページでは、次のようになります。

$tabfuncs[0] = function(e,currtab) {

    var firstName = $("#firstname").val();
    var middleInitial = $("#middleinitial").val();

    $.ajax({
        async : "false",
        type: "POST", 
        url: "http://localhost/test/ActionServlet",
        data: { firstname: firstName, middleinitial: middleInitial, step:1 },
        success: function(data) {
            var xmlDoc = null;

            if (window.DOMParser)
            {
               parser = new DOMParser();
               xmlDoc = parser.parseFromString(data,"text/xml");
            }
            else // Internet Explorer
            {
               xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
               xmlDoc.async = false;
               xmlDoc.loadXML(data); 
            }

            var status = xmlDoc.getElementsByTagName("status")[0].childNodes[0].nodeValue;

            if (status == "ok")
            {
                 $('#personalmessage').hide();

                 var $emptabs = $('#tabs').tabs();
                 $emptabs.unbind("tabsselect");
                 $prevseltab = currtab;
                 $emptabs.tabs('select', currtab);
                 $bindTabs();
                 return true;
            }
            else if (status == "errors")
            {
                var errorElements = xmlDoc.getElementsByTagName("error");
                var errors = "";

                for (var x= 0; x < errorElements.length; x++) 
                {
                    errors += errorElements[x].childNodes[0].nodeValue + "<br>";
                }

                $('#personalmessage').show();
                $("h2").html(errors);   
                e.preventDefault();
                return false;
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            $('#personalmessage').show();
            $("h2").html(errorThrown);  
            return false;
        }
    });
};

$(function() {
    $('#tabs').on('click', '#submit1', function() {
        $tabfuncs[0]();
    });
});
于 2013-01-25T20:22:22.533 に答える