1

HTML マークアップ

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.11/themes/redmond/jquery-ui.css" />
    <link href="Css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.11/themes/redmond/jquery-ui.css" />
    <link rel="Stylesheet" type="text/css" href="css/jpicker-1.1.6.min.css" />
    <link rel="Stylesheet" type="text/css" href="css/jPicker.css" />
    <link href="Css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
    <script src="JqueryScriptDownloads/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="Scripts/grid.locale-en.js" type="text/javascript"></script>
    <script src="Scripts/grid.locale-en.js" type="text/javascript"></script>
    <script src="Scripts/jquery.jqGrid.min.js" type="text/javascript"></script>
    <script src="Scripts/grid.locale-en.js" type="text/javascript"></script>
    <script src="Scripts/jquery.jqGrid.min.js" type="text/javascript"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" />
    <script src="JqueryScriptDownloads/jquery.simple-color.min.js" type="text/javascript"></script>
    <script src="JqueryScriptDownloads/SimpleColor.js" type="text/javascript"></script>
    <script src="Scripts/ReshimaMo.js" type="text/javascript"></script>
</head>`
<br/>

    <body>
    <form id="form1" runat="server">
    <uc1:TopControl ID="TopControl" runat="server" />
    <div id="UGPReshimaMo">
    </div>
    <table id="UGReshimaMo">
    </table>
    <input type="button" />
    </form>
</body>
</html>

JavaScript

$(document).ready(function () {

    $("#UGReshimaMo").jqGrid({
        url: 'Handler.ashx', 
        datatype: 'json',
        height: 250,

        colNames: ['צבע', 'רשומה', 'מפלגה', 'אות'],
        colModel: [
             { name: 'semel', width: 200, sortable: true, formatter: getPicker },
                { name: 'LongShem', width: 200, sortable: true },
                { name: 'Shem', width: 100, sortable: true },
                { name: 'Ot', width: 50, sortable: true },
            ],
        rowNum: 100,
        //postData: { spName: 'sp_get_hashala_for_kore', koreId: $("#koreId").value },
        postData: {
            spName: 'MakeRshimatHarshimot'
        },
        rowList: [10, 20, 30],
        pager: '#UGPReshimaMo',
        sortname: 'ot',
        viewrecords: true,
        sortorder: 'asc',
        caption: 'רשימת הרשימות',
        spName: '',
        koreId: ''
    });

    $("#UGReshimaMo").jqGrid('navGrid', '#UGPReshimaMo', { edit: false, add: false, del: false });
    function getPicker() {
        return "<span class='simple_color'/>";
   };
});

`

カラー ピッカーでグリッドを作成しようとすると機能しませんが、カラー ピッカーを単独で実行しようとすると機能します。問題は何ですか？これを解決するにはどうすればよいですか？

PS: カラーピッカーはhttp://recursive-design.com/projects/jquery-simple-color/からのものです

4

2 に答える 2

0

私は自分の質問に対する答えを見つけました。

このコードをjqGridインスタンスに追加しました：

loadComplete: function () {
    $('.simple_color').simpleColor();
}

完全なグリッド コードは次のとおりです。

$("#UGReshimaMo").jqGrid({
    url: 'Handler.ashx',
    datatype: 'json',
    height: 250,

    colNames: ['צבע', 'רשומה', 'מפלגה', 'אות'],
    colModel: [
         { name: 'semel', width: 500, sortable: true, formatter: getPicker },
            { name: 'LongShem', width: 200, sortable: true },
            { name: 'Shem', width: 100, sortable: true },
            { name: 'Ot', width: 50, sortable: true },
        ],
    rowNum: 100,
    //postData: { spName: 'sp_get_hashala_for_kore', koreId: $("#koreId").value },
    postData: {
        spName: 'MakeRshimatHarshimot'
    },
    rowList: [10, 20, 30],
    pager: '#UGPReshimaMo',
    sortname: 'ot',
    viewrecords: true,
    sortorder: 'asc',
    caption: 'רשימת הרשימות',
    spName: '',
    koreId: '',
    loadComplete: function () {
        $('.simple_color').simpleColor();
    }
});
于 2013-02-06T06:57:44.800 に答える
0

試す

function getPicker() {
    return "<span class='simple_color'></span>";
};

しかし、あなたが与えたリンクからわかるように、入力タグで使用されています

于 2013-02-05T14:12:51.477 に答える