AlloyUI表单生成器试图访问动态创建的元素

我已经使用AlloyUI表单生成器构建了一个动态表单。我想捕捉拖拽到边界框中的元素。我遇到过这样的事情：AlloyUI表单生成器试图访问动态创建的元素

function saveFieldsForm（）{
var formXML ='';

myFormBuilder.get('fields').each(
function(item, index, collection) { 
    var dataType = item.get('dataType'), 
     indexType = item.get('indexType'), 
     label = item.get('label'), 
     multiple = item.get('multiple'), 
     name = item.get('name'), 
     options = item.get('options'), 
     readOnly = item.get('readOnly'), 
     repeatable = item.get('repeatable'), 
     required = item.get('required'), 
     showLabel = item.get('showLabel'), 
     type = item.get('type'), 
     tip = item.get('tip'), 
     predefinedValue= item.get('predefinedValue'), 
     width = item.get('width'); 

    var fieldXML = '<field>'; 
    fieldXML += '<type>' + type + '</type>'; 
    fieldXML += '<name>' + name + '</name>'; 
    fieldXML += '<required>' + required + '</required>'; 
    fieldXML += '<tip>' + tip + '</required>'; 
    fieldXML += '<predefinedValue>' + predefinedValue + '</predefinedValue>';   
    fieldXML += '</field>'; 
    alert("fieldXML: "+ fieldXML); 
    formXML += fieldXML; 
}); 

formXML += '</root>'; 
alert("formXML: "+ formXML); 

AUI().use('aui-io-request', 
      function(A) {   

     A.io.request(
      '<%=ajaxURL%>',{ 
       data: {       

        formXML : formXML, 

       }, 
       dataType: 'json', 
       on: {                        
         success: function(data) { 
          alert("Your form has been saved!") 

         }, 

         error: function(jqXHR, textStatus, errorThrown) { 

          alert("Error, the content has not been saved! Please try again...");  
          console.log(textStatus, errorThrown);      

          }   
        } 
      });  
      });

}

在上面的代码中，我了解到，拖动和丢弃的现场被抓获，但我不明白里面的功能项，指数和收藏领域中的代码非常第二行。这些价值是什么以及这些价值来自哪里？请帮忙!!!

来源

2014-05-14 GeekStyle

myFormBuilder.get('fields')返回Alloy UI ArrayList这是您获取each函数的位置。 callback的参数来自ArrayList的“内部”。

我最近使用了表单构建器，并以非常相似的方式捕获了我的表单。不过，我救了我的JSON。

var formDefinition = []; 

var parser = function(fields, container){ 
    fields.each(function(item, index) { 
    var surveyElement = {}; 
    var properties = item.getProperties(); 

    properties.forEach(function(property) { 
     var attr = property.attributeName; 
     surveyElement[attr] = item.get(attr); 
    }) 
    surveyElement.name = item.get('name'); 

    var children = item.getAttrs()['fields'] 
    if(children && children.size() > 0){ 
     surveyElement.children = []; 
     parser(children, surveyElement.children); 
    } 

    container.push(surveyElement); 
    }); 
} 

parser(formBuilder.get('fields'), formDefinition); 
var json = JSON.stringify(formDefinition)

item是由each功能被提供的 “当前” 项。
index是该项目在其深度位置的边界元件

我没有使用collection参数内，所以只好进行调查。看起来该集合表示在特定边界元素内相同深度的item的所有元素。换句话说，如果item嵌套在某个其他元素中，则该集合仅限于该范围parent。

例

文本框
- 复选框1
- 复选框2
单选按钮
- 复选框3

想象一下each提供了Text Box。那将是item，index为0，并且collection将是一个包含两个元素的ArrayList（为简单起见，我将使用JavaScript语法）[{formElement: Text Box},{formElement: Radio Buttons}]。接下来，each提供了Checkbox 1。 index将再次为0，因为这是此“深度”处的第一个元素，并且因为它位于Text Box内，所以collection将只包含Checkbox 1和Checkbox 2。 each然后提供Checkbox 2，index现在是1而collection保持不变。

each将继续，直到它遍历所有表单元素。

来源

2014-05-15 22:14:32 Origineil

AlloyUI表单生成器试图访问动态创建的元素

回答

相关问题