обновление тега div после отправки формы - ajax (jquery) - PullRequest
1 голос
/ 18 июня 2011

У меня странная проблема, которую мне не удалось решить, что бы я ни пытался. Один раздел кода ajax успешно обновляет тег div после отправки формы - exibit № 1, в то время как другой идентичный раздел кода почему-то не хочет обновлять тот же тег div - exibit № 2.

Единственное отличие состоит в том, что форма, представленная для выставки № 1, находится в том же файле (monpanel.php), в котором также находится div, который нуждается в обновлении, тогда как форма, которая обращается к экспозиции № 2, находится в другой файл (monform.php) и пытается обновить тот же div, присутствующий в monpanel.php.

Переменная uid2 передается в файл .js, и этот раздел кода успешно (оповещение выводит правильный номер uid), как показывают оповещения, даже доходит до оповещения об успехе, но div STILL не обновляет Как расстраивает :)

В monpanel.php это

<input type="hidden" id="hidUid2" value="<?php echo (intval($uid_form)); ?>"/>

вызов для установки переменной uid в файл .js (validate.js), в котором лежат обе эти функции для обработки форм и обновления тега div. В monform.php это похоже:

<input type="hidden" id="hidUid" value="<?php echo (intval($uid)); ?>"/>

Вот файл validate.js (exibit № 1 вверху, exibit № 2 внизу):

     // Exibit no.1
 $(function() {  

   $(".button").click(function() {  
     // validate and process form here  

     $('.error').hide();  
       var domain = $("input#domain").val();  
        if (domain == "") {  
       $("label#domain_error").show();  
       $("input#domain").focus();  
       return false;  
     }  
        var com_domain = $("input#com_domain").val();  
         if (com_domain == "") {  
       $("label#com_domain_error").show();  
       $("input#com_domain").focus();  
       return false;  
     }  
        var cemail = $("input#cemail").val();
        var port = $("select#port").val();
        var active = $("input#active").val();
        var uid = $("input#uid").val();
        var main = $("select#main").val();

     var dataString = 'cemail='+ cemail + '&domain=' + domain + '&com_domain=' + com_domain + '&active=' + active + '&main=' + main + '&port=' + port;  
     //alert (dataString);return false;  
     $.ajax({  
       type: "POST",  
       url: "user_add.php",  
       data: dataString,  
       success: function() {  
         $('#monitor_form').append("<div id='message'></div>"); 
         $('#monitor_form form')[0].reset();
         $('#message').html("<img id='checkmark' src='images/tick.png' /><b> Monitor sucessfully added!</b>")  
         .hide()  
         .fadeIn(500, function() {  
           $('#message').append("");  
         });
         setTimeout("$('#message').hide().remove();", 6000);

         var dataString2 = 'ajax=1&uid=' + uid;
         $.ajax({
             type: "GET",
             url: "monpanel.php",
             data: dataString2,
             success: function(html_data){
                $('#list_monitors').html(html_data);
            }
         });
         //document.onkeydown = showDown;
       }  
     });  
     return false; 
   });  
 }); 

function showDown(evt) {
    event = (evt)? evt : ((event)? event : null);
    if (evt) {
        if (event.keyCode == 8 && (event.srcElement.type!= "text" && event.srcElement.type!= "textarea" && event.srcElement.type!= "password")) {
            // When backspace is pressed but not in form element
            cancelKey(evt);
        }
        else if (event.keyCode == 116) {
            // When F5 is pressed
            cancelKey(evt);
        }
        else if (event.keyCode == 122) {
            // When F11 is pressed
            cancelKey(evt);
        }
        else if (event.ctrlKey && (event.keyCode == 78 || event.keyCode == 82)) {
            // When ctrl is pressed with R or N
            cancelKey(evt);
        }
        else if (event.altKey && event.keyCode==37 ) {
            // stop Alt left cursor
            return false;
        }
    }
} 

function cancelKey(evt) {
    if (evt.preventDefault) {
        evt.preventDefault();
        return false;
    }
    else {
        evt.keyCode = 0;
        evt.returnValue = false;
    }
}

/*function mycallbackfunc(v,m,f) {
    if (v == 'Cancel') {
        $.prompt('The action was ' + v + 'ed');
    }
    else {
        $.prompt('Monitor ' + v + 'd successfully');
    }
}*/

// ask for validation on monitor delete, pause, resume request
/*$(function() {  

   $(".button2").click(function() {  
     // validate and process form here  

     $('.error').hide();  
       var act = $("input#act").val();  
        if (act == "") {  
       //$("label#domain_error").show();  
       //$("input#domain").focus();  
       return false;  
     }  
        var uid = $("input#uid").val();  
         if (uid == "") {  
       //$("label#com_domain_error").show();  
       //$("input#com_domain").focus();  
       return false;  
     }  
        var sid = $("input#sid").val();  
         if (sid == "") {  
       //$("label#com_domain_error").show();  
       //$("input#com_domain").focus();  
       return false;  
     }  

     var dataStringDpr = 'cemail='+ cemail + '&domain=' + domain + '&com_domain=' + com_domain + '&active=' + active + '&main=' + main + '&port=' + port;  
     //alert (dataString);return false;  
   });  
 }); 
*/

// Exibit no.2
$(document).ready(function(){
   $(".error").hide();  

   //alert("Stage 0! -> uid="+muid.toString());
   $("#mondelpau").validate({
        debug: false,
        rules: {
            act: "required",
            uid: "required",
            sid: "required"
        },
        //messages: {
            //name: "Please let us know who you are.",
            //email: "A valid email will help us get in touch with you.",
        //},
        submitHandler: function(form) {
            // do other stuff for a valid form
            //$.post('delpaures.php', $("#mondelpau").serialize(), 
            //alert("Stage 1! -> uid="+muid.toString());
            $.ajax({
              async: false,
              type: "POST",
              url: "delpaures.php",
              data: $("#mondelpau").serialize(),
              success: function(data) {
                $('#monadiv').html(data);  
                 //$('#results').html(data);
                 //alert (data);return false;

                 // refresh the monitor list div

                //$('#list_monitors').load(dataString8);


                //var dataString8 = 'ajax=1&uid=' + $("input#uid").val();
                var uid2 = $("#hidUid2").val();
                alert("Test -> uid="+uid2.toString());

                var dataString9 = 'ajax=1&uid=' + uid2;
                 $.ajax({
                     type: "GET",
                     url: "monpanel.php",
                     data: dataString9,
                     success: function(html_data){
                        alert("Before refresh!");
                        $('#list_monitors').html(html_data);
                        alert("Success!");
                    }
                 });



                /*var dataString8 = 'ajax=1&uid=' + uid; // .val()
                //var dataString8 = 'ajax=1&uid=19';
                //alert("Stage 2! -> uid="+muid.toString());
                $.ajax({
                  async: false,
                  type: "GET",
                  dataType: "html",
                  url: "monpanel.php",
                  data: dataString8,
                  success: function(html_data){
                    alert("Stage 3!");
                    $("#list_monitors").css("background-color","#FF0000");
                    $("#list_monitors").html(html_data);
                    alert("Success!");
                  }
                }); */
              }   
            });
            //return false; 
        }
    });
});

1 Ответ

2 голосов
/ 20 июня 2011

Если ваш

alert("Success!");

правильно вызывается, я думаю, что селектор, который вы используете:

$('#list_monitors').html(html_data);

Возвращает 0 элементов, поэтому HTML никогда не добавляется.

Я не могу проверить это для вас, не увидев ваш HTML-код, но в этой функции успеха попробуйте увидеть, если $ ('# list_monitors'). Length> 0. Если это не так, то проблема в вашей разметке / Селектор jquery.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...