Question

当我使用mootools从HTML选择器框中选择一个选项时，我试图触发异步JSON请求。

我有以下表单元素：

<form method="post" id="sel">
 <select id = "_selecor_id" size=3>
   <option value = "value_a" id = "option_a">OptionA</option>
   <option value = "value_b" id = "option_b">OptionB</option>
 </select>
<p id="response"></p>
</form>

我正在使用以下javascriipt / mootools发送带有表单信息的JSON请求

window.addEvent('domready', function()
{

$('_selecor_id').addEvent('click', function(){

    new Request.JSON({
    url: "my_php_script.php",
    onSuccess: function(response)
    {
      $('response').set('html', response.params)
    }
  }).get($('sel'));
})
});

到以下php脚本

$result['params'] = $_GET;
echo json_encode($result);

然而，我在Chrome的开发者工具中告诉我'无法读取属性“params”of null' 我不明白为什么请求在这里应该是'null'。任何想法将不胜感激

Answer 1

嘿，你的问题的答案就在于问题本身。

您点击选择时触发事件，就像您说“选择一个选项”

一样

点击选择会出错，但是如果点击一个选项，在选择你要查找的是onChange事件，代码如下：

<强> HTML

// Notice no form tag needed unless you are serializing other items
<select id = "_selecor_id" size=3>
    <option value = "value_a" id = "option_a">OptionA</option>
    <option value = "value_b" id = "option_b">OptionB</option>
</select>
<p id="response"></p>

<强> JAVASCRIPT

window.addEvent('domready', function(){
    $('_selecor_id').addEvent('change', function(){
        new Request.JSON({ // This must return a valid json object
            url: "my_php_script.php",
            data: {
                'value': this.get('value')
            }
            onSuccess: function(responseJSON, responseText){
                $('response').set('html',responseJSON.params);
            }
        }).send();
    })
});

<强> PHP

$result['params'] = isset($_GET['value']) ? $_GET['value'] : 'Not Set';
echo json_encode($result);

responseJson变量现在包含类似{“params”：“value_b”}

的内容

Answer 2

试试这段代码：

window.addEvent('domready', function(){
    $('_selecor_id').addEvent('click', function(){
        new Request.JSON({
            url: "my_php_script.php",
            onSuccess: function(response){
                $('response').set('html',(response || this.response || this.responseText || {params: ''}).params)
            }
        }).get($('sel'));
    })
});

使用Mootools从选择器框中的“click”事件触发JSON请求

2 个答案: