JqG​​rid在jquery对话框中显示为不可编辑的模式

时间:2012-12-10 15:10:04

标签: jquery asp.net css jqgrid jquery-dialog

我正在使用jquery对话框并在jquery对话框中显示JqGrid。一切都工作得很好,但JqGrid显示为不可编辑的模态。所以我无法在对话框中编辑任何内容。

即使我关闭并重新打开对话框,它仍然保持不变,只有当我刷新页面时才变为正常,直到整个对话框显示为不可编辑的模态...

代码逻辑效果很好..这似乎是一个用户界面问题..请帮助我..不知何故我发布下面的代码供您参考..明确地查看并帮助我解决问题。

这是我的aspx代码:

<div>
<span id="span_create" style="color: #88b807; margin-left: 839px;
                            margin-top: -12px; cursor: pointer; display: block">Create</span>
</div>
     <div id="Createdialog" style="display: none; overflow: hidden">
                    <table id="table" style="border-spacing: 7px 7px; margin-left: 5px">
                        <tr>
                            <td>
                                <span class="SubHeading" style="font-size: 10pt;">Private Space Name </span>
                            </td>
                            <td>
                                <asp:TextBox ID="txt_spacename" runat="server" />
                            </td>
                        </tr>

                        <tr>
                            <td>
                                <span class="SubHeading" style="font-size: 10pt;">Users </span>
                            </td>
                            <td>
                                <asp:TextBox ID="txt_users" TextMode="MultiLine" runat="server" />
                            </td>
                            <td>
                                <asp:Button ID="btn_addusers" Text="Add" Style="margin-left: 0px;" runat="server" />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <table id="users_grid">
                                </table>
                            </td>
                        </tr>
                    </table>
                    <input type="button" id="Btn_Submit" value="Create" style="margin-left: 280px; margin-top: 8px;"
                        runat="server" />
                </div>

这是我的Js代码:

$("#Createdialog").dialog({
                autoOpen: false,
                title: 'Create Private space',
                modal: true,
                position: 'center',
                width: 900

            });

            $('#span_create').click(function() {
                $("#Createdialog").find('input:text, textarea').val('');
                $('#Createdialog').dialog('open');
                return false;
            });

$('#btn_addusers').click(function() {

        $("#users_grid").jqGrid({

            colNames: ['User_ID', 'Name', 'Email_Id'],
            colModel: [{ name: 'User_ID', index: 'User ID', width: 130, editable: false, sortable: false },
            { name: 'Name', index: 'Name', width: 350, editable: false, sortable: false },
            { name: 'Email_Id', index: 'Email Id', width: 350, editable: false, sortable: false}],

            width: 400,
            height: 'auto',
            multiselect: true,
            modal: false

        });


        var UserID = $('#Header1_txt_users').val();
        var datapost = {};


        datapost.UserId = UserID;
        var postJSONData = JSON.stringify({ 'postdata': JSON.stringify(datapost) });


        $.ajax({
            type: 'POST',
            data: postJSONData,
            url: 'PrivateSpaceService.asmx/GetUserDetails',
            dataType: 'json',
            async: false,
            contentType: 'application/json; charset=utf-8',
            success: function success(response) {

                UserArr = response.d;

            },
            error: function failure(response) {
                alert('failed');
            }
        });

        var mydata;


        for (var i = 0; i < UserArr.length; i++) {


            mydata = {};


            mydata.User_ID = UserArr[i].UserId;
            mydata.Name = UserArr[i].UserName;
            mydata.Email_Id = UserArr[i].EmailId;

            $("#users_grid").jqGrid('addRowData', 'GridData_Row_' + (i + 1), mydata);


        }
        return false;


    });

1 个答案:

答案 0 :(得分:0)

可能是z-index是问题所在。这是一个示例代码的示例(http://jsfiddle.net/c3BPP/),它具有更大的z-index,并且可以正常工作。与z-Index如100不可编辑

试一试。