jqGrid グリッドデータをクリップボードにコピー

< 画面例 >

1) ナビゲーションボタンにコピーボタンを配置

2) クリックすると全選択 => 選択内容がクリップボードにコピーされる

< コード例 >

1) 呼び出し元


// クリップボードコピー //  
clipCopyButtonJSfunc($("#addrlist"), $("#addrlistpager"), "");

2) コピーボタン追加


**
 * jqGrid table contents copy to clipboard
 * @returns {undefined}
 */
function clipCopyButtonJSfunc(objtable, objpager, idcmpltdmsg) {

  // ==== Clipboard copy ==== //
  $(objtable).jqGrid('navButtonAdd', objpager,
          {
            caption: 'Copy',
            //id: "copygmapdest",
            title: "Copy table contents",
            onClickButton: function () {
              //alert($(this).attr("id"));
              selectDomElm(this);

              // 選択しているテキストをクリップボードにコピーする
              document.execCommand("Copy");
              // 選択の解除 //
              //window.getSelection().removeAllRanges();


            },
          }
  );


}

3) 指定DOMエレメント選択


// 指定DOMエレメント選択 //
function selectDomElm(obj) {
  // Rangeオブジェクトの取得
  var range = document.createRange();
  // 範囲の指定
  range.selectNodeContents(obj);

  // Selectionオブジェクトを返す。ユーザが選択した範囲が格納されている
  var selection = window.getSelection();
  // 選択をすべてクリア
  selection.removeAllRanges();
  // 新規の範囲を選択に指定
  selection.addRange(range);
}

ここで教えていただきました : https://9-bb.com/javascript-3/

jqGrid サブグリッドの表示非表示をプロパティでセット

jqGrid の最近のアップデートのドキュメントを見ていたら、ありましたので、早速実装してみました。

前は、loadComplete でグリッドデータをループして、クラスをセットしていたので、すっきりわかりやすくなりました。

isHasSubGrid: で出来ます。



 // ######### サブグリッド ######### //
 subGrid: true,
 isHasSubGrid: function (rowid) {   // <=== New from 5.3
   // if custommerid begin with B, do not use subgrid
   var cell = $(this).jqGrid('getCell', rowid, "cnt_img");
   //console.log(cell, rowid);
   if (cell && cell == 0) {    // <=== === は使えない
     return false;
   }
   return true;
 },
 subGridOptions: {
   // configure the icons from theme rolloer
   plusicon: "ui-icon-triangle-1-e",
   minusicon: "ui-icon-triangle-1-s",
   openicon: "ui-icon-arrowreturn-1-e"
 },
 subGridRowExpanded: showChildGrid,    // <=== 展開した時の処理
 // ######### サブグリッド ######### //     

Tesseract.js Javascript OCR文字認識

Canvas から切り抜いた画像でもって、OCRする必要あり、過去にtesseract を使ってサーバー側で処理した結果を応答する仕様のをリリースしたことがあり、今回もそれで行こうと思いましたが、
ちょっと調べたところ、何と、tesseract が Javascript で実行できるようになって、早速、利用してみました。

ここで教えて頂く : https://qiita.com/furunfuru/items/0ecf0a21273ae93bc060

< コード例 >


<script src='https://cdn.rawgit.com/naptha/tesseract.js/0.2.0/dist/tesseract.js'></script>


       // @@ 文字認識ボタンを押した時 @@ //
        $("#execocr").on("click", function (e) {

          //var img = $("#RecCanvas").toDataURL();
          // var img = document.getElementById("RecCanvas").toDataURL();
          var img = document.getElementById("RecCanvas").toDataURL("image/jpeg");

          Tesseract.recognize(img, {lang: "eng"}).then(function (result) {
            //const a = document.querySelector("#test");
            console.log(result);
            $("#ocrres").val(result.text);
          });
         });

< 対象画像 結果例 >