2017-08-29 53 views
0

我已创建的自定义窗体并添加了一些jquery的用于动态的输入,但我不能得到从这些生成的输入值(元素,链接,图像)。这是我的表格和代码。如何获得价值从动态流星创建输入?

enter image description here 模板 这是我的模板,这种形式

<form id="workForm" class="workAdd"> 
<label>Title</label> 
<input type="text" name="title" id="title" class="form-control"> 
<label>Live Link</label> 
<input type="text" name="llink" id="llink" class="form-control"> 
<label>Elements Used In This Project</label> 
<div class="row" id="eleContainer"> 
    <div class="eleRow"> 
     <div class="col s6 m6 l6"> 
      <label>Element</label> 
      <input type="text" name="elements[]" id="elementsid[]" class="form-control"> 
     </div> 
     <div class="col s6 m6 l6"> 
      <label>Link</label> 
      <input type="text" name="elinks[]" id="elinksid[]" class="form-control" > 
     </div> 
    </div> 
</div><!--row--> 
<div class="row"> 
    <div class="col s6 m12 center"> 
     <a class="btn-floating waves-effect waves-light" id="addElements"><i class="fa fa-plus"></i></a> 
    </div> 
</div> 
<div class="row" id="imgContainer"> 
    <div class="imgRow"> 
     <label>Image</label> 
     <input type="text" name="image[]" id="imageid[]" class="form-control" > 
    </div> 
</div> 
<div class="row"> 
    <div class="col s6 m12 center"> 
     <a class="btn-floating waves-effect waves-light" id="addImages"><i class="fa fa-plus"></i></a> 
    </div> 
</div> 
<label>Detail</label> 
<textarea id="detail" class="materialize-textarea" name="detail" data-length="120"></textarea> 

<button type="submit" id="work-submit" thisId="" class="btn btn-primary">Submit</button> 

流星 这是我为这个表单创建我的提交事件。

Template.addworkTemp.events({ 
"submit .workAdd": function(event) { 

    var title = event.target.title.value; 
    var llink = event.target.llink.value; 
    var elements = event.target.elements.value; 
    var elinks = event.target.elinks.value; 
    var images = event.target.images.value; 
    var detail = event.target.detail.value; 
    return false; 
+0

如果你不在输入名称和ID的 – Mikkel

+0

@mikkel中使用方括号,你将会获得更好的成功我知道它给了我一个括号的错误,但我也试过没有括号但没有任何东西,没有任何东西。请给我一些想法是什么,应该怎么办。我被困在这里。 –

回答

0

有一个很好的tutorial on meteor forms这可能对你有用。本教程是基于火焰是你使用的是什么。

首先,您可以将您的处理程序附加到form而不是workform类。

Template.addWorkTemp.events({ 
    'submit form'(event) { 
    ... 
    } 
}); 

那么你应该阻止默认表单操作:

Template.addWorkTemp.events({ 
    'submit form'(event) { 
    event.preventDefault(); 
    ... 
    } 
}); 

event对象都有它具有基于连接到它们在HTML中每场特性target属性。

Template.addWorkTemp.events({ 
    'submit form'(event) { 
    event.preventDefault(); 
    console.log(event.target.llink.value); 
    ... 
    } 
}); 

我不知道为什么你要追加[]到字段名称。我不知道那些在这方面有效。

有一个related answer显示如何通过template对象访问表单元素,这是您的事件处理程序的可选第二个参数。这也可以帮助你。

当我调试这样的事情我一般设置一个断点(使用浏览器的开发工具),在事件处理程序的第一行,然后检查事件,以确保我的理解里面有什么。