入力フォームの行追加と行削除
Visualforceでの行追加・削除機能のサンプルです。 結構色んな要素を使ってて思ったよりもややこしかったので、忘れないうちにメモします。
行追加
これは思ってたよりも簡単に実装できます。
Accountのリスト型変数accountList
を作成して、コンストラクタでAccount型の変数account
をnewしてaddします。
こうすることで画面に遷移した際に、空のテキストボックスが1行表示されます。
追加もこれと同じ要領で、追加ボタンを押した際に空のaccount
がnewされて、accountList
にaddされればいいのです。
ただし、今回のサンプルではテキストボックスの項目が必須になっている為、一工夫してやらないとうまく追加されません。
Visualforceの方で、追加ボタンのコードにimmediate="true"
を設定してやることでこの問題を解決しています。
このimmediate="true"
というのは全ての検証ルールをスキップすることが出来るという事を意味します。(デフォルトはfalse)
immediate="true"
を指定せずに追加ボタンを押すと、必須項目に値が入っていないと怒られてしまいます。
行削除
こちらが色々な要素が入っていて意外とややこしいです。
まずパッと思いつくのは、accountList
から要素を削除したらいけそうだな、となりますよね。
でもaccountList
のインデックス(添え字)を指定してやらないと自分が削除したい行が消せないので、画面で指定した行番号を取得しないといけないという事になります。
なのでまず任意の行番号を取得するロジックが必要になります。
行番号指定
行番号指定には、Visualforceのvariable
というコードを使用します。
これはVisualforce内で変数を設定できるコードみたいです。
pageBlockTable
の上にvariable
を置き、変数count
を初期値0でセット。
pageBlockTable
内で要素がループする前に再度variable
を置き、count
に1を加算。
これで一行目には0、二行目には1と、行番号がセットされます。
行番号送信
次に、この各行にセットされた数値をコントローラに渡してやる必要があります。 渡すタイミングとしては削除ボタンを押下した時なので、その辺りに仕込みます。
まずcommandButton
のaction
に行削除メソッドを指定、こちらにも同じ理由でimmediate="true"
を指定します。
さらにreRender
に再描画したい範囲を指定してやります。
今回はform
全体を再描画したいので、form
のid値(form)を指定します。
commandButton
タグの間にparam
をセットします。
param
のname
に適当な値を指定、value
に行番号である変数count
を指定します。
これで削除ボタンを押下した際にこのparam
にセットした変数count
が送信されます。
行番号取得
コントローラで送信された行番号を取得していきます。
行削除メソッドでSystem.currentPageReference().getParameters().get('xxx')
を使用して送信された行番号を取得します。
xxxの部分はparam
のname
で指定した値です。
取得した値をInteger型に変換して、変数rowNumber
に代入します。
入力フォームが一行しかない場合は削除したくないので、accountList
のサイズが1より大きい場合のみrowNumber
のインデックスの要素を配列から削除します。
サンプルコード
public class AddDeleteRowController { public Account[] accountList {get;set;} public Integer rowNumber {get;set;} // コンストラクタ public addDeleteRowController(){ accountList = new List<Account>(); Account account = new Account(); accountList.add(account); } // 行追加 public void addRow(){ Account account = new Account(); accountList.add(account); } // 行削除 public void deleteRow(){ // 行番号取得 rowNumber = Integer.ValueOf(System.currentPageReference().getParameters().get('number')); // 一行以上の時に削除可能 if(accountList.size() > 1){ accountList.remove(rowNumber); } } }
<apex:page controller="AddDeleteRowController" showHeader="false" sidebar="false" > <apex:pageBlock title="取引先"> <apex:form id="form"> <!-- 行追加ボタン --> <apex:commandButton value="追加" immediate="true" action="{!addRow}" /> <!-- インデックス取得用の変数 --> <apex:variable value="{!0}" var="count"/> <apex:pageBlockTable value="{!accountList}" var="item"> <!-- 行削除ボタン --> <apex:column headerValue="行操作"> <apex:commandButton value="削除" immediate="true" action="{!deleteRow}" reRender="form" > <!-- 行のインデックスを送信する --> <apex:param name="number" value="{!count}" /> </apex:commandButton> <!-- ループするごとに+1 --> <apex:variable value="{!count + 1}" var="count"/> </apex:column> <apex:column headerValue="名称"> <apex:inputField value="{!item.Name}"/> </apex:column> </apex:pageBlockTable> </apex:form> </apex:pageBlock> </apex:page>
【Windows】Shipping Toolで画像が保存できない
Windows標準の画像領域切り取りアプリ、Shipping Toolで画像を切り取った後に保存ができないトラブルが発生しました。
症状を具体的にいうと、「アプリの起動→画像の切り取り」まではできるんですが、保存しようとしても何も動かないという状態です。
結論から言うと、Shipping Toolの保存先が標準でピクチャフォルダになっているのですが、この保存先が見当たらない場合は保存できないみたいです。 自分の普段の環境はノートパソコンに外付けストレージを付けて、そこにドキュメントフォルダやピクチャフォルダを紐づけているんですが、操作した時は外付けストレージを外していたのでこの現象が起こったみたいです。
分かってしまえば単純なんですが、エラーメッセージなどが何も出ないので気付けませんでした。 同じ症状が起こった人は参考にしてみてください。
Visualforceでのコンテンツ表示・非表示の切替え
Visualforceで、ある条件の時に表示非表示にする機能、つまりVisualforce内でIf文みたいなものが出来ないか調べたのでメモ。
結論としてはoutputPanel
タグのrendered
属性を利用すればできました。rendered
がtrueなら表示、falseなら非表示になります。(デフォルトはtrue)
RenderTestPage1
で「開けゴマ!」と入力したら次のページに文字が出るという簡単なサンプルを作成してみました。
<!-- RenderTestPage1 --> <apex:page Controller="RenderTestController"> 合言葉は「開けゴマ!」 <apex:form> <apex:inputText value="{!input}"/> <apex:commandLink action="{!nextPage}">次のページへ</apex:commandLink> </apex:form> </apex:page>
inputCheck
というメソッドを使用してtrue OR falseを取得する場合と、rendered
にif文の数式を書いてやればそこで表示判定をすることも可能です。
<!-- RenderTestPage2 --> <apex:page Controller="RenderTestController"> <div> <apex:outputPanel rendered="{!inputCheck}"> 正解! </apex:outputPanel> </div> <div> <apex:outputPanel rendered="{!IF(input='開けゴマ!',true,false)}"> 正解! </apex:outputPanel> </div> </apex:page>
public class RenderTestController{ // RenderTestPage1での入力値 public String input {get;set;} // コンストラクタ public RenderTestController(){ } // 合言葉判定メソッド public Boolean getInputCheck(){ if(input.equals('開けゴマ!')){ return true; }else{ return false; } } // ページ遷移メソッド public PageReference nextPage(){ return Page.RenderTestPage2.setRedirect(false); } }
画面はこんな感じになります。
因みにページ遷移のメソッドにsetRedirect(false)
付けてるんですが、なくても出来ちゃうんですよね。
付けてないと変数の保持できなかったはずなのに。。
【資格】ウェブデザイン検定3級合格しました
国家資格のウェブデザイン検定3級合格しました。
ぶっちゃけ3級だとあんまり意味ないと思いますが、国家資格を取った!みたいな感じでテンション上げれるので取得するのもいいんじゃないかと思います。 ちょっと自信も付きますし。
ウェブデザイン検定の有用性については下記参照。
勉強方法
公式サイトにて練習問題と過去問が公表されているので、それをひたすら解きました。
ただ問題があるのはいいんですが、問題の解説がついていないので、間違った時に根拠が分からずに理解が深まらなくて困っていました。
そんな時にネットで色々探していると、解説を載せてくれている親切なサイトを発見したのでそれを参考に理解を深めていきました。
これでも不安な人は、下記の本が試験対策テキストとして販売されているみたいなので買ってみてください。
ウェブデザイン技能検定過去問題集3級―特定非営利活動法人インターネットスキル認定普及協会 (FOM出版のみどりの本)
- 作者: インターネットスキル認定普及協会
- 出版社/メーカー: 富士通オフィス機器
- 発売日: 2014/03
- メディア: 大型本
- この商品を含むブログを見る
受けた感想
実技試験は過去問でちゃんと練習しててHTMLとCSSの知識がある程度あれば、はっきり言って楽勝だと思います。
ただ意外に難しいのが学科試験。結構幅広い範囲で出題してくるし、過去問や練習問題で見たことがないような内容の問題もいくつか出てきたのでちょっと焦りました。
実際、実技だけ受かって学科に落ちる人も結構多いみたいです。(試験会場も学科の人の方が多かった)
それでも割と手軽に取れる国家資格であることには違いないので、是非チャレンジしてみてください。
【J-HIPHOP】FUNKYMIC and the Saturdays Rism - GOTTA NEED FUNK
元韻シストのMC/HumanBeatBoxerのFUNKYMICが韻シスト加入前に活動していたユニット(から後にバンド)FUNKYMIC and the Saturdays Rismが2006年にリリースしたアルバムがカッコいいです。
プロデューサーであるchop the onionの作るトラックはがっつりファンクを意識したサウンドになっており、その上にFUNKYMICのイナタくもスキルフルなラップが相性抜群に絡み合って、まさにヒップでファンキーなアルバムになってます。
韻シスト加入前から既にFUNKYMICのフロウはほぼ完成しており、ビートに対してのアプローチや声の出し方が独創的で面白いです。
FUNKYMICのルーツを知りたい人にもおすすめの一枚。
おまけで2016年にFUNKYMICのソロアルバムで再びchop the onionとタッグを組んだ一曲がこちら。
パッドを同時に鳴らさない設定について
MPC Softwareでハイハットのオープンとクローズを同時に鳴らしたくない時等に行うパッドの設定方法のメモです。
画面の赤枠内、A03のパッドにクローズハイハット、画面の青枠内、A04のパッドにオープンハイハットをアサインしています。
この状態で画面緑枠内をクリック、もしくは使用している機材のPROGRAM EDIT
ボタンを押してください。
そうすると下記のような画面になると思います。
この画面の赤枠内、MUTE TARGET
に同時に鳴らしたくないパッドを4つまで設定することができます。
今回はA03を鳴らすとA04が鳴らなくなるようにしたいので、A03のMUTE TARGET
にA04を指定します。
ハイハット以外にも工夫すれば色々使い道があると思いますので試してみてください。
Akai Professional 音楽制作システム 7GB音源付き MPC Studio Black
- 出版社/メーカー: AKAI
- 発売日: 2016/03/07
- メディア: エレクトロニクス
- この商品を含むブログを見る
AKAI Professional 7インチタッチディスプレイ 音楽制作システム MPC TOUCH
- 出版社/メーカー: AKAI
- 発売日: 2015/12/11
- メディア: エレクトロニクス
- この商品を含むブログを見る
【J-HIPHOP】ハルビンズ弐拾五 - 波華横丁皿三昧
大阪アンダーグラウンドの雄、SUPPON RECORDS所属のトラックメーカーユニット、ハルビンズ弐拾五が2007年にリリースしたファーストアルバム。
メンバーはEarMadder,GDEN,Hi-Low★Kickの三名。
この三名の作る、濃く癖のあるトラックにSUPPON RECORDS周辺のMCsが負けないくらい濃いスキルフルなラップを乗せています。 しかもこの作品どうやら一日で作成したっぽいことを曲中で言っており、正直とんでもねえなと。
僕の中でこの作品で一番耳に残るのがMCマリヲのラップ。 ねっとりとしたフロウと声で癖になります。
トラックもラップも癖が強くて実験的なものも多く、オリジナリティ溢れるオルタナティブなラップ作品としてオススメです。
尖ったHIPHOPを聴きたい人は是非。