jspページで弾窓を利用してデータを追加
2656 ワード
バックグラウンドでデータを管理するとき、私たちは弾窓を利用して多くのことをすることができます.例えば、データを増やすことができます.原理はlayer弾窓技術を利用して別のフロントエンドページを開いてフォームを提出し、ページをリフレッシュすることです.もちろん、局所的にリフレッシュすることもできます.
具体的な実装:
総ページでボタンバインドイベントを追加するlayerポップアップに基づいて別のjspウィンドウを直接開き、別のjspページでformフォームをバインドしてバックエンドに直接送信して追加データのactionを実行するように設定しますが、このactionで他のビュージャンプを設定することはできません.このメソッドの戻り値を空に設定したほうがいいです.
バックエンドコード:
バックエンドコードは比較的簡単で、簡単な増加方法です.
フロントエンドjspコード:
ポップアップウィンドウを開く関数と呼び出す方法を定義するために、もう一つの追加データのjspページの主な機能は、フォームを表示してユーザーがデータを入力し、コミットをクリックして追加方法を実行してポップアップウィンドウを閉じることです.
その他の設定フォームコードは省略します:キーコードを見て、フォームのコードを提出します
本来は2行のコードを直接呼び出してフォームを直接検証した後にポップアップウィンドウを閉じるのですが、この2行のコードを直接実行するとフォームのコミットとクローズポップアップウィンドウは1つしか実行できないことに気づき、何度も試してもだめなのか、フォームがポップアップウィンドウをコミットして閉じていないのか、順番を変えてポップアップウィンドウを閉じることになりますが、フォームがコミットされていない増加方法は実行されません.
form.submit();
var index = parent.layer.getFrameIndex(window.name);
parent.parent.layer.close(index);
だから私はajaxでフォームのコミットを実行する方法を追加して、それからフォームのコミット後に直接親ページをリフレッシュして、直接リフレッシュする親ページなのでフォームは手動で閉じる必要はありません.だから私は上の増加データのaction方法の戻り値を直接空にして、ジャンプを実現する必要はありません.彼は増加したデータを実行する方法にすぎない.
最後にいくつかの弾窓の閉鎖方法を添付します.
var index = parent.layer.getFrameIndex(window.name);//ポップアップウィンドウのインデックスの取得
parent.parent.layer.close(index);//索引に基づいて指定した弾窓を閉じる
すべてを直接閉じる:
layer.closeAll();/すべてのレイヤーを閉じる
layer.closeAll('dialog');//情報ボックスを閉じる
layer.closeAll('page');//すべてのページレイヤを閉じる
layer.closeAll('iframe');//すべてのiframeレイヤを閉じる
layer.closeAll('loading');//ロードレイヤを閉じる
layer.closeAll('tips'); すべてのtipsレイヤを閉じる
具体的な実装:
総ページでボタンバインドイベントを追加するlayerポップアップに基づいて別のjspウィンドウを直接開き、別のjspページでformフォームをバインドしてバックエンドに直接送信して追加データのactionを実行するように設定しますが、このactionで他のビュージャンプを設定することはできません.このメソッドの戻り値を空に設定したほうがいいです.
バックエンドコード:
@RequestMapping(value="/addLabelDir")
public void addLabelDir(Model model,LabelDir vo) {
service.addLabelDir(vo);
}
バックエンドコードは比較的簡単で、簡単な増加方法です.
フロントエンドjspコード:
の
/* - */
function member_add(title, url, w, h) {
layer_show(title, url, w, h);
}
ポップアップウィンドウを開く関数と呼び出す方法を定義するために、もう一つの追加データのjspページの主な機能は、フォームを表示してユーザーがデータを入力し、コミットをクリックして追加方法を実行してポップアップウィンドウを閉じることです.
その他の設定フォームコードは省略します:キーコードを見て、フォームのコードを提出します
$("#form-member-add").validate({ //
rules:{
name:{
required:true,
minlength:2,
maxlength:16
},
growTime:{
required:true,
},
uploadfile:{
required:true,
},
} ,
submitHandler:function(form){
save();
alert(" ");
}
});
本来は2行のコードを直接呼び出してフォームを直接検証した後にポップアップウィンドウを閉じるのですが、この2行のコードを直接実行するとフォームのコミットとクローズポップアップウィンドウは1つしか実行できないことに気づき、何度も試してもだめなのか、フォームがポップアップウィンドウをコミットして閉じていないのか、順番を変えてポップアップウィンドウを閉じることになりますが、フォームがコミットされていない増加方法は実行されません.
form.submit();
var index = parent.layer.getFrameIndex(window.name);
parent.parent.layer.close(index);
だから私はajaxでフォームのコミットを実行する方法を追加して、それからフォームのコミット後に直接親ページをリフレッシュして、直接リフレッシュする親ページなのでフォームは手動で閉じる必要はありません.だから私は上の増加データのaction方法の戻り値を直接空にして、ジャンプを実現する必要はありません.彼は増加したデータを実行する方法にすぎない.
function save(){
$.ajax({
type:"post",
url:"${pageContext.request.contextPath}/addDictionary.action",
data: $("#form-member-add").serialize(),//
complete: function() {
window.parent.location.reload();//
}
});
}
最後にいくつかの弾窓の閉鎖方法を添付します.
var index = parent.layer.getFrameIndex(window.name);//ポップアップウィンドウのインデックスの取得
parent.parent.layer.close(index);//索引に基づいて指定した弾窓を閉じる
すべてを直接閉じる:
layer.closeAll();/すべてのレイヤーを閉じる
layer.closeAll('dialog');//情報ボックスを閉じる
layer.closeAll('page');//すべてのページレイヤを閉じる
layer.closeAll('iframe');//すべてのiframeレイヤを閉じる
layer.closeAll('loading');//ロードレイヤを閉じる
layer.closeAll('tips'); すべてのtipsレイヤを閉じる