SSMフレーム前後端情報インタラクティブ実現フローの詳細
一、前端から後端にデータを転送する
よくある3つの方法
1、フォームのaction:この方法はフォーム内の入力データを提出してもいいです。隠してもデフォルトの値が設定されている「input」を同時に提出してもいいです。もし問題を修正する時、問題に関する情報を提出する以外に、ユーザーの番号を後端に提出する必要があります。この時、デフォルト値をユーザー番号の「input」に設定して、隠します。
2、ラベルのhref属性:この方法は一般的にオーブの番号などの少ないデカデカを提出するためのものです。1$title
例えば、該当コードは問題のタイトル情報を表示し、ハイパーリンクとしてこのリンクをクリックしてバックエンドコントローラ類に入る方法で、問題番号question_を送信します。id。
3、ajax要求:この方法は一般的にページジャンプが必要でない時に採用され、ページを部分的に更新することができます。例えば、バックエンドにあるユーザーに関心を持つ情報を提出し、バックエンドにajaxの要求データを受け取って、データベースを操作し、@Response注解を通じて情報を先端に戻します。バックエンドに関連操作を行うと、ページジャンプを行わなくてもいいです。
先端部分コード
1、Model
バックエンド部分コード
2、ModelAndView
この方法はModelに比べてリターンビューが多くなり、フロントエンドに戻るための具体的なデータ処理と同様である。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。
よくある3つの方法
1、フォームのaction:この方法はフォーム内の入力データを提出してもいいです。隠してもデフォルトの値が設定されている「input」を同時に提出してもいいです。もし問題を修正する時、問題に関する情報を提出する以外に、ユーザーの番号を後端に提出する必要があります。この時、デフォルト値をユーザー番号の「input」に設定して、隠します。
2、ラベルのhref属性:この方法は一般的にオーブの番号などの少ないデカデカを提出するためのものです。1$title
例えば、該当コードは問題のタイトル情報を表示し、ハイパーリンクとしてこのリンクをクリックしてバックエンドコントローラ類に入る方法で、問題番号question_を送信します。id。
3、ajax要求:この方法は一般的にページジャンプが必要でない時に採用され、ページを部分的に更新することができます。例えば、バックエンドにあるユーザーに関心を持つ情報を提出し、バックエンドにajaxの要求データを受け取って、データベースを操作し、@Response注解を通じて情報を先端に戻します。バックエンドに関連操作を行うと、ページジャンプを行わなくてもいいです。
先端部分コード
<script language="JavaScript">
......
function SaveUserFollowUser(){
var login_user_id = ${login_user_id} // ( )
var user_id = ${user.user_id}; //
$.ajax({
url:"<%=path%>/UserRelation/SaveUserFollowUser",
type:"POST",
async: false,
contentType:"application/json;charset=UTF-8",
dataType:'json',
data:JSON.stringify({"from_user_id":login_user_id,"to_user_id":user_id}), //JSON
success:function(data){
/* */
if (data == true) {
alert(" ");
} else {
alert(" , ")
}
}
});
}
</script>
......
<button class="btn btn-success" style="width: 100px" onclick="SaveUserFollowUser()"> </button>
......
バックエンドコントローラ類
/**
* ( 、 、 、 )
*/
@Controller
@RequestMapping("/UserRelation")
public class UserRelationController {
......
/**
*
* @param map
* @return
*/
@RequestMapping(value = "/SaveUserFollowUser",method = {RequestMethod.POST})
public @ResponseBody Boolean SaveUserFollowUser(@RequestBody Map<String,String> map) {
//
Integer from_user_id = Integer.parseInt(map.get("from_user_id"));
//
Integer to_user_id = Integer.parseInt(map.get("to_user_id"));
//
// , from_user_id to_user_id ,
// Integer Boolean
Boolean flag = userRelationService.saveUserFollowUser(from_user_id,to_user_id);
return flag;
}
......
}
二、バックエンドから先端にデータを転送する1、Model
バックエンド部分コード
/**
*
*/
@Controller
@RequestMapping(value = "/User")
public class UserController {
......
/**
*
* @param httpSession
* @param model
* @return
*/
@RequestMapping(value = "/DisplayMyInfo")
public String DisplayMyInfo(HttpSession httpSession, Model model) {
Integer user_id = (Integer) httpSession.getAttribute("login_user_id"); //
User user = userService.findUserById(user_id); //
model.addAttribute("user",user); //
return "User/myInfo";
}
......
}
先端部分コード
......
<div class="col-md-6 col-md-offset-5" style="text-align: left;">
<h2> :${user.user_name}</h2>
<h2> :${user.user_nickname}</h2>
<h2> :${user.user_sex}</h2>
<h2> :${user.user_email}</h2>
<h2> :${user.user_password}</h2>
</div>
......
バックエンドから送られてきたデータは${}を通じて直接取得できます。2、ModelAndView
この方法はModelに比べてリターンビューが多くなり、フロントエンドに戻るための具体的なデータ処理と同様である。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。