2

现在我知道我在这里有提出重复问题的风险,但是我真的不知道要搜索什么,因为我是一个完整的 AJAX jQuery 菜鸟。相信我,我已经尝试搜索我认为显而易见的东西,但没有运气,所以请放轻松。

我有一个 php wordpress 网站,默认以英镑显示价格。顶部是一个选择框onchange="this.form.submit()",允许用户更改所有报价的默认货币。

<form method="post" action="">
    <select name="ChangeCurrency" onChange="this.form.submit()">
        <option value="GBP">GBP</option>
        <option value="USD">USD</option>
        <option value="EUR">EUR</option>
    </select>
</form>

在主页上,有几个,我称之为“简码小部件”,每个都包含产品和价格表。如果您愿意,可以使用仪表板。

它目前是如何工作的(效率低下):

  1. 用户更改选择。
  2. 提交的表格
  3. 主页重新加载了所选货币的更新价格。

这不好,因为每当有人更改货币时,整个页面都会重新加载(这需要时间,在没有缓存的情况下传输大约 1mb,更不用说服务器上不必要的负载)。

我想要的(更高效):

  1. 更改选择框时,我希望异步发布更改货币会话变量的表单。
  2. 每个“简码小部件”都会一一更新,而无需重新加载整个页面。

这是jquery可以做的事情吗?我从哪说起呢?

以防万一它有什么不同,以便您明白我的意思,这里是 URL,以便您可以看到我在说什么...... http://bit.ly/10ChZys

第 2 部分: 我使用 jQuery 和 ajax 来更新 fixTable,这要归功于以下答案的混搭...我使用会话变量来存储用户的选择,这样,如果他们返回站点,将保存该选项。

我的代码有问题,因为存储在http://goldealers.co.uk/wp-content/plugins/gd/tables.php?currency=GBP&table=fixTable中的会话变量似乎与用户会话有不同的 session_id id 因为不再存储该选项。

有没有办法告诉服务器它们是同一个会话?

解决方案 我使用 Ribot 的解决方案开始,它工作并解决了最初的问题,然后扩展了 NomikOS 的解决方案......

4

3 回答 3

1

注意:这个答案显示了关于 AJAX 进程的 php 后端的一些想法。它是关于前端过程的其他答案的补充。

1.- 在 WP 中管理 AJAX 请求的模型,只是一些想法,好吗?

add_action('init', 'process_ajax_callback');

function process_ajax_callback()
{
    if ( ! $_REQUEST['go_ajax'])
    {
        return;
    }

    try
    {
        if (isset($_REQUEST['nonce_my_ajax']))
        {
            $nonce   = $_REQUEST['nonce_my_ajax'];
            if ( ! wp_verify_nonce($nonce    = $_REQUEST['nonce_my_ajax'], 'nonce_my_ajax'))
            {
                throw new Exception("Nonce token invalid."); // security
            }
        }
    }
    catch (Exception $e)
    {
        $output['result']    = false;
        $output['message']   = $e->getMessage();

        echo json_encode($output);
        exit;
    }

    $result  = true;
    $message = '';

    switch ($_REQUEST['action'])
    {
        case 'update_price':
        try
        {
            // update price
            // price value comes in $_REQUEST['price']
        }
        catch (Exception $e)
        {
            $result              = false;
            $message             = $e->getMessage();
        }
        break;      

        case 'other_actions':
        break;      
    }

    $output['result']    = $result ? true : false;
    $output['message']   = $message;

    echo json_encode($output);
    exit;
}

2.-不要忘记安全

// nonce_my_ajax is passed to javascript like this:
wp_localize_script('my_js_admin', 'myJsVars', array(
    'nonce_my_ajax'  => wp_create_nonce('nonce_my_ajax')
));

3.- 一般来说,前端所需的(与上面显示的后端模型一起使用)是这样的:

$("select[name='ChangeCurrency']").live("change", function() {
    var price = $(this).val();
    $.post(
            window.location.href,
            {
                go_ajax : 1, // parse ajax
                action : 'update_price', // what to do
                price : price, // vars to use in backend
                nonce_my_ajax : myJsVars.nonce_my_ajax // security
            },
            function(output) {
            if ( output.result == true )
                // update widgets or whatever
                // $("#my_div").html("we happy, yabadabadoo!");
                // or do nothing (AJAX action was successful)
            else
                alert(output.message)
            }, 'json');
});

4.- 您可以使用$.get()or$.post()将数据发送/处理到服务器/服务器中,但.load()在更新数据库时效果不佳,因为您无法以json响应的精度管理返回的失败消息(例如:多重验证错误消息)。仅用于.load()加载 HTML 视图。

更新:

设置session_id()正常请求和ajax请求都可以执行的位置,并尽可能在早期阶段执行。我希望你使用一个类来包装你的插件,如果不是现在是时候做它......例如:

class my_plugin {

    function __construct()
    {
        if ( ! session_id())
        {
            session_start();
        }

        add_action('init', array($this, 'process_ajax_callback'));

        // ...
    }   

    function process_ajax_callback()
    {
        // ...
    }
}

更新 2:

关于基于 nonce 的安全性:

WordPress 中可用的安全功能是“nonce”。通常,“nonce”是一种只能使用一次的令牌,通常用于防止未经授权的人代表他人提交数据。

参考: http: //myatus.com/p/wordpress-caching-and-nonce-lifespan/

在这个模型nonce_my_ajax中只是一个例子,确实它应该更独特,比如nonce_{my_plugin_name},甚至更好nonce_{my_plugin_name}_{what_action}的地方what_action代表updating user,或inserting new book,等等......

有关它的更多信息:WP Codex:WordPress Nonce ,WPtuts+:功能和 Nonce

于 2012-12-31T00:38:52.187 回答
1

是的,jQuery 可以使用 ajax 来实现。

首先,在使用ajax时,你不必发布表单来获取数据。jQuery 中的 Ajax 将加载 url 的文本数据。

您可以先给您的选择一个 id(此处为 id="changeCurrency"),然后:

$("#changeCurrency").change(function(){
    currency = $('#changeCurrency option:selected').val() // get the selected option's value
    $("#some_div").load("someurl.php?currency=" + currency);
});

现在阅读 jQuery 和 ajax,了解您需要执行哪种 ajax 调用来最适合您的需求。

于 2012-12-31T00:25:56.210 回答
-1

删除 onchange 并添加一个 ID

<select name="ChangeCurrency" id="ChangeCurrency">...

在页面上以您的基础货币为您的所有价格提供价格并输出它们

<span class="price" data-base="0.12">&pound;0.12</span>

在你的 JS 中有一个转换表

// base currency is GBP
// each currency has 0: currency symbol, 1: conversion rate
var currency={"GBP":["&pound;", 1], "USD":["&dollar;", 0.67]};
var usercurrency=currency['GBP'];

并将事件绑定到更改

$('#ChangeCurrency').on('change', function(){
    // post to the server to update it
    $.post(...);
    // set locally on the page
    usercurrency=currency[$(this).val()];
    // and change all the values
    $('.price').each(function(){
        $(this).html(usercurrency[0] + (usercurrency[1] * $(this).data('base')).toFixed(2) );
    });
}).trigger('change'); // trigger this to run on page load if you want.

我没有检查任何这段代码

于 2012-12-31T00:20:49.347 回答