个人中心
gpt4 book ai didi

jquery - 使用 Perl 和 jQuery 回发值

转载 作者：行者123 更新时间：2023-12-01 05:51:56 24 4
gpt4 key购买 nike


我正在尝试在一个脚本中使用，一旦提交此表单，它将更新数据库并将结果回发给它自己，在同一页面上，无需刷新页面。我一直试图理解为什么一旦表单提交并且所有值都通过(我可以使用 firebug 查看所有值)，结果不会显示在页面上，如下行所示:

 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

最佳答案

我这样做了:

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">

并得到这样的文本:

提交完成后显示结果:成功用户名*923*波士顿*MA*asd*

关于jquery - 使用 Perl 和 jQuery 回发值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20890852/

24 4 0
文章推荐： python - 剥离 unicode 文本中非字符的内容
文章推荐： flutter - Auth0-如何与Flutter一起使用
文章推荐： java - 如何高效读取元数据文件？
文章推荐： python - 文本编辑+组合框+pyqt4
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com