追加HTML数据的jQuery

这一次，我在写控制器HTML，当我选中一个复选框，我得到了控制台的数据，但我想它的形式。追加HTML数据的jQuery

我复选框在foreach循环

<input type='checkbox' value='{$student['id']}' name='student_ids[]' id='chkbx' required> {$student['name']}

当点击复选框数据加载相应

其我的HTML

$str .= '<div class="form-group"> 
    <label class="control-label col-md-3"> 
    Student 
    </label> 
    <div class="col-md-4"> 
     <select id="students-clicked" class="form-control select2-multiple" multiple name="students[]"> 
      <option value=""></option>'; 
      foreach ($students as $students) { 
       $str .= "<option value='{$student->id}'>{$student->name}</option>"; 
      } 

$str .=   '</select> 
    </div> 
</div>';

Jquery的方法是

$('body').on('click', "#chkbx", function() { 
    var class = $('input:checkbox:checked').map(function() { 
     return this.value; 
    }).get(); 
    $.ajax({ 
      url: '/trigger/studentsData', 
      type: 'POST', 
      data: {'trigger_type': 'click' , ids: class}, 
      success: function(result) { 

      } 
     }); 
});

除了jQuery的一切都写在控制这个时候我得到的HTML数据控制台我怎么可以追加它在我的HTML表单它根据复选框的选择

来源

2017-06-06 blue moon

不要在控制器中写入html。 – Kyslik

@Kyslik它在我的情况下的要求是否为什么我使用这种方法 –

你想在复选框后显示你的HTML？ – kunal

试试这个也应该更新： -

<input type='checkbox' value='{$student['id']}' name='student_ids[]' id='chkbx' required/> {$student['name']} 
<div id="appendata"> 
//your ajax data 
</div>

在成功功能

现在

success: function(result) { 
    $("#appendata").html(result); // this will replace when you select the checkbox 
     or 
    $("#appendata").append(result); // this will append when you select again from checkbox 
}

希望它可以帮助

来源

2017-06-06 10:01:33 kunal

其接近解决方案，但不确切它的插入HTML 5场，如果我签5个checboxes它应该给所有数据一个下拉 –

如果我点击第二个复选框，它应该插入数据在同一字段中不需要插入新的 –

然后你必须做你的HTML在控制器中使用的变化。我已根据您的问题给出答案，现在您必须查看您的代码 – kunal

不要append()而使用html()覆盖响应数据内容

success: function (result) { 
    $("#container").html(result); 
}

另外，如果你有一个以上的复选框，不使用id，而使用class属性遍历它们

来源

2017-06-06 10:14:09 linktoahref

谢谢+1帮助，如果你认为它应该也请投票问题:) –

追加HTML数据的jQuery

回答

相关问题