单击图标时，出现一个带有复选框列表的弹出窗口

Question

我的页面中有一个表，我从数据库中获取数据。 在某些单元格中，我有一个编辑图标。当用户单击它时，我希望他们看到一个弹出窗口。

在弹出的窗口中，我要显示三个选项（复选框），该用户只能选择其中一个，然后单击“确定”按钮，然后将所选选项的值返回到数据变量。（如您所见）在下面的代码中）

我不得不提到，当用户单击编辑图标时，一些信息将发送到另一个文件。 因为我需要更新数据库。

   $(".SSO").click(function () {
    var id = $(this).attr("data-id");
    var data= HERE I NEED TO GET THE VALUE OF THE SELECTED OPTION IN THE POP UP WINDOW
  }

因此，SSO是图像图标的class属性的值。 data-id值有助于更新数据库中的正确记录。

现在，这是一个文件中的代码：

 $(".SSO").click(function()

 {
   var id = $(this).attr("data-id");
   // open popup window and pass field id
   window.open('sku.php?id=' + encodeURIComponent(id),
       'width=400,toolbar=1,resizable=1,scrollbars=yes,height=400,top=100,left=100');
}

这是sku.php中的代码

  <script type="text/javascript">
        function sendValue (s){
          var parentId = <?php echo json_encode($_GET['id']); ?>;
          window.opener.updateValue(parentId, s);
          window.close();
          window.close();
        }
        </script>

        <form name="selectform">
        <input type=button value="OK" onClick="sendValue(document.querySelector('.messageCheckbox:checked').value);"
       </form>

Mu表格现在只有一个“确定”按钮，当我单击“编辑”按钮时，什么也没有发生。 我是否应该看到其中包含“确定”按钮的弹出窗口？

Answer 1

通常，弹出窗口会显示有alert()或类似内容，这会导致浏览器生成实际的弹出窗口。 这种弹出窗口不能添加HTML元素。 您可以执行以下操作：http://www.codeproject.com/Tips/170049/Pure-HTML-CSS-Modal-Dialog-Box-no-JavaScript

我在网站上使用了它们，我非常喜欢它们，但是我不喜欢css :target选择器，因此我改用Javascript打开它，但几乎是同一回事。