单击单选按钮上的清除文本区域并获取文本而不是值jquery

时间:2017-05-09 05:52:14

标签: javascript jquery html

在这里我可以清除数据但是当我从其他单选按钮推送值时,它再次加载我以前不想要的先前数据。

我希望textarea数据应该在单选按钮上永久清除,不应该加载任何其他数据。

这是我的代码

    <div class="portlet-body">
@foreach($students as $student)
    <div>
        <input type="radio" value="{{$student->id}}" name="student_lists[]" onclick="getdata( {{ $student->id }} )"/>
        {{$lists->name}}
        <span></span>
    </div>
    <div id="students-data"></div>
@endforeach
</div>

脚本

    <script>
function getdata(id)
{
    $('#textbx').val(null);
    $.ajax({
        url: '/students/'+id,
        type: "POST",
        success: function (data) {
        $('#students-data').html(data);
        }
    });
}

获取HTML的控制器方法

public function loadData($id)
{
  $students = DB::table('students')->select('name' , 'id')->where('user_id' , $id)->get();
  $data = '';
    $data .= '<div class="form-group">
                      <label class="control-label col-md-1">
                      </label>
                      <div class="col-md-8">
                          <label class="">';
                          foreach ($students as $student) {
                              $data .= "<input type='checkbox' class='chkbx' name='custom' onclick='push()' value='{$student->name}'/> {$student->name}
                                <span></span>";
                              }
                 $data .='</label>
                      </div>
                  </div>';
              return $data;
  }

在文本区域中推送数据的脚本

<script>
    function push()
    {
    $checks = $(".chkbx:checkbox");
    $checks.on('change', function() {
        var data = $checks.filter(":checked").map(function(i,v){
            return this.value;
        }).get().join("\n");

        $('#textbx').val(data);
    });
    }
</script>

我推文字的文字区域

<textarea name="fields" id="textbx" class="form-control" rows="8" ></textarea>

请帮助我如何硬重置textarea值。

2 个答案:

答案 0 :(得分:1)

删除推送功能,保留更改事件并委派它,以便您可以触发动态添加元素的代码,选择相对于单击的复选框的复选框

   $(function(){
        $('body').on('change',".chkbx:checkbox", function() {
            var data = $(this).parent().find(':checkbox:checked').map(function(i,v){
                return $(v).val();
            }).get().join("\n");

            $('#textbx').val(data);
        });
   });

如果您将student-&gt; id作为值并希望将student-&gt;名称添加到textarea,那么您需要更改html,如下所示

使用学生姓名

添加名为data-name的自定义属性
 $data .= "<input type='checkbox' class='chkbx' name='custom' data-name=' {$student->name}' value='{$student->name}'/> {$student->name}
                                <span></span>";

并且js映射返回:

return $(v).attr('data-id');

答案 1 :(得分:0)

在循环语句开始之前,将学生数据变量初始化为0或null。 您要显示的所有变量应初始化为0或NULL,以便每次调用函数时,值将设置为null,然后 for 循环将其值存储。