Question

我有一个JSP页面。我正在使用struts2。这是我的JSP页面

enter image description here

正如你所看到的，上面有一个表格，另一个手风琴显示了一些项目。组件显示组件列表。并有一个 ADD 按钮。当我点击Add buton时，它将调用一个Ajax调用并返回HTML，我将其设置为 DIV 并将其显示为弹出窗体。

enter image description here

输入数据后，单击“保存”，它将调用Ajax并保存到数据库。然后它将重定向到另一个操作以获取更新列表并将列表返回到ajax。结果我显示在Components选项卡中。 enter image description here

它正在发挥作用。现在，在弹出窗体中需要一些字段，如果不输入它们，它将调用action类（action validator.xml文件用于验证必需的字段。）并将返回错误，但作为其ajax调用，结果数据将在组件Tab中设置。

enter image description here （此处显示的错误消息是另一种形式的错误。但同样也会显示此表单。在该错误消息下方，表格也会显示。所有内容都在“组件”标签内）我希望错误结果以相同的弹出窗体显示。

Jquery Ajax

$(document).on('click', ".saveRow", function(){
        var formId=$(this).closest("form").attr("id");
        var form = $("#"+formId);
        var htmlId=formId;
        htmlId=getDivId(htmlId);
        form.submit(function () {
            $('.saveRow').html('Saving...').fadeIn();
            var urlAction=form.attr('action');
            var dataFields=form.serialize();
            callActionUsingAjax(urlAction, dataFields, function (data) {
                    var ajaxActionResult=ajaxResult(data);
                    setHTMLContent(ajaxActionResult,htmlId);
                    $('.popUpForm').dialog("close");
            });
         return false;
        });
    });

function callActionUsingAjax(urlAction, dataFields, callback)
        {
            $.ajax({
                type: "post",
                url: urlAction,
                data: dataFields,
                success: function (data) {
                    callback(data);
                }
            });
        }

    function ajaxResult(data)
    {
        var ajaxResult= $('<div/>').html(data),
        $ajaxContent = ajaxResult.find('#ajaxContent');
        var ajaxActionResult=$('<div/>').html($ajaxContent);
        ajaxActionResult.find('#ajaxContent').removeClass("crudItems");
        ajaxActionResult.find('#resultContent').removeClass("includestyle");
        ajaxActionResult.find('#ajaxContent').find("#footer").remove();
        return ajaxActionResult;
    }

    function setHTMLContent(ajaxActionResult,htmlId) {
        $("#"+htmlId).html(ajaxActionResult);
        $("#"+htmlId).height(315);
    }

在ajax的成功中，如果我给alert(data);它的整个html文本提醒。我尝试了alert(data.redirect)，并通过“undefined”提醒。

我的struts.xml

<action name="saveDimComponent" 
    class="com.vxl.appanalytix.webapp.action.DimComponentAction"
    method="save">
    <result name="input">/WEB-INF/pages/dimComponentForm.jsp</result>
    <result name="cancel" type="redirectAction">dimComponents</result>
    <result name="delete" type="redirectAction">dimComponents</result>
    <result name="success" type="redirectAction">dimComponents</result>
</action>

（即，如果结果为输入，则应显示包含错误的弹出窗体）

更新1

DimComponent-validation.xml中

<!DOCTYPE validators PUBLIC "-//OpenSymphony Group//XWork Validator 1.0.2//EN"
    "http://web.archive.org/web/20090222210559/http://www.opensymphony.com/xwork/xwork-validator-1.0.2.dtd">
<validators>
    <field name="dimComponent.componentId">
        <field-validator type="requiredstring">
            <message key="errors.required"/>
        </field-validator>
    </field>
    <field name="dimComponent.componentDesc">
        <field-validator type="requiredstring">
            <message key="errors.required"/>
        </field-validator>
    </field>
</validators>

DimComponentAction-validation.xml中

<!DOCTYPE validators PUBLIC "-//OpenSymphony Group//XWork Validator 1.0.2//EN"
    "http://web.archive.org/web/20090222210559/http://www.opensymphony.com/xwork/xwork-validator-1.0.2.dtd">
<validators>
    <field name="dimComponent">
        <field-validator type="visitor">
            <param name="appendPrefix">false</param>
            <message/>
        </field-validator>
    </field>
</validators>

DimComponentAction.java

public class DimComponentAction extends BaseAction implements Preparable {

   private List dimComponents;
    private DimComponent dimComponent;
    private Long componentKey;
    private String query;

    @Autowired
    private DimComponentManager dimComponentManager;

    //getter and setter

    public void prepare() {
        if (getRequest().getMethod().equalsIgnoreCase("post")) {
            // prevent failures on new
            String dimComponentKey = getRequest().getParameter("dimComponent.componentKey");
            if (dimComponentKey != null && !dimComponentKey.equals("")) {

                dimComponent = dimComponentManager.get(new              Long(Integer.parseInt(dimComponentKey)));
            }
        }
    }
   public String list() {
        try {
           dimComponents = dimComponentManager.search(query, DimComponent.class);
        } catch (SearchException se) {
            addActionError(se.getMessage());
            dimComponents = dimComponentManager.getAll();
        }
        return SUCCESS;
    }
    public String delete() {
        dimComponentManager.remove(dimComponent.getComponentKey());
        saveMessage(getText("dimComponent.deleted"));

        return SUCCESS;
    }
    public String edit() {
        setComponentValues();
        if (componentKey != null) {
            dimComponent = dimComponentManager.get(componentKey);
        } else {
            dimComponent = new DimComponent();
        }
        return SUCCESS;
    }

    public String save() throws Exception {
        if (cancel != null) {
            return "cancel";
        }

        if (delete != null) {
            return delete();
        }

        boolean isNew = (dimComponent.getComponentKey() == null);

        dimComponentManager.save(dimComponent);
        String key = (isNew) ? "dimComponent.added" : "dimComponent.updated";
        saveMessage(getText(key));

        if (!isNew) {
            return INPUT;
        } else {
            return SUCCESS;
        }
    }

Answer 1

现在，您正在jQuery中使用success回调，用于成功请求和未成功处理的请求。不幸的是，您的服务器代码强制您这样做，因为显然您无法从响应正文中扣除请求未成功处理的情况。 Struts操作结果未包含在HTTP响应中，因此您需要找到另一种区分结果的方法。

如果更改服务器端代码以在输入无效时设置错误代码（例如，400 Bad Request）。如果有，你可以改变你的jQuery代码：

function callActionUsingAjax(urlAction, dataFields, callback) {
    $.ajax({
        type: "post",
        url: urlAction,
        data: dataFields,
        success: function (data) {
            callback(data);
        },
        error: function (data) {
            // Somehow process the validation messages,
            // like you seem to be doing already.
        }
    });

    // etc...
}

现在您有两个回调：一个在请求成功时调用，另一个在显示错误弹出窗口。后者甚至可以在多个页面上重复使用：）。

如果成功，则在弹出窗体中更改JQuery ajax重定向更改JSP页面的一部分

1 个答案: