0

私はjqueryダイアログを使用しており、jqueryダイアログボックス内にJqGridを表示しています。すべてが完全に正常に機能していますが、JqGrid は編集不可能なモーダルとして表示されています。そのため、ダイアログボックス内で何でも編集できました。

ダイアログボックスを閉じて再度開いても同じままですが、ページを更新した場合にのみ、ダイアログボックス全体が編集不可能なモーダルとして表示されるまで正常になります...

コードロジックはうまく機能します..UIの問題のようです..親切に助けてください..とにかく、参考のために私のコードを以下に投稿しています..親切にそれを見て、問題を解決するのを手伝ってください..

これは私の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;


    });
4

1 に答える 1

0

z-index が問題かもしれません。これは、より大きな z-index を使用したサンプル コードの例 (http://jsfiddle.net/c3BPP/) であり、動作します。100 のような z-Index では編集不可

それを試してみてください。

于 2012-12-11T05:41:02.757 に答える