verander de inhoud van div na het verzenden van gegevens naar mysql

ik ben nieuw in Ajax. ik wil een data indienen met behulp van Ajax en dan de nieuwe gegevens krijgen die de oude vervangen in dezelfde div als waarvan de oude gegevens waren.

hier is de jQuery voor glijdende tab     $ (document) .ready (function() {

   //Vertical Sliding Tabs
    $('div#st_vertical').slideTabs({            
       //Options
        contentAnim: 'slideH',
        contentAnimTime: 600,
        contentEasing: 'easeInOutExpo',
        orientation: 'vertical',
        tabsAnimTime: 300                       
    });     

});

Ajax

function addhubs()
{
var group =$('#customhubs').val();
var user=$('#loginuser').val();
$.Ajax({
type:"GET",
url: 'mfrnds.php?val='+group+'&& loguser='+user,
success: function(html){ 



}
});
}

de div wil ik gegevens vervangen

      <div id="st_vertical" class="st_vertical">

    <div class="st_tabs_container">

        
        
    <div class="st_slide_container">

            
    <?php $sql=mysql_query("select * from groups"); while($ab=mysql_fetch_array($sql)) { $gpID[]=$ab['group_id']; $gp=$ab['group_id']; $gpName=$ab['group_name']; ?>
  • <?php echo $gpName;?>
  • <?php } ?>
                       


        </div> <!-- /.st_slide_container -->

    </div> <!-- /.st_tabs_container -->            

and the mfrnds.php of the Ajax call file contains query to update the new data.

    $user=$_GET['loguser'];
    $group=$_GET['val'];
    $sql=mysql_query("insert into groups (group_name) values ('$group')");

how can i update the div in the above . plz help me .m stuck badly luking for solution from 4 days. thanks

0
wanneer ik op de submit-knop klik, activeert het de functie addhubs() en worden de waarden en de groep en gebruiker doorgegeven aan mfrnds.php. dan wil ik dat de div de nieuwe gegevens uit de database laadt ter vervanging van de oude.
toegevoegd de auteur Sakshi Sharma, de bron

2 antwoord

Note that in your addhubs function you should only add one & in your url and concatenate everything without spaces in between such as below.

Wanneer de ajax-oproep is voltooid, wordt de inhoud van de gevraagde pagina (mfrnds.php) geretourneerd in de html-variabele. U kunt dus gewoon de gewenste div kiezen en de html invoeren zoals u hieronder kunt zien. Hier gaan we...:

Uw pagina

<html>
<body>
     <script>
          $(document).ready(function() { 
              setupTabs(); 
          }); 

         function setupTabs() {
              //Vertical Sliding Tabs     
               $('div#st_vertical').slideTabs({  
                   //Options         
                    contentAnim: 'slideH',         
                    contentAnimTime: 600,         
                    contentEasing: 'easeInOutExpo',         
                    orientation: 'vertical',         
                    tabsAnimTime: 300                            
               });   
          }

          function addhubs() {
              var group = $('#customhubs').val();
              var user = $('#loginuser').val();

              $.ajax({
                  type:"GET",
                  url: 'mfrnds.php?val=' + group + '&loguser=' + user,
                  success: function(html) { 
                      //Get div and display the data in there
                      $('div.st_slide_container).html(html);

                      //As your slide effect is gone after you updated this HTML, redo your slide effect:
                      setupTabs();

                  }
              });
          }

     </script>

     <!-- Vertical div -->
     <div id="st_vertical" class="st_vertical"> 
          <div class="st_tabs_container">          
                        
                    
               <div class="st_slide_container"> 

                    
    <?php $sql = mysql_query("select * from groups"); while($ab = mysql_fetch_assoc($sql)) { $gp = $ab['group_id']; $gpName = $ab['group_name']; ?>
  • <?php echo $gpName;?>
  • <?php } ?>
               </div> <!-- /st_slide_container -->
          </div> <!-- /st_tabs_container -->
     </div> <!-- /st_vertical -->
</body>
</html>

Dus in je mfrnds.php moet je een PHP-script hebben dat de val en loguser GET-variabelen gebruikt en de database bijwerkt. Nadat de database is bijgewerkt, moet u de bijgewerkte HTML als volgt retourneren:

*mfrnds.php

<?php
       $user = $_GET['loguser'];     
       $group = $_GET['val'];     
       $sql = mysql_query("insert into groups (group_name) values ('$group')");     ?>

              
    <?php $sql = mysql_query("select * from groups"); while($ab = mysql_fetch_assoc($sql)) { $gp = $ab['group_id']; $gpName = $ab['group_name']; ?>
  • <?php echo $gpName;?>
  • <?php } ?>

Merk echter op dat deze code in principe als voorbeeld is bedoeld, ik weet niet wat je precies wilt doen in mfrnds.php enz., Maar ik hoop dat dit je een goed idee geeft!

0
toegevoegd
Je moet gewoon je "dia-effect" opnieuw uitvoeren omdat het verloren is gegaan nadat de HTML is gewijzigd. Dus start het opnieuw nadat u de HTML hebt bijgewerkt. Ik heb mijn antwoord bewerkt, maar ik weet niet precies waar en waar uw tabbladen precies zijn, dus ik weet zeker dat u die regel kunt bewerken om deze te laten werken.
toegevoegd de auteur Jules, de bron
Ik heb mijn antwoord bewerkt. Neem een ​​kijkje, maak een aantal aanpassingen en probeer het eens. In principe laadt u de pagina en stelt u de tabbladen in via setupTabs() . Als u uw formulier indient (heeft die HTML-code niet toegevoegd), gaat u naar addmubs() waar u het verzoek indient bij mfrnds.php . Deze pagina voegt een rij in en maakt een nieuwe lijst met items op basis van de nieuwe records. Het wordt geretourneerd in de succes -functie, waar u de gegevens in uw html plakt. Hierna start u de tabbladen opnieuw door opnieuw setupTabs() aan te roepen. En het zou moeten werken.
toegevoegd de auteur Jules, de bron
Ik kan de bestanden die je op je "localhost" hebt gehost niet zien, dus op je eigen computer. Je zou ze ergens moeten uploaden. Ik heb net gemerkt dat je mysql_fetch_array aan het doen bent in plaats van mysql_fetch_assoc. Bewerk mijn antwoord en probeer het opnieuw. \
toegevoegd de auteur Jules, de bron
Oh, sorry voor dat. Ik gebruik meestal <? = Omdat het een stuk korter is, dus ik ben eraan gewend. Maar inderdaad, niet voor alle servers is dit ingeschakeld. Vink alsjeblieft mijn antwoord aan en stem het in en ik ben blij dat ik je heb geholpen! :)
toegevoegd de auteur Jules, de bron
ik probeerde waht u jules zei maar het stopt mijn jQuery dia-effect op de tabbladen die ik de div van heb vernieuwd. kan een ander idee worden voorgesteld, plz
toegevoegd de auteur Sakshi Sharma, de bron
Het werkt niet goed. kan je me helpen als ik je mijn bestand mail? ik heb het echt heel slecht gedaan
toegevoegd de auteur Sakshi Sharma, de bron
Ik heb geprobeerd wat je zei, maar het werkte nog steeds niet, m sorry, ik ben je erg aan het storen, maar ik zit hier nu echt vanaf 5 dagen vast. Ik heb de glijdende div en de jQuery toegevoegd die het activeert. kun je er nu lol over doen en een antwoord voorstellen? dank je
toegevoegd de auteur Sakshi Sharma, de bron
OMG jules, mijn vriend, heel erg bedankt voor het helpen. het werkte als een charme. eindelijk na 5 dagen kan ik dit voltooien. alles dankzij jou, dank je. vertel me als er ooit hulp nodig ooit. ik ben een zeer goede ontwerper. ik zal je graag helpen.
toegevoegd de auteur Sakshi Sharma, de bron
je gebruikte
toegevoegd de auteur Sakshi Sharma, de bron
Ik heb het vriend getikt. en je gaf me een klassiek idee om de groepen tegelijkertijd te verwijderen en de nieuwe inhoud te laden. HA HA. dank je ,
toegevoegd de auteur Sakshi Sharma, de bron

Het lijkt erop dat je er bijna bent.

Voeg in je mfrnds.php-bestand een regel toe om de bijgewerkte rijen te pakken

gebruik:

pseudocode

"SELECT * FROM groepen"

for each row in groups
  echo "<div> groups.name groups.category 

en dan in je callback-functie

success: function(html){ 

   $('.st_tabs').html(html);  //replace the html of the sttabs div with the html echoed out from mfrnds.php

}
0
toegevoegd
dank u voor het helpen me uit frnd maar het stopt mijn jqery dia-effect op de tabbladen in de div die ik wil vernieuwen met het toevoegen van nieuwe namen aan meer tabbladen. kan nog iets anders dat u zou kunnen voorstellen.
toegevoegd de auteur Sakshi Sharma, de bron
Het werkt niet goed. kan je me helpen als ik je mijn bestand mail? ik heb het echt heel slecht gedaan
toegevoegd de auteur Sakshi Sharma, de bron
Ja, je moet de schuifregelaar op die div opnieuw initialiseren door deze regel terug te nemen: $ ('. St_tabs'.). Slider ();
toegevoegd de auteur jakx, de bron