JavaScriptの勉強

http://d.hatena.ne.jp/da-yoshi/20070220/1171907993

を読んでたら、楽しそうに感じて、その楽しさに乗っかるには、JavaScriptについても勉強しないとなーっと思ったので、ちょっと勉強。


とりあえず、prototype.jsの1.4.0(ふるい?)が手元にあったのでそれを見ながら(かなりマネしながら)JSONをformに反映するにを作ってみた。

MyStudy.Form = {
  
  fill: function(form, jobj) {
    form = $(form);
    
    var elements = Form.getElements(form);
    $A(elements).each(function(element) {
      var method = element.tagName.toLowerCase();
      MyStudy.Form.FromJSON[method](element, jobj);
    });
  }
  
};

MyStudy.Form.FromJSON = {
  
  input: function(element, jobj) {
    switch (element.type.toLowerCase()) {
      case 'submit':
      case 'hidden':
      case 'password':
      case 'text':
        MyStudy.Form.FromJSON.textarea(element, jobj);
        return;
      case 'checkbox':
      case 'radio':
        MyStudy.Form.FromJSON.inputSelector(element, jobj);
        return;
    }
    return false;
  },

  inputSelector: function(element, jobj) {
    if (jobj[element.name] == undefined) {
      return;
    }
    if (element.value == jobj[element.name]) {
      element.checked = true;
    }
  },

  textarea: function(element, jobj) {
    if (jobj[element.name] == undefined) {
      return;
    }
    element.value = jobj[element.name];
  },

  select: function(element, jobj) {
    MyStudy.Form.FromJSON[element.type == 'select-one' ?
        'selectOne' : 'selectMany'](element, jobj);
  },

  selectOne: function(element, jobj) {
    if (jobj[element.name] == undefined) {
      return;
    }
    var value = jobj[element.name];
    $A(element.options).detect(function(opt, index) {
      if ('value' in opt) {
        if (opt.value == value) {
          element.selectedIndex = index;
          return true;
        }
      } else {
        if (opt.text == value) {
          element.selectedIndex = index;
          return true;
        }
      }
    });
  },

  selectMany: function(element, jobj) {
    if (jobj[element.name] == undefined) {
      return;
    }
/*  未完成、、、
    var value = new Array();
    for (var i = 0; i < element.length; i++) {
      var opt = element.options[i];
      if (opt.selected) {
        var optValue = opt.value;
        if (!optValue && !('value' in opt))
          optValue = opt.text;
        value.push(optValue);
      }
    }
    return [element.name, value];
*/
  }
  
};

まだまだ、できてないとこやIEでも動くように適当に対応したところがあるけど、まず第一歩として。

formからJSONへも必要だね。。。