【问题标题】:Trigger cocoon add_association from javascript从javascript触发茧add_association
【发布时间】:2014-05-24 18:18:49
【问题描述】:

我正在使用 cocoon,我想在选择日期选择器中的日期(可以是多个日期)时自动添加子记录。

我可以像这样在coffeescript中捕获日期选择,但我不知道如何通过cocoon添加子记录,即通过模拟触发link_to_add_association时发生的情况。

$(".form_multidate").datepicker().on 'changeDate', (e) -> alert(e.dates)

茧设置是标准的嵌套形式,没有任何技巧,在页面上运行良好。

编辑:评论重新绑定日历中提到的代码:

$(document).ready(function() {
  $('#other_request_details')
    .bind('cocoon:after-insert', function() {
      return $('.datepicker-single').datepicker({
        dateFormat: "DD, dd M yy"
      });
    });
});    

【问题讨论】:

  • 你有想过这个吗?
  • 不,我最终做了一些不同的事情。我怀疑您需要绑定到其中一种茧方法。我使用类似的东西来重新加载一个 jquery 日历:
  • 只要触发link_to_add_association元素上的点击事件就可以了?

标签: ruby-on-rails ruby-on-rails-4 coffeescript cocoon-gem


【解决方案1】:

无法调用 JS 函数来使用 Cocoon 添加新记录。唯一能做的就是触发添加关联按钮的点击事件。

If you see Cocoon's library code you will see that all new record functionality is bound to the click button

 $(document).on('click', '.add_fields', function(e) {
    e.preventDefault();
    var $this                 = $(this),
        assoc                 = $this.data('association'),
        assocs                = $this.data('associations'),
        content               = $this.data('association-insertion-template'),
        insertionMethod       = $this.data('association-insertion-method') || $this.data('association-insertion-position') || 'before',
        insertionNode         = $this.data('association-insertion-node'),
        insertionTraversal    = $this.data('association-insertion-traversal'),
        count                 = parseInt($this.data('count'), 10),
        regexp_braced         = new RegExp('\\[new_' + assoc + '\\](.*?\\s)', 'g'),
        regexp_underscord     = new RegExp('_new_' + assoc + '_(\\w*)', 'g'),
        new_id                = create_new_id(),
        new_content           = content.replace(regexp_braced, newcontent_braced(new_id)),
        new_contents          = [];


    if (new_content == content) {
      regexp_braced     = new RegExp('\\[new_' + assocs + '\\](.*?\\s)', 'g');
      regexp_underscord = new RegExp('_new_' + assocs + '_(\\w*)', 'g');
      new_content       = content.replace(regexp_braced, newcontent_braced(new_id));
    }

    new_content = new_content.replace(regexp_underscord, newcontent_underscord(new_id));
    new_contents = [new_content];

    count = (isNaN(count) ? 1 : Math.max(count, 1));
    count -= 1;

    while (count) {
      new_id      = create_new_id();
      new_content = content.replace(regexp_braced, newcontent_braced(new_id));
      new_content = new_content.replace(regexp_underscord, newcontent_underscord(new_id));
      new_contents.push(new_content);

      count -= 1;
    }

    var insertionNodeElem = getInsertionNodeElem(insertionNode, insertionTraversal, $this)

    if( !insertionNodeElem || (insertionNodeElem.length == 0) ){
      console.warn("Couldn't find the element to insert the template. Make sure your `data-association-insertion-*` on `link_to_add_association` is correct.")
    }

    $.each(new_contents, function(i, node) {
      var contentNode = $(node);

      insertionNodeElem.trigger('cocoon:before-insert', [contentNode]);

      // allow any of the jquery dom manipulation methods (after, before, append, prepend, etc)
      // to be called on the node.  allows the insertion node to be the parent of the inserted
      // code and doesn't force it to be a sibling like after/before does. default: 'before'
      var addedContent = insertionNodeElem[insertionMethod](contentNode);

      insertionNodeElem.trigger('cocoon:after-insert', [contentNode]);
    });
  });

【讨论】:

    猜你喜欢
    • 2014-03-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-01-23
    • 1970-01-01
    相关资源
    最近更新 更多