Question

我有一个场景，点击一个按钮，我打开一个jQuery对话框，通过ajax调用呈现一个jsp（struts）表单，如下所示。此表单有一个<sj:select>标记，用于接收来自对象List的条目。该列表正确填充但它没有显示在对话框上，而是显示在我打开对话框的父jsp页面上。这是我的父jsp代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">

$("#mydialogpopup").click(function(){
     $.ajax({
        url : "popupAjax.action",
        success : function(response) { 
            $("#form_add").html(response);
         $("#form_add").dialog('open');
        }
 });
 });
     $("#form_add").dialog({autoOpen: false, 
         modal: true,
         width: 450,
        height: 280
     });

</script>


><a href="#" id="mydialogpopup" class="isw-plus"></a>

<div class="newdialog" id="form_add" style="display: block;" title="My Dialog"></div>

这是我的popup.jsp页面的代码，它被呈现为Ajax调用的成功结果：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
 <%@ taglib  uri="/struts-tags" prefix="s"%>      
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>

<html>
<head>
<sj:head/>
 <link href="jsp/css/stylesheets.css" rel="stylesheet" type="text/css" />
</head>

  <s:form id="userForm" action="" method="post" >

  <s:url id="remoteurl" action="listUser"/>                         
                            <sj:select
                            href="%{remoteurl}"
                            id="echo3"
                            cssStyle="width: 100%;"
                            name="echo" 
                            list="userList" 
                            listKey="id" 
                            listValue="name"
                            autocomplete="true"
                            emptyOption="true"
                            headerKey="-1" 
                            loadMinimumCount="2"
                            headerValue="Please Select a User" />

    <sj:submit targets="result" id="savedialog" value="Save" validate="true"/>&nbsp; &nbsp; <input type="button" id="closedialog" value="Cancel"/>

    </s:form>

Answer 1

不要在同一页面上加载两次jQuery库。第一次使用

加载它

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">

第二次用

加载它

<sj:head/>

此外，您不应在呈现的页面上使用这些标记

<html>
<head>
<sj:head/>
 <link href="jsp/css/stylesheets.css" rel="stylesheet" type="text/css" />
</head>

您呈现的页面不是完整的html页面，而是其中的一部分，您应该只呈现适合父标记正文的标记。因为您渲染到div标记，所以它的位置由CSS样式定义，并且可以浮出对话框。确保使用position: relative样式。

<sj：select>无法在jQuery对话框中工作

1 个答案: