jQuery Forum

 <div class="col-lg-1">
                <i  class="ShowToolTip popper fa fa-eye LabTaskClass28  LabTaskClassforShowHideCol77" data-placement="left"><span class="close-popover float-right text-danger "></span></i>

                <div class="popover_title" style="display: none">
                    <h6>No task result for note<span class="close-popover float-right text-danger"><i class="fa fa-times"></i></span></h6>
                </div>
                <div class="popper-content" style="display:none">
                    <div class="form-group">
                        <label title="Task name">
                            Task name
                        </label>
                        <input type="text"
                               class="form-control">

                        <label title="Message">
                            Message
                        </label>
                        <input type="text"
                               class="form-control" placeholder="Limited to 100 Characters">
                        <button class="btn-save btn btn-primary btn-sm" style="background-color:maroon !important">Close</button>
                        <button class="btn-save btn btn-primary btn-sm" style="background-color:darkslategrey !important">SAve</button>
                    </div>
                    <button type="submit" class="btn btn-default btn-block">
                        Submit
                    </button>
                </div>
            </div>

            <div class="col-lg-1">
                <i class="ShowToolTip popper fa fa-eye LabTaskClass28  LabTaskClassforShowHideCol78" data-placement="left"><span class="close-popover float-right text-danger "></span></i>
                @*<div class="popper-content" style="display:none">My Review popover content goes here.</div>*@
                <div class="popover_title" style="display: none">
                    <h6>No task result for Review<span class="close-popover float-right text-danger"><i class="fa fa-times"></i></span></h6>
                </div>
                <div   class="popper-content" style="display: none">
                    <div class="form-group">
                        <label title="Task name">
                            Task name
                        </label>
                        <input type="text"
                               class="form-control">

                        <label title="Message">
                            Messagessd
                        </label>
                        <input type="text"
                               class="form-control" placeholder="Limited to 100 Characters">
                        <button class="btn-save btn btn-primary btn-sm" style="background-color:maroon !important">Close</button>
                        <button class="btn-save btn btn-primary btn-sm" style="background-color:darkslategrey !important">SAve</button>
                    </div>
                    <button type="submit" class="btn btn-default btn-block">
                        Submit
                    </button>
                </div>

            </div>

<script type="text/javascript">
      
        $(function () {
            $('.popper').popover({
        
                placement: 'bottom',
                container: 'body',
                html: true,
                title: function () {
                    return $('.popover_title').html();
                },
             
              
               
                @*content: function () {
                    var output = '';
                    $.ajax(
                        {
                            url: "@Html.Action("Client", "Test")",
                            async: true,
                            success: function (response) {
                                output = response;
                            }
                    });
                }*@
                
               // content:  fetchData() {
                content: function () {
                 //  return $('#popover_content_wrapper').html();
                    // return $(this).next('.popper-content').html();
                    return $('.popper-content').html();
                }
            });


            $('html').on('click', function (e) {
                if (typeof $(e.target).data('original-title') == 'undefined' && !$(e.target).parents().is('.popover.in')) {
                    $('[data-original-title]').popover('hide');
                }
            });
            //});
            //$("[data-toggle=popover]").popover({
            //    html: true,
            //    content: function () {
            //        return $('#popover-content').html();
            //    }
            //});

        });
        $(document).on('click', '.close-popover', function () {
           // $('#cart-popover').popover('hide');
        });
    </script>