2014-01-02 3 views
2


Я пытаюсь использовать в одном скрипте, что после отправки этой формы он обновит базу данных и вернет результаты к себе, на той же странице без страницы освежающий. я застрял, пытаясь понять, почему после того, как форма получает представлены и все значения получить прошло (я могу видеть все значения с помощью Firebug) результатов не показывает на странице, как в этой строке:Post back values ​​using Perl and jQuery

print "<br>Display Results once the submit gets done: *$user_name*$user_id*$city_from*$state_from*$checkin_comments*<br>"; 

Что мне не хватает. У меня есть тестовый код, который показывает, что я пытаюсь сделать:

#!/usr/bin/perl 

use strict; 
use warnings; 

use CGI; 
use Data::Dumper; 

my $q = CGI->new(); 

print $q->header(); 

my $transac = $q->param('transac') || ''; 

# Get values 

my $user_name  = $q->param('user_name')  || ''; 
my $user_id   = $q->param('userid')   || ''; 
my $city_from  = $q->param('city_from')  || ''; 
my $state_from  = $q->param('state_from')  || ''; 
my $checkin_comments = $q->param('checkin_comments') || ''; 

print "<br>Display Results once the submit gets done: *$user_name*$user_id*$city_from*$state_from*$checkin_comments*<br>"; 



if($transac eq "checkin") { 

    my $res = results(); 
    print "<br> *$res* $user_name*$user_id*$city_from*$state_from*$checkin_comments*<br>"; 

}else { 

start_html(); 

} 

sub results { 

    if ($user_name) { 

    return 'success'; 

    } else { 

    return 'error'; 

    } 

} # End sub results 


sub start_html { 

my $html_code = qq (
<?xml version="1.0" encoding="utf-8"?> 
<!DOCTYPE> 
<html> 
<head> 
<meta http-equiv="Content-type" content="application/xhtml+xml; charset=utf-8" /> 
<meta http-equiv="Content-language" content="en-gb" /> 
<title>jquery from hell</title> 
<script type="text/javascript" src="/jquery/1.10.2/jquery.min.js"></script> 
<script type="text/javascript"> 

    \$(function() { 

    \$('.reply-comment').on('click', function (e) { 

    e.preventDefault(); 

    var form = \$('.reply-form'); 

    var CommentID = \$(this).attr('id'); 

    //alert(CommentID); 

    if (form.is(':visible')) { 

    // hide it 
    form.hide(function() { 

     \$('#' + CommentID).html('<a href="" class="reply-comment" id="reply-comment-' + CommentID + '"> [ Check-In ] </a>'); 

    }); 

    }else{ 

    // show it 
    form.show(function() { 

      \$('#' + CommentID).html('<a href="" class="reply-comment" id="reply-comment-' + CommentID + '">[ Cancel ]</a>'); 

    }); 

    } 

    }); 

    }); 

</script> 
<style> 

    .reply-form { 

     display:none;   
    } 

</style> 

<script type="text/javascript" > 

    function onSuccess(data, status) { 

    data = \$.trim(data); 

    alert(data); 

    var form = \$('.reply-form'); 
    var CommentID = 1; 

    \$("form#reply-form").trigger('reset'); 

    if (data) { 

    // hide it 
    form.hide(function() { 

     \$('#' + CommentID).html('<a href="" class="reply-comment" id="reply-comment-' + CommentID + '"> [ xCheck-In ] </a>'); 

    }); 

    }else{ 

    // show it 
    form.show(function() { 

      \$('#' + CommentID).html('<a href="" class="reply-comment" id="reply-comment-' + CommentID + '">[ xCancel ]</a>'); 

    }); 

    } 
    } 

    function onError(data, status, e) { 

    alert("Sorry, there was a problem!"); 
    alert(data); 
    console.log(e); 

    } 

    \$(document).ready(function(){ 

    \$("form#reply-form").submit(function() { // reply-form is submitted 

    var formData = \$("#reply-form").serialize(); 
// alert(formData); 

\$.ajax({ 

    type: "post", 
    url: "pjtest.pl", 
    cache: false, 
    data: formData, 
    success: onSuccess, 
    error: onError 

    }); 

// return false to prevent normal browser submit and page navigation 
return false; 

}); 

}); 

</script> 

</head> 
<body bgcolor="#ffffff"> 
<table width="500" border="1" bgcolor="#ffffff" cellpadding="5" cellspacing="0"> 
       <tr> 
        <form name="postItem" action="test.pl" method="post" STYLE="margin: 0px; padding: 0px;"> 

       <td align="center" width="33%" valign="bottom"> 
        <input type="submit" id="submitLink" value="[ Post ]"> 
       </td></form> 

       <td align="center" width="34%" valign="middle"> 
        <a href="" class="reply-comment" id="1"> [ Check-In ] </a> 
       </td> 

        <form name="postItem" action="test.pl" method="post" STYLE="margin: 0px; padding: 0px;"> 

       <td align="right" width="33%" valign="bottom"> 
        <input type="submit" id="submitLink" value="[ Log out ]">&nbsp;&nbsp; 
       </td> 
        </form> 
       </tr> 
       </table> 
       <!-- Check in stuff --> 
       <div class="reply-form well"> 

       <table width="100%" border="0" bgcolor="#1A1A1A" cellpadding="5" cellspacing="0"> 
       <tr><form name="reply-form" id="reply-form" method="post" style="margin: 0px; padding: 0px;"> 
         <input id="transac" type="hidden" name="transac" value="checkin"> 
         <input id="user_name" type="hidden" name="user_name" value="theusername"> 
         <input id="userid" type="hidden" name="userid" value="923"> 
         <input id="city" name="city_from" type="hidden" value="Boston" /> 
         <input id="state" name="state_from" type="hidden" value="MA" /> 
       <td align="center"> 
         <textarea id="checkin_comments" name="checkin_comments" rows="4" cols="40" class="span10"></textarea> 
       </td> 
       <tr> 
       <td align="center"> 
         <!--input type="submit" id="submitLink" value="[ Submit ]" /--> 
         <input type="image" src="/images/check.png" alt="Submit button" width="50" height="33" class="submit" id="send_comments"> 
        </form> 

        </td> 
       </tr> 
       </table> 
</body></html>); 

print $html_code; 

#return $html_code; 

} # End start_html sub 
+0

http://perlmonks.org/?node_id=1069010 – toolic

+0

В perlmonks.org комментарии только рекомендуемые косметические изменения в коде, а не какой-либо ответ на этот вопрос, опубликованный здесь. К сожалению. – Andre

+2

Дело в том, что вы перекрестились с PerlMonks, не сказав этого в своем вопросе. Перекрестная проводка в порядке, но обычно считается вежливым, чтобы сказать людям, что вы это делаете. Кроме того, как только вы получите ответ на любом сайте, пожалуйста, обновите другой, чтобы люди не тратили время на поиск решения проблемы, которая уже решена. – ThisSuitIsBlackNot

ответ

0

Я сделал это:

my $state_from  = $q->param('state_from')  || ''; 
my $checkin_comments = $q->param('checkin_comments') || ''; 
# print "<br>Display Results once the submit gets done: *$user_name*$user_id*$city_from*$state_from*$checkin_comments*<br>"; 

и что:

if (data) { 

    // hide it 
    form.hide(function() { 

    \$('#' + CommentID).html('<a href="" class="reply-comment" id="reply-comment-' + CommentID + '"> [ xCheck-In ] </a>'); 

    }); 
    \$('#results').html(data); 

и, наконец, что:

<body bgcolor="#ffffff"> 
<br>Display Results once the submit gets done: <span id='results'></span><br> 
<table width="500" border="1" bgcolor="#ffffff" cellpadding="5" cellspacing="0"> 

и получил текст lik е, что:

Показать результаты после того, как отправить делается: успеха theusername * 923 * Boston * MA * ASD *