Wie kann ich eine Jquery-Registerkarte beim Senden von Formularen erneut laden?

Question

Ich benutze Jquery für Ajax-Tabs, nicht jQuery UI, die mein Ajax-Tabs Dieses Code unten für meine Bedürfnisse zu groß ist, ist, lädt es die ausgewählten Registerkarte mit einer externen Datei

Ich habe auch einen für das Ajax verwendet, um Daten zu dieser Seite HOMEfriendstatus.inc.php was ist # tab2

Was ich wissen möchte, wenn ich das Formular abschicke, unabhängig davon, welche Registerkarte der Benutzer auf dem Bildschirm geladen hat, kann ich es neu laden oder zu # ändern tab2 um den aktualisierten Inhalt von # tab2 anzuzeigen?

<script type="text/javascript"> 
var pageUrl = new Array();   
pageUrl[1] = "HOMEbulletin.inc.php"; 
pageUrl[2] = "HOMEfriendstatus.inc.php"; 
pageUrl[3] = "HOMEbulletin.inc.php"; 



function loadTab(id){ 
    if (pageUrl[id].length > 0){ 
     $("#loading").show(); 
     $.ajax({url: pageUrl[id], cache: false, success: function(message) {        
      $("#tabcontent").empty().append(message); 
      $("#loading").hide();    
     } 
    });     
} 
} 

$(document).ready(function(){ 
    /*$("#tab1").addClass('selected');*/ 
    $("#loading").hide(); 
    $("#tab1").click(function(){ 
     loadTab(1); 
     $('div.HOMEtabdiv ul.HOMEtabs a').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 

    $("#tab2").click(function(){ 
     loadTab(2); 
     $('div.HOMEtabdiv ul.HOMEtabs a').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 

    $("#tab3").click(function(){ 
     loadTab(3); 
     $('div.HOMEtabdiv ul.HOMEtabs a').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 
    }); 
</script> 

Answer 1

Haben Sie versucht, loadTab(2) in der Form Erfolg Rückruf ausgeführt? Das sollte genug sein.

Sie haben nicht gezeigt, uns Ihre Codeform über AJAX für das Senden aber ich denke, so etwas wie das funktionieren sollte:

$.post('http://example.com/ajax/form', $('form').serialize(), 
    function (data, textStatus) { 
     loadTab(2); 
     $('div.HOMEtabdiv ul.HOMEtabs a').removeClass('selected'); 
     $('#tab2').addClass('selected'); 
    } 
); 

Beachten Sie, dass dies den Code für $("#tab2").click() Funktion dupliziert, so dass Sie in Betracht ziehen sollten benannte Funktion anstelle von anonym in diesem Fall und wiederverwenden es in Ajax Callback:

PS. jQuery UI ist nicht zu groß. Sie müssen nicht alle Bits davon verwenden. Sie können einfach nur Tabs Modul laden.