如何使用MooTools將表單數據轉換為對象

Question

我想將整個數據形式轉換為javascript對象。

<form id='myform'>
   <input type='text' name='field1' value='foo'>
   <input type='text' name='field2' value='bar'>
</form>

會轉換為javascript對象...

{
   field1: 'foo',
   field2: 'bar'
}

Answer 1

在MooTools中，您可以輕松地將所有表單值轉換為Object：

var formObjects=$('myform').toQueryString().parseQueryString();

轉換為JSON：

var formJson=JSON.encode(formObjects);

Answer 2

只需編寫自己的方法，基於Element.toQueryString的源代碼 - 就像這樣（我知道方法名稱是垃圾，但這是你最不擔心的事情）

Element.implement({
    toJSON: function(){
        var json = {};
        this.getElements('input, select, textarea', true).each(function(el){
            if (!el.name || el.disabled || el.type == 'submit' || el.type == 'reset' || el.type == 'file') return;
            var value = (el.tagName.toLowerCase() == 'select') ? Element.getSelected(el).map(function(opt){
                return opt.value;
            }) : ((el.type == 'radio' || el.type == 'checkbox') && !el.checked) ? null : el.value;
            $splat(value).each(function(val){
                if (typeof val != 'undefined') {
                    json[el.name] = val;
                }
            });
        });
        return json;
    }
});

console.log($("myform").toJSON());

通過示例表單測試並正常工作 - http://mootools.net/shell/ZSsVr/ - 生成您要求的exact結果。

Answer 3

我其實喜歡Dimitar Christoff的回答和Trebla的組合：

Element.implement({
    toJSON: function(){
        var j = {};
        Array.each(this.toQueryString().split('&'),function(a){
            var kv = a.split('=')
            j[kv[0]] = kv[1]||'';
        });
        return JSON.encode(j);
    }
});
console.log($('formular_support').toJSON());

Answer 4

http://code.google.com/p/form2js/

檢查一下，確切地說你需要什么，但框架無關

Answer 5

MooTools沒有表格序列化工具; 我知道，這很糟糕。

但是，我已經成功使用了這個獨立的實現： form2obj 。

Answer 6

一種方法。 - 將其轉換為JSON對象

var hm = $('myform').toQueryString();
    hm = '{"'+hm+'"}'; 
    hm = hm.replace(/&/g, '","');
    hm = hm.replace(/=/g, '":"');
    var jsn = JSON.decode(hm); // jsn is ur JSON object.

---

將其轉換為哈希。

Mootools有一個名為Hash的對象類型。 您也可以通過執行以下操作轉換為該文件。

哈希鏈接： http ： //mootools.net/docs/core/Native/Hash它設置並獲取方法，你可以循環和做東西，檢查鏈接。

var hm = $（'myform'）。toQueryString（）;

var ar = hm.split('&');
var finalo = new Hash();
ar.each(function(a, aCounter)
{
    var tmp = a.split('=');
    finalo.set(tmp[0], tmp[1]);
});

// finalo is your Hash object. Use the get() method to extract values. Check the link given above.