1。概要
1.1アプリケーションシナリオ
ラインレポートを埋めて削除する場合、削除する内容が多いとクリックして1つずつ削除するのが面倒ですが、下図のような一括削除操作を実現するにはどうすればよいですか？
1.2実装のアイデア
この記事では2つの実装方法を提供しますが、どちらもチェックボタンがチェックされている行のすべての行番号を文字列配列に書き込み、それらをバッチで削除するという考え方は同じです。
2.例
2.1データを準備する
新しい通常のレポートを作成し、新しいデータセットds1を作成します。SQLクエリステートメントは次のとおりです。SELECT* FROM Sales
2.2設計表
セルA2に「ボタンコントロール」を追加し、ボタン名を「チェックの削除」に設定します。
セルA3に「チェックボタンコントロール」を追加し、左側の親セルをB3に設定します。
セルB3〜G3に「テキストコントロール」を追加します。
テーブル効果を次の図に示します。
2.3レポートプロパティの設定
デザイナのメニューバーで、[テンプレート]> [レポート入力プロパティ]を選択し、「組み込みSQL」送信を追加します。具体的な設定を次の図に示します。
2.4方法1
1）セルA3を選択し、右側のプロパティパネルで[コントロール設定]> [イベント]を選択し、[イベントの追加]をクリックして、次の図に示すように、[初期化後のイベント]をチェックボタンに追加します。
JavaScriptコードは次のとおりです。
if (!window.lineboxes) {
window.lineboxes = [];//初始化数组
}
lineboxes[lineboxes.length] = this
2）セルA2を選択し、右側のプロパティパネルで[コントロール設定]> [イベント]を選択し、[イベントの追加]をクリックして、次の図に示すように、チェックボタンに[クリックイベント]を追加します。
JavaScriptコードは次のとおりです。
if(window.lineboxes) {
var cells = [];//建立空数组用于搜集勾选行号
for (var i = 0; i < lineboxes.length; i++) {
if (lineboxes[i].selected()) {//若复选框被勾选则执行以下
//将第1个勾选行号写入数组0位置，将第2个勾选行号写入数组1位置……
cells[cells.length] = lineboxes[i].options.location;
}
}
contentPane.deleteRows(cells); //批量删除选中的记录
setTimeout(function() {
contentPane.writeReport(); //保存到数据库，实现的是工具栏中提交的操作
}, 1000);
}
表示コード
2.5方法2
次の図に示すように、セルA2を選択し、右側のプロパティパネルで[コントロール設定]> [イベント]を選択し、[イベントの追加]をクリックして、チェックボタンに[クリックイベント]を追加します。
JavaScriptコードは次のとおりです。
var $span = $('.fr-checkbox-checkon'); //获取选中的复选框
var darray = []; //新建一个数组用来存放选中的单元格所在的行号
var $tds = $("td").has($span); //获取选中复选框所在的单元格，即选中的单元格
for (var i = 0, len = $tds.length; i < len; i ++) { //遍历选中的单元格
var id = $($tds[i]).attr("id"); //获取选中的单元格所在的行号
if (id) {
darray.push(id); //将选中的单元格所在的行号放入到数组中
}
}
contentPane.deleteReportRC(null,darray); //第二个参数为行号
setTimeout(function() { //增加延时函数（功能：需要删除的列较多时，复选框上面的删除
contentPane.writeReport(); //勾选还未执行完成，就执行填报事件，填报时找不到行号，就会报错。
}, 1000); //增加延时函数，保证在删除勾选事件执行完后，才执行填报事件）
表示コード
注：このメソッドのJSコードは、「新しい塗りつぶしプレビュー」をサポートしていません。
2.6エフェクトプレビュー
レポートを保存し、[塗りつぶしのプレビュー]または[新しい塗りつぶしのプレビュー]をクリックすると、効果は次の図のようになります。
注：モバイル端末はサポートされていません。
3.テンプレートのダウンロード
1）方法1
完成したテンプレートについては、次を参照してください：％FR_HOME％\ webapps \ webroot \ WEB-INF \ reportlets \ doc \ Form \ LineForm \ Line Form Reporting Batch Delete-Method One.cpt
クリックしてテンプレートをダウンロードします：行入力バッチ削除メソッドone.cpt
2）方法2
完成したテンプレートについては、％FR_HOME％\ webapps \ webroot \ WEB-INF \ reportlets \ doc \ Form \ LineForm \ Line-fillingバッチ削除-メソッドtwo.cptを参照してください。
クリックしてテンプレートをダウンロードします。バッチ削除の行入力-メソッドtwo.cpt