如何修改iContact注册表单,以便它不会重定向到其他页面?

时间:2012-06-16 14:14:11

标签: jquery html ajax forms

我正在尝试修改标准的iContact注册表单,有人会在网站上填写以加入邮件列表。默认情况下,代码在尝试注册后会将用户重定向到成功或错误页面。

我想要做的不是重定向用户而不是重新加载页面:如果用户成功提交表单,表单字段应该消失并且“感谢加入!”消息类型应该出现在以前表单的位置(没有页面重新加载)。

我是编程新手,但我很确定我可以用jQuery和AJAX完成这项工作。我已经尝试过乱搞它,但我以前从未使用过AJAX,所以我还没有成功。任何帮助都会非常感激。

以下是HTML页面上的表单代码(我替换了我的帐户信息):

<form method="post" action="https://app.icontact.com/icp/signup.php" name="icpsignup" id="icpsignupZZZZ" accept-charset="UTF-8" onsubmit="return verifyRequiredZZZZ();" >
<input type="hidden" name="redirect" value="http://www.yoursite.com/newsletter/accepted.html" />
<input type="hidden" name="errorredirect" value="http://www.yoursite.com/newsletter/error.html" />

<div id="SignUp">
<table width="212" class="signupframe" border="0" cellspacing="0" cellpadding="5">
<tr>
  <td width="114" align="right" valign="top">
    <font size="1" face="Arial,Helvetica, sans-serif">*</font> <font size="2">First Name:</font>
  </td>
  <td width="78" align="left">
    <input name="fields_fname" type="text" size="13" maxlength="100" />
  </td>
</tr>
<tr>
  <td valign="top" align="right">
    <font size="1" face="Arial,Helvetica, sans-serif">*</font> <font size="2">E-mail:</font>
  </td>
  <td align="left">
    <input name="fields_email" type="text" size="13" maxlength="100" />
  </td>
</tr>
<tr>
  <td colspan="2"> <font size="1">*</font><font size="2"> = Required Field</font></td>
  </tr>
<tr>
  <td colspan="2"> <input type="image" name="Submit" value="Submit"  src="../images/join-hdr.jpg" alt="Join our E-mail List" /></td>
  </tr>
</table>
<input type="hidden" name="listid" value="XXXXX" />
<input type="hidden" name="specialid:XXXXX" value="ZSMM" />
<input type="hidden" name="clientid" value="YYYYYY" />
<input type="hidden" name="formid" value="ZZZZ" />
<input type="hidden" name="reallistid" value="1" />
<input type="hidden" name="doubleopt" value="0" />
</div>
</form>
<script src="../Scripts/icontact.js" type="text/javascript"></script>

以下是表单引用的脚本代码:

var icpFormZZZZ = document.getElementById('icpsignupZZZZ');

if (document.location.protocol === "https:")

    icpFormZZZZ.action = "https://app.icontact.com/icp/signup.php";
function verifyRequired2745() {
  if (icpFormZZZZ["fields_fname"].value == "") {
    icpFormZZZZ["fields_fname"].focus();
    alert("The First Name field is required.");
return false;
  }
  if (icpFormZZZZ["fields_email"].value == "") {
    icpFormZZZZ["fields_email"].focus();
    alert("The E-mail field is required.");
    return false;
  }


return true;
}

如果您需要任何其他信息,请与我们联系。非常感谢!

1 个答案:

答案 0 :(得分:0)

我没弄明白怎么做我上面提到的问题。但是,我确实提出了一个解决方案:

从页面的最初可见部分删除表单。然后,当用户单击“加入我们的电子邮件列表”类型的图形时,我创建了一个生成的fancyBox(其中包含iframe)。然后,在用户提交fancyBox内部的表单后,它们将被重定向到成功页面,但页面将在fancyBox中生成。然后,用户可以关闭fancyBox并返回到他们所在的页面。这对我很有用,因为用户没有被重定向。

希望这对其他人也有帮助!