2

在对 struts2 动作类的 ajax 调用之后，我有以下 json-data：

{"jsonData":[{"age":1,"name":"Aifa"},{"age":2,"name":"Afraa"},{"age":27,"name":"Zafar"}],"searchId":0,"searchName":""}

function setAjaxOutput()    {
        if(httpObject.readyState == 4)  {
            document.getElementById('intValueDiv').innerHTML = httpObject.responseText;

            var jsonString = httpObject.responseText;
            alert(jsonString);
            var jsonString2 = JSON.parse(jsonString);            
            alert(jsonString2.jsonData[2].name);           
          }

     }

json 数据将在 httpObject.responseText 中。

现在使用 jqgrid，看起来，上面的代码不是必需的，但我还不知道如何使用 jqgrid 进行 ajax 调用，接收 json 数据，并在表格中显示。

我正在尝试使用 jqgrid 以网格格式仅显示从动作类返回的 jsonData-array。代码如下。

[{"age":1,"name":"A"},{"age":2,"name":"Ab"},{"age":3,"name":"abc"}]

我可以调用 click()，但想调用'jQuery("#list2").jqGrid().

你能否让我知道，我想如何进行更改，所以我可以：

1）发送ajax请求：

url: 'callAJax.action?start=1&t='+Math.random()+ 'testFlag=1'

Should single quotes be replaced with double quotes? Please let me know.

另外，我如何找到，无论是 divId1 还是 divId2，都在下面单击。

  var $target = $(event.target);
  if( $target.is("div") ) { // div is tag, how to check for id.

    testFlag=1/2;
  }

2) 而且，当 json 数据显示在网格中时，我想为每一行添加按钮，单击该按钮时，我想读取行数据，并对 action-class url 进行 Ajax 调用。

请让我知道，如何实现这一点。

<%@taglib prefix="s" uri="/struts-tags" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>

        <head>
            <title>AJAX JSP PAGE</title>
            <link rel="stylesheet" href="styles/jqx.base.css"
            type="text/css" />
            <link rel="stylesheet" href="styles/jqx.classic.css" type="text/css" />
            <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
            <script type="text/javascript" src="jqxcore.js"></script>
            <script type="text/javascript" src="jqxbuttons.js"></script>
            <script type="text/javascript" src="jqxscrollbar.js"></script>
            <script type="text/javascript" src="jqxmenu.js"></script>
            <script type="text/javascript" src="jqxgrid.js"></script>
            <script type="text/javascript" src="jqxdata.js"></script>
            <script type="text/javascript">
                var start = 0;
                var idAndName = "";
                var rowId = 0;
                var searchId = 0;
                var searchName = "";


                $(document)
                    .ready(function () {


                    alert("document loaded.");


                    $("#editgrid")
                        .jqGrid({

                        url: 'callAJax.action?t=1',
                        datatype: "json",
                        myType: 'GET',
                        colNames: ['name', 'age'],

                        colModel: [

                        {
                            name: 'name',
                            index: 'name',
                            width: 80,
                            editable: true,
                            editoptions: {
                                size: 10
                            }
                        },

                        {
                            name: 'age',
                            index: 'age',
                            width: 90,
                            editable: true,
                            editoptions: {
                                size: 25
                            }
                        }

                        ],

                        rowNum: 10,
                        rowList: [10, 20, 30],
                        pager: '#pagered',
                        sortname: 'name',
                        viewrecords: true,
                        sortorder: "desc",
                        caption: "Editing Example",
                        editurl: "index.jsp"

                    });

                    $("#bedata")
                        .click(function (event) {

                        alert("Inside click function.");
                        jQuery("#editgrid")
                            .jqGrid('getGridParam', 'selrow');

                    });

                });
            </script>
        </head>

        <body>
            <center>
                 <h1>
                Use Ajax in Struts2
            </h1>

                <br/>
                <br/>
                <table id="editgrid"></table>
                <div id="pagered"></div>
                <input type="button" id="bedata" value="Edit Selected" />
            </center>
            <br/>
        </body>

    </html>

发生了什么，当我跑步时？

回答：

当我完全删除时$("#editgrid")..jqGrid({})，我看到消息“已加载文档”。

当我单击按钮时，我看到消息“内部单击功能”。

但是，当我部分或全部添加$("#editgrid")..jqGrid({})块时，我只看到“已加载文档”，但在单击按钮时，未显示“内部单击功能”消息。

如果您想了解更多信息，请告诉我。一如既往，谢谢！！

4

0 回答 0