Ajax Load läuft nicht in Echtzeit

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Ajax Load läuft nicht in Echtzeit

    Folgendes Script holt sich die aktuelle Userliste aus der DB.
    Dies funktioniert soweit auch aber leider nicht in Echtzeit.

    Das ganze sollte sich jede Sec oder alle 2-3 aktualisieren was es aber nicht tut.

    JavaScript-Quellcode

    1. $(document).ready(function(){
    2. function showRoom(){
    3. $.ajax({
    4. type:"POST",
    5. url:"index.php?mode=userlist",
    6. data:{action:"showroom"},
    7. success:function(data){
    8. var refreshId = setInterval(function() {
    9. $("#onlinelist").html(data);
    10. }, 1000);
    11. }
    12. });
    13. }
    14. showRoom();
    15. });
    Alles anzeigen

  • JavaScript-Quellcode

    1. $(document).ready(function(){
    2. function showRoom(){
    3. $.ajax({
    4. type:"POST",
    5. url:"index.php?mode=userlist",
    6. data:{action:"showroom"},
    7. success:function(data){
    8. $("#onlinelist").html(data);
    9. }
    10. });
    11. }
    12. setInterval(function() {
    13. showRoom();
    14. }, 1000);
    15. });
    Alles anzeigen


    so müsste das ganze aussehen, oder was möchtest du mit der setInterval() in der success-Funktion erreichen?

  • Ja hat es.
    Aber nun stehe ich vor 2 weiteren Problemen

    Problem 1:
    Erst wenn ich den Absendebutton Klicke wird der Text gesendet. Drücke ich Enter läd die Seite neu. Dies sollte nicht so sein. Der Button sollte weg und Enter den Text absenden.
    Gleichzeitig sollte der Text aus dem input Feld verschwinden was er nicht tut.

    JavaScript-Quellcode

    1. <script type="text/javascript">
    2. $(document).ready(function(){
    3. $("#button").click(function(){
    4. var message=$("#message").val();
    5. $.ajax({
    6. type:"post",
    7. url:"index.php?mode=chat_send",
    8. data:"message="+message,
    9. success:function(data){
    10. showComment();
    11. }
    12. });
    13. });
    14. });
    15. </script>
    Alles anzeigen


    HTML-Quellcode

    1. <form id="message_form" action="index.php?mode=chat" method="post">
    3. <div class="form_left">
    4. <input name="message" id="message" type="text" class="input" /> <input type="button" value="Send Comment" id="button">
    5. </div>​


    Problem 2:
    Klicke ich die Smiliebox an, öffnet sich diese. Klicke ich nun auf der Seite irgendwo anders hin, sollte sich diese wieder schließen. Immoment bleibt Sie immer offen ausser ich klicke den Link zum Öffnen der Box noch mal an, dann verschwindet diese.

    JavaScript-Quellcode

    1. ​$(document).ready(function() {
    2. $('#smile p').click(function() {
    3. $('#smile-form').slideToggle(300);
    4. });
    5. }); // end ready


    HTML-Quellcode

    1. <nav id="smile">
    2. <p><img src="modules/template/images/smileys.png" alt="smileys" title="smileys"></p>
    3. <div id="smile-form">
    4. {foreach name=smilies from=$SMILIES key=sl_k item=sl_v}
    6. <img src="upload/smilies/{$sl_v.smilie_pic}" alt="{$sl_v.smilie_code}" title="" class="embtn" style="padding-left:4px;padding-bottom:2px;padding-right:4px;padding-top:2px;" />
    8. {/foreach}
    9. </div>
    10. </nav>​

  • Lösung 1 scheint nicht zu klappen. Jetzt läd er die seite immer neu, egal ob button oder enter

    JavaScript-Quellcode

    1. ​<script type="text/javascript">
    2. $(document).ready(function(){
    3. $("form").submit(function(){
    4. var message=$("#message").val();
    5. $.ajax({
    6. type:"post",
    7. url:"index.php?mode=chat_send",
    8. data:"message="+message,
    9. success:function(data){
    10. showComment();
    11. }
    12. });
    13. });
    14. });
    15. </script>
    Alles anzeigen


    Quellcode

    1. ​<form id="message_form" method="post">
    3. <div class="form_left">
    4. <input name="message" id="message" type="text" class="input" /> <input type="submit" value="Submit">
    5. </div>

  • OK. Mein English ist dafür definitiv zu Schlecht als das ich dort etwas verstehen kann.
    Ich denke ich lasse den Mist und wende mich anderen Dingen zu.

    EDIT:
    Ah

    JavaScript-Quellcode

    1. <script type="text/javascript">
    2. $(document).ready(function(){
    3. $("form").submit(function(e){
    4. var message=$("#message").val();
    5. $.ajax({
    6. type:"post",
    7. url:"index.php?mode=chat_send",
    8. data:"message="+message,
    9. success:function(data){
    10. showComment();
    11. }
    13. });
    14. e.preventDefault();
    15. });
    16. });
    17. </script>​
    Alles anzeigen

  • So, ich gebs auf. Mein English reicht dafür definitiv nicht aus.
    Evtl. sollte ich erst mal wieder die Schulbank drücken *g*

    Was solls, versuch war es Wert

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Grommel ()

  • Aufgeben nicht direkt aber evtl. 1-2 Jahr nach hinten verschieben bis ich mal bei der VHS war (In meiner Jugend war ich was English angeht recht faul)

    Es hänkt an der Smile Box.
    Öffnen klappt soweit aber wenn ich im Fenster irgendwo hin klicke soll sich das Schließen

    JavaScript-Quellcode

    1. $('#smile p').click(function() {
    2. $("#smile-form").not("*").slideUp();
    3. $('#smile-form').slideToggle(300);
    4. return false;
    6. });


    HTML-Quellcode

    1. <nav id="smile">
    2. <p><img src="modules/template/images/smileys.png" alt="smileys" title="smileys"></p>
    3. <div id="smile-form">
    4. {foreach name=smilies from=$SMILIES key=sl_k item=sl_v}
    5. <img src="upload/smilies/{$sl_v.smilie_pic}" alt="{$sl_v.smilie_code}" title="" class="embtn" style="padding-left:4px;padding-bottom:2px;padding-right:4px;padding-top:2px;" />
    6. {/foreach}
    7. </div>
    8. </nav>

  • JavaScript-Quellcode

    1. var status = 'inactive'; // startet geschlossen
    3. $('*:not(#smile p)').click(function() { // Wenn auserhalb der Smilie-Form geklickt wird ...
    5. if(status == 'active') { // ... und sie geöffnet ist
    7. $('#smile-form').slideUp();
    8. status = 'inactive';
    9. }
    10. });
    12. $('#smile p').click(function() { // Wenn das Öffnen-Icon gedrückt wird
    14. if(status == 'inactive') { // ... und die Form noch nciht sichtbar ist
    16. $('#smile-form').slideDown();
    17. status = 'active';
    18. }
    20. /* optional schließen, wenns geöffnet ist
    22. else {
    24. $('#smile-form').slideUp();
    25. status = 'inactive';
    26. }
    28. */
    29. });
    Alles anzeigen


    Das sollte seinen Zweck erfüllen. Du hast dich oben ein wenig mit dem Not und * verheddert. ;) Ich hoffe der Code ist verständlich.

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Active Record ()

  • Ah Dank dir. Klicke ich den Link zum öffnen nun allerdings an, öffnet er sich und schließt sich direkt wieder.

    Evtl. fummelt ein anderer Code dazwischen

    JavaScript-Quellcode

    1. ​{literal}
    2. <script>
    3. $(document).ready(function() {
    5. var status = 'inactive'; // startet geschlossen
    6. $('*:not(#smile p)').click(function() { // Wenn auserhalb der Smilie-Form geklickt wird ...
    8. if(status == 'active') { // ... und sie geöffnet ist
    9. $('#smile-form').slideUp();
    10. status = 'inactive';
    11. }
    12. });
    13. $('#smile p').click(function() { // Wenn das Öffnen-Icon gedrückt wird
    15. if(status == 'inactive') { // ... und die Form noch nciht sichtbar ist
    16. $('#smile-form').slideDown();
    17. status = 'active';
    18. }
    19. /* optional schließen, wenns geöffnet ist
    20. else {
    21. $('#smile-form').slideUp();
    22. status = 'inactive';
    23. }
    24. */
    25. });
    27. $('#stats p').click(function() {
    28. $('#stats-form').slideToggle(300);
    30. });
    31. // Insert Emoticon
    32. $(".embtn").click(function(event){
    33. var prevMsg = $("#message").val();
    34. var emotiText = $(event.target).attr("alt");
    35. $("#message").val(prevMsg + emotiText);
    36. });
    38. function showUser(){
    39. $.ajax({
    40. type:"POST",
    41. url:"index.php?mode=chat_userlist",
    42. data:{action:"showroom"},
    43. success:function(data){
    44. $("#onlinelist").html(data);
    45. }
    46. });
    47. }
    48. var refreshId = setInterval( function()
    49. {
    50. showUser();
    51. }, 1000);
    53. function showRoom(){
    54. $.ajax({
    55. type:"POST",
    56. url:"index.php?mode=chat_text",
    57. data:{action:"showroom"},
    58. success:function(data){
    59. $("#content").html(data);
    60. }
    61. });
    62. }
    63. var refreshId = setInterval( function()
    64. {
    65. showRoom();
    66. }, 1000);
    68. $("form").submit(function(e){
    69. var message=$("#message").val();
    70. $.ajax({
    71. type:"post",
    72. url:"index.php?mode=chat_send",
    73. data:"message="+message,
    74. success:function(data){
    75. showComment();
    76. }
    78. });
    79. e.preventDefault();
    80. });
    81. });
    82. </script>
    83. {/literal}
    Alles anzeigen

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Grommel ()

  • Moin,

    also ich habe jetzt mal ein wenig herum gespielt und komme zu keinem Ergebnis.
    Öffne ich die Smiliebox schließt sie sich sofort wieder und das inputfeld leert sich nicht nach drücken der Entertase.

    Hat da noch jemand einen Tip für mich?

  • Zu Problem 1:
    Da ich das Problem in deinem Code nicht finden konnte, hab ich das ganze neu gebaut

    JavaScript-Quellcode

    1. $(function () {
    2. $('.smiley2 .icons').hide(); // Menü verstecken
    3. $('.smiley2 p').click(function(e) { // Klick
    4. $('.smiley2 .icons').slideToggle(200); // Menü öffnen
    5. $('.clicker').toggleClass('active'); // und dem Link Klasse "active" geben
    6. e.stopPropagation();
    7. });
    8. $(document).click(function() { // Falls irgendwo außerhalb geklickt wird
    9. if ($('.smiley2 .icons').is(':visible')) { // ... und die Smileys sichtbar sind
    10. $('.smiley2 .icons', this).slideUp(); // ..., dann Menü einklappen
    11. $('.clicker').removeClass('active'); // ... und Klasse "active" wieder entfernen
    12. }
    13. });
    14. });
    Alles anzeigen


    HTML-Quellcode

    1. <div class="smiley2">
    2. <p><a href="#" class="clicker">Smileys</a></p>
    3. <div class="icons">
    4. smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley, smiley
    5. </div>
    6. </div>




    Zu Problem 2:

    JavaScript-Quellcode

    1. $("#message").val(''); // Textfeld leeren

    Einfach nach dem Ajax setzen.

    btw. der success-Parameter in Ajax ist ab der 1.8(?) deprecated, steig lieber direkt auf .done() um.