Cześć, zastanawiam się, czy ktoś może mi pomóc.

Zebrałem Ta strona, która ma działający "klient" i "serwer" Walidacja boczna.

Teraz próbuję zrobić, to dodać odświeżanie strony i "przewiń do góry", gdy strona przeszła walidację.

Do skryptu użyty w pierwszym linku dodałem następujący kod, aby spróbować wywołać tę funkcję:

setTimeout(function() {
    $('body').fadeOut(400, function() {
        location.reload();
        setTimeout(function() {
            $('body').fadeIn(400);
        }, 500);
        window.scrollTo(x - coord, y - coord);
    });
}, 2000);

Problemem, który mam, jest to, że niezależnie od tego, czy formularz przechodzi walidacja, strona odświeża, jak widać w Ta strona. Więc pełny kod JavaScript tak wygląda:

Aktualizacja post - poprzez pracę z @rahul, mam teraz rozwiązanie robocze jak poniżej. NB musiałem tylko zmienić kod JavaScript

 <script type="text/javascript">
        jQuery(document).ready(function(){
            jQuery("#addlocation").validationEngine();
            $("#addlocation").bind("jqv.field.result", function(event, field, errorFound, prompText){ console.log(errorFound) })
        });
    </script>
<script type="text/javascript">
$(document).ready(function(){
    $('#addlocation').submit(function(){

        //check the form is not currently submitting
        if($(this).data('formstatus') !== 'submitting'){

            //setup variables
            var form = $(this),
                formData = form.serialize(),
                formUrl = form.attr('action'),
                formMethod = form.attr('method'), 
                responseMsg = $('#saverecordresponse');

            //add status data to form
            form.data('formstatus','submitting');

            //show response message - waiting
            responseMsg.hide()
                       .addClass('response-waiting')
                       .text('Please Wait...')
                       .fadeIn(200);

            //send data to server for validation
            $.ajax({
                url: formUrl,
                type: formMethod,
                data: formData,
                success:function(data){

                    //setup variables
                    var responseData = jQuery.parseJSON(data), 
                        klass = '';

                    //response conditional
                    switch(responseData.status){
                        case 'error':
                            klass = 'response-error';
                        break;
                        case 'success':
                            klass = 'response-success';
                        break;  
                    }

                    //show reponse message
                    responseMsg.fadeOut(200,function(){
                        $(this).removeClass('response-waiting')
                               .addClass(klass)
                               .text(responseData.message)
                               .fadeIn(200,function(){
                                   //set timeout to hide response message
                                   setTimeout(function(){
                                       responseMsg.fadeOut(200,function(){
                                           $(this).removeClass(klass);
                                           form.data('formstatus','idle');
                                       });
                                   },3000)
                                   if (klass=='response-success')
                               {
                                   setTimeout(function () {
                                   $('body').fadeOut(400, function () {
                                       location.reload();
                                       setTimeout(function () {
                                           $('body').fadeIn(400);
                                       }, 500);
                                       window.scrollTo(x - coord, y - coord);
                                   });
                               }, 2000);
                               }
                                });
                    });
                }
            });
        }

        //prevent form from submitting
        return false;
    });
});
</script>

I jest to wersja do obniżki (usunięłem większość reguł walidacji dla celów podglądu) kod PHP, który działa w połączeniu z JavaScript i zapisuje rekord do bazy danych MySQL.

<?php


    //sanitize data
    $userid = mysql_real_escape_string($_POST['userid']);   
    $locationname = mysql_real_escape_string($_POST['locationname']);   
    $returnedaddress = mysql_real_escape_string($_POST['returnedaddress']); 

    if(empty($locationname)){
        $status = "error";
        $message = "You need to enter a name for this location!";
    }

    else{
            $query = mysql_query("INSERT INTO `table` (userid, locationname, returnedaddress) VALUES ('$userid', '$locationname', '$returnedaddress')");  
            if($query){ //if insert is successful
                $status = "success";
                $message = "Location Saved!";   
            }
            else { //if insert fails
                $status = "error";
                $message = "I'm sorry, there has been a technical error!";  
            }

    }

    //return json response
    $data = array(
        'status' => $status,
        'message' => $message
    );

    echo json_encode($data);
    exit;
?>

Muszę przyznać, że nie jestem pewien, gdy problem leży, ale jestem pierwszym, który przyznać, że jestem trochę nowego w JavaScript i Jquery.

Zastanawiałem się tylko, czy ktoś może być w stanie spojrzeć na to proszę i daj mi znać, gdzie idę źle, a nawet może sugerować lepszą alternatywę, aby uzyskać odświeżenie strony, gdy formularz przechodzi walidacja.

1
IRHM 10 wrzesień 2012, 17:23

2 odpowiedzi

Najlepsza odpowiedź

Możesz łatwo zdobędziesz za pomocą return false

Sprawdź, czy walidacja nie została przekazana return false

if(Yourvalidation!=true)
{
return false;
}

Po tej sekcji.

 //response conditional
                    switch(responseData.status){
                        case 'error':
                            klass = 'response-error';
                        break;
                        case 'success':
                            klass = 'response-success';
                        break;  
                    }

Sprawdź wartość klassa

    responseMsg.fadeOut(200, function () {
                            $(this).removeClass('response-waiting')
                           .addClass(klass)
                           .text(responseData.message)
                           .fadeIn(200, function () {
                               //set timeout to hide response message
                               setTimeout(function () {
                                   responseMsg.fadeOut(200, function () {
                                       $(this).removeClass(klass);
                                       form.data('formstatus', 'idle');
                                   });
                               }, 3000)
                               if (klass=='response-success')
                               {
                                   setTimeout(function () {
                                   $('body').fadeOut(400, function () {
                                       location.reload();
                                       setTimeout(function () {
                                           $('body').fadeIn(400);
                                       }, 500);
                                       window.scrollTo(x - coord, y - coord);
                                   });
                               }, 2000);
                               }
                               else
                               {
                                   return false;  //use return false in else condition 
                               }
                           });
                        });
0
rahul 10 wrzesień 2012, 14:05

Możesz sprawdzić poprawność client i server, używając tego

if(Page_ClientValidate()) 
          return true;
    else 
          return false;
0
khr055 10 wrzesień 2012, 14:58