0

我使用了 JQX 网格小部件。通过 javascript 我正在填充单元格值。这适用于 Firefox。但不适用于 Chrome。这是我使用的代码。

    var objCredit = jQuery.parseJSON(returnText);
    document.getElementById('txtCustNumber').value = objCredit.CustomerId;
    $('[id$=txtCustNumber]').text(objCredit.CustomerId);
    getCustomerDetails();
    document.getElementById('cmbDocType').value = '3';

    ***documentGridContainer.jqxGrid('setcellvalue', 0, 'Amount', objCredit.Amount);***

这是我的网格定义。

    var source1 = { totalrecords: 5, unboundmode: true, datatype: "json",
    datafields: [
                    { name: 'LineId' },
                    { name: 'DistCode' },
                    { name: 'distFinder' },
                    { name: 'DistCodeDesc' },
                    { name: 'RevAccount' },
                    { name: 'revAccountFinder' },
                    { name: 'RevAccDesc' },
                    { name: 'Amount', type: 'float' },
                    { name: 'PrintComment' },
                    { name: 'Comment' },
                    { name: 'Discountable', type: 'string' },
                    { name: 'OptionalField' },
                    { name: 'optionalFieldFinder' }
                ],
    localdata: data

};

var dataAdapter1 = new $.jqx.dataAdapter(source1);



documentGridContainer.jqxGrid(
    {
        width: 975,
        source: dataAdapter1,
        theme: '',
        editable: true,
        enabletooltips: true,
        columnsresize: true,
        autoheight: true,
        selectionmode: 'singlecell',
        columns: [
            { text: 'Line Number', columntype: 'textbox', datafield: 'LineId', width: 100, editable: false },
            { text: 'Dist.Code', columntype: 'textbox', datafield: 'DistCode', width: 80 },
            { text: '', datafield: 'distFinder', columntype: 'button', width: 30, resizable: false, cellsrenderer: function () { },
                buttonclick: function (row) {
                    editrow = row;
                    showDocumentDistFinder(editrow);

                }
            },
            { text: 'Description', datafield: 'DistCodeDesc', columntype: 'textbox', width: 150, editable: false },
            { text: 'Revenue Account', datafield: 'RevAccount', columntype: 'textbox', width: 150 },
            { text: '', datafield: 'revAccountFinder', columntype: 'button', width: 30, resizable: false, cellsrenderer: function () { },
                buttonclick: function (row) {
                    editrow = row;
                    showDocumentRevenueFinder(editrow);
                }
            },
            { text: 'Acc. Description', datafield: 'RevAccDesc', columntype: 'textbox', width: 150, editable: false },
            { text: 'Amount', datafield: 'Amount', cellsformat: 'f2', cellsalign: 'right', align: 'right', width: 80, editable: setAmountEditable() },
        //{ text: 'Print Comment', datafield: 'PrintComment', width: 150 },
            {text: 'Prt Comment', datafield: 'PrintComment', width: 93, columntype: 'dropdownlist',
            createeditor: function (row, column, editor) {
                // assign a new data source to the dropdownlist.
                var list = ['Yes', 'No'];
                editor.jqxDropDownList({ source: list });
            },
            // update the editor's value before saving it.
            cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                // return the old value, if the new value is empty.
                if (newvalue == "") return oldvalue;
            }
        },
            { text: 'Comment', datafield: 'Comment', width: 250 },
        //{ text: 'Discountable', datafield: 'Discountable', width: 100 }
            {text: 'Discountable', datafield: 'Discountable', width: 93, columntype: 'dropdownlist',
            createeditor: function (row, column, editor) {
                // assign a new data source to the dropdownlist.
                var list = ['Yes', 'No'];
                editor.jqxDropDownList({ source: list });
            },
            // update the editor's value before saving it.
            cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                // return the old value, if the new value is empty.
                if (newvalue == "") return oldvalue;
            }
        },
            { text: 'Optional Field', datafield: 'OptionalField', width: 100 },
            { text: '', datafield: 'optionalFieldFinder', columntype: 'button', width: 30, cellsrenderer: function () { },
                buttonclick: function (row) {
                    editrow = row;
                    createDocumentOptionalFields(editrow);
                    $('#model-documentOptionField').modal('show');
                }

            }
        ]
    });

提前致谢

4

1 回答 1

0

您的初始化不正确。数据类型：未绑定模式下的“json”没有意义。你应该删除它。下面是一个工作示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.edit.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script> 
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var source1 = {
                totalrecords: 5, unboundmode: true, 
                datafields: [
                                { name: 'LineId' },
                                { name: 'DistCode' },
                                { name: 'distFinder' },
                                { name: 'DistCodeDesc' },
                                { name: 'RevAccount' },
                                { name: 'revAccountFinder' },
                                { name: 'RevAccDesc' },
                                { name: 'Amount', type: 'float' },
                                { name: 'PrintComment' },
                                { name: 'Comment' },
                                { name: 'Discountable', type: 'string' },
                                { name: 'OptionalField' },
                                { name: 'optionalFieldFinder' }
                ]
            };

            var dataAdapter1 = new $.jqx.dataAdapter(source1);

            var documentGridContainer = $("#jqxgrid");

            documentGridContainer.jqxGrid(
                {
                    width: 975,
                    source: dataAdapter1,
                    theme: '',
                    editable: true,
                    enabletooltips: true,
                    columnsresize: true,
                    ready: function()
                    {
                        documentGridContainer.jqxGrid('setcellvalue', 0, 'Amount', 50);
                    },
                    autoheight: true,
                    selectionmode: 'singlecell',
                    columns: [
                        { text: 'Line Number', columntype: 'textbox', datafield: 'LineId', width: 100, editable: false },
                        { text: 'Dist.Code', columntype: 'textbox', datafield: 'DistCode', width: 80 },
                        {
                            text: '', datafield: 'distFinder', columntype: 'button', width: 30, resizable: false, cellsrenderer: function () { },
                            buttonclick: function (row) {
                                editrow = row;
                                showDocumentDistFinder(editrow);

                            }
                        },
                        { text: 'Description', datafield: 'DistCodeDesc', columntype: 'textbox', width: 150, editable: false },
                        { text: 'Revenue Account', datafield: 'RevAccount', columntype: 'textbox', width: 150 },
                        {
                            text: '', datafield: 'revAccountFinder', columntype: 'button', width: 30, resizable: false, cellsrenderer: function () { },
                            buttonclick: function (row) {
                                editrow = row;
                                //showDocumentRevenueFinder(editrow);
                            }
                        },
                        { text: 'Acc. Description', datafield: 'RevAccDesc', columntype: 'textbox', width: 150, editable: false },
                        { text: 'Amount', datafield: 'Amount', cellsformat: 'f2', cellsalign: 'right', align: 'right', width: 80, editable: true },
                    //{ text: 'Print Comment', datafield: 'PrintComment', width: 150 },
                        {
                            text: 'Prt Comment', datafield: 'PrintComment', width: 93, columntype: 'dropdownlist',
                            createeditor: function (row, column, editor) {
                                // assign a new data source to the dropdownlist.
                                var list = ['Yes', 'No'];
                                editor.jqxDropDownList({ source: list });
                            },
                            // update the editor's value before saving it.
                            cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                                // return the old value, if the new value is empty.
                                if (newvalue == "") return oldvalue;
                            }
                        },
                        { text: 'Comment', datafield: 'Comment', width: 250 },
                    //{ text: 'Discountable', datafield: 'Discountable', width: 100 }
                        {
                            text: 'Discountable', datafield: 'Discountable', width: 93, columntype: 'dropdownlist',
                            createeditor: function (row, column, editor) {
                                // assign a new data source to the dropdownlist.
                                var list = ['Yes', 'No'];
                                editor.jqxDropDownList({ source: list });
                            },
                            // update the editor's value before saving it.
                            cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                                // return the old value, if the new value is empty.
                                if (newvalue == "") return oldvalue;
                            }
                        },
                        { text: 'Optional Field', datafield: 'OptionalField', width: 100 },
                        {
                            text: '', datafield: 'optionalFieldFinder', columntype: 'button', width: 30, cellsrenderer: function () { },
                            buttonclick: function (row) {
                                editrow = row;
                                createDocumentOptionalFields(editrow);
                                $('#model-documentOptionField').modal('show');
                            }

                        }
                    ]
                });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget'>
        <div id="jqxgrid">
        </div>
    </div>
</body>
</html>
于 2013-08-26T17:17:21.410 回答