2016-11-20 42 views
0

在我的代码中,我从SharePoint(基本上是一个Excel电子表格)中提取数据并显示在我的页面上。复选框使用.innerHTML推送到我的页面,并以编程方式提供ID。如何捕获我以编程方式创建的复选框?

我的问题:如何确定是否选中这些复选框(即每次我的应用程序加载时它们可能会有所不同)?

(一旦我知道是查了一下,我会基础上,检查在下一个页面上显示更多的元数据 - 我已经想通了,一部分)

$.ajax({ 
url: "myWebsite", 
type: "GET", 
headers: { "ACCEPT": "application/json;odata=verbose" }, 
success: function(data){ 
    $.each(data.d.results, function(index) { 
    var $this = $(this); 
    var courseName = $this.attr('Title'); 
    var courseNumber = $this.attr('Course_x0020_Number'); 
    var courseUrl = $this.attr('URL'); 
    var trainingGroup = $this.attr('Training_x0020_Group'); 
    var recurrence = $this.attr('Recurrence'); 

     if (trainingGroup == 'Group1') { 
      if (recurrence == "Don't Specify") {recurrence = ''; 
      } else recurrence = " ("+recurrence+")"; 
      document.getElementById('officeListSpan').innerHTML += '<ul class="courseLists"><li><input type="checkbox" id="'+courseName.replace(/\s+/g, '')+'"/>'+courseName+recurrence+'</li></ul>'; 
     } 
     if (trainingGroup == 'Group2') { 
      if (recurrence == "Don't Specify") {recurrence = ''; 
      } else recurrence = " ("+recurrence+")"; 
      document.getElementById('labListSpan').innerHTML += '<ul class="courseLists"><li><input type="checkbox" id="'+courseName.replace(/\s+/g, '')+'"/>'+courseName+recurrence+'</li></ul>'; 
     } 
    }); 
    }, 
    error: function(){ 
    alert("Failed to query SharePoint list data. Please refresh (F5)."); 
    } 
}); 

回答

0

您需要一种方法来知道有多少复选框已创建。当创建复选框时,它们的ID必须具有通用名称和数字,例如id="checkbox0"id="checkbox1等,然后在html代码的某些部分中写入复选框的数量,并将其放入一些hidden标记。然后读取复选框,当数据读取复选框的ammount的,做一个for

function getCheckboxes(){ var ammount = parseInt(document.getElementById("checkBoxesAmmount")); var checkbox; for(var i = 0; i<ammount; i++){ checkbox = document.getElementById("checkbox"+i); //do staff } return;

我希望这对你的作品C:

+0

我唯一的问题是复选框的数量可能会增长到无穷大(至少应用程序需要期待这种潜力)但我会与这个建议一起工作!感谢您的答复。 – Ryan

0

的jQuery该位将返回所有选中的输入框是在ul与类courseList

jQuery('ul.courseList input:checked') 

如果你的问题是问,因为课程名称可能会改变(你的复选框ID基于课程名称),我建议改用课程编号(或两者的适当组合)。

如果你想知道你的动态创建的复选框是否已经过检查并且希望在提交表单前通过Javascript完成,那么在你的复选框中添加一个类(如dynamicCourse),然后通过jQuery('input.dynamicCourse:checked')找到复选框。

此外,您示例中的复选框没有value属性集。如果你将它提交给后端,你可能会希望它具有一定的价值(课程编号将是我的建议)。