如何在不刷新的情況下使用 Ajax 提交 poMMo 郵件列表表單？

Question

我在這里搜索了執行此操作的方法，但只詢問了簡單的 Ajax 提交 forms。

如果有人不熟悉 poMMo，它是一個郵件列表管理軟件，它允許開發人員在網站上實現自定義 forms，其唯一目的是為郵件列表收集電子郵件。 是否可以將 Ajax 和 poMMo forms 合並在一起？

我一直在使用的代碼是：

測試.php

<form action='_test.php' method='post' class='ajaxform'>
<input type='text' name='txt' value='Enter e-mail address'>
<input type='submit' value='submit'>
</form>
</head>


<div id='testDiv'></div>

_test.php

<?php
  $arr = array( 'testDiv' => $_POST['txt'] );
  echo json_encode( $arr ); 
?>

js文件.js

jQuery(document).ready(function(){

jQuery('.ajaxform').submit( function() {

    $.ajax({
        url     : $(this).attr('action'),
        type    : $(this).attr('method'),
        dataType: 'json',
        data    : $(this).serialize(),
        success : function( data ) {
                    for(var id in data) {
                        jQuery('#' + id).html( data[id] );
                    }
                  }
    });

    return false;
});

});

我會經常回來回答任何問題，並為任何願意提供幫助的人提供信息。 謝謝，麻煩您了。 :)

Answer 1

這是我創建的代碼：

<form action="" name="signup">
<fieldset>
<legend>Subscribe</legend>
<div>
<label for="email"><strong>Your Email:</strong></label>
<input type="text" name="Email" id="email" maxlength="60" />
</div>
</fieldset>
<div id="buttons">
<input type="hidden" id="pommo_signup" name="pommo_signup" value="true" />
<input type="submit" class="button" value="Subscribe" />
</div>
</form>

// JavaScript Document
$(document).ready(function() {
$('.button').click(function() {
    var email = $("input#email").val();
    var pommo_signup = $("input#pommo_signup").val();

    var data = 'Email='+ email + '&pommo_signup='+ pommo_signup;

    $.ajax({
        type: 'POST',
        url: 'http://localhost/pommo/user/process.php',
        data: data,
        dataType: 'json',
        success: function(json){                
            if (!json.success){
                alert(json.errors);             
            } else { 
                $("form").html("<div id='message'></div>");
                $('#message').html('<h2>Subscription Received!')
                .append("<p>We will be in touch soon.</p>")
                .hide()
                .fadeIn(1500);
            }
        },
        error: function(json){
        }
    });
    return false;
});    
});

您還需要將此添加到您的 PoMMo process.php 文件中，以便從請求中獲取 JSON 數據：

/**********************************
JSON OUTPUT INITIALIZATION
 *********************************/
Pommo::requireOnce($pommo->_baseDir.'inc/classes/json.php');
$json = new PommoJSON();

I put my main error messages in the validation part of the process.php by calling the fail method in the json.php file which is located in the /inc/classes/json.php:

/**********************************
VALIDATE INPUT
 *********************************/

if (empty ($_POST['pommo_signup']))
Pommo::redirect('login.php');

$subscriber = array(
'email' => $_POST['Email'],
'registered' => time(),
'ip' => $_SERVER['REMOTE_ADDR'],
'status' => 1,
'data' => @$_POST['d'],
);
// ** check for correct email syntax
if (!PommoHelper::isEmail($subscriber['email'])){
$json->fail(Pommo::_T('Invalid e-mail address. Please try again.'));
}
// ** check if email already exists in DB ("duplicates are bad..")
if (PommoHelper::isDupe($subscriber['email'])) {
$json->fail(Pommo::_T('Error the email already exists in the database.'));
}

最后，在將 email 發送給用戶之后，我將成功消息放在 process.php 的添加訂閱者部分中：

如果訂閱需要確認：

    // send confirmation message.
    if (PommoHelperMessages::sendMessage(array('to' => $subscriber['email'], 'code' => $subscriber['pending_code'], 'type' => 'confirm'))) {
        $subscriber['registered'] = date("F j, Y, g:i a",$subscriber['registered']);
        if ($comments || isset($notices['pending']) && $notices['pending'] == 'on')
            PommoHelperMessages::notify($notices, $subscriber, 'pending', $comments);

        $json->success(Pommo::_T('Subscription request received.'));
        if ($config['site_confirm'])
            Pommo::redirect($config['site_confirm']);
    }

如果沒有，這里也在這里......

else {

    // send/print welcome message
    PommoHelperMessages::sendMessage(array('to' => $subscriber['email'], 'type' => 'subscribe'));

    $subscriber['registered'] = date("F j, Y, g:i a",$subscriber['registered']);
    if ($comments || isset($notices['subscribe']) && $notices['subscribe'] == 'on')
        PommoHelperMessages::notify($notices, $subscriber, 'subscribe',$comments);

    $json->success(Pommo::_T('Subscription request received.'));

    // redirect
    if ($config['site_success'])
        Pommo::redirect($config['site_success']);
}

我最終沒有使用成功消息，但是，您需要運行成功方法將其變為真而不是假，否則 json.success 永遠不會是假的。

讓我知道這是否有幫助！