ＵＴＦに移行されることなく１０年以上経過するレガシーシステム。既に画面遷移の設計が破綻ぎみ。やむを得ず、ＥＵＣで生成されているフォームをクライアントからバックグラウンドで送信することに。
ajax で POST するフォームの全てのデータをエンコードする
$('formname').serialize();
は、UTF8 前提の javascript なので EUC-JP や ShiftJIS なフォームであっても UTF8 として送信してしまう。
●前提環境
PHP Version 5.6.15
default_charset = EUC-JP
mbstring.language = Japanese
mbstring.encoding_translation = Off
mbstring.detect_order = auto
jQuery JavaScript Library v1.6.2
今回は、
http://polygon-planet-log.blogspot.jp/2012/04/javascript.html
の encoding.js を利用させていただく場合の具体的な実装例...▼
ajax で POST するフォームの全てのデータをエンコードする
$('formname').serialize();
は、UTF8 前提の javascript なので EUC-JP や ShiftJIS なフォームであっても UTF8 として送信してしまう。
●前提環境
PHP Version 5.6.15
default_charset = EUC-JP
mbstring.language = Japanese
mbstring.encoding_translation = Off
mbstring.detect_order = auto
jQuery JavaScript Library v1.6.2
今回は、
http://polygon-planet-log.blogspot.jp/2012/04/javascript.html
の encoding.js を利用させていただく場合の具体的な実装例...▼
index.php はEUCで
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-JP">
<title>TITLE</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="./encoding.js"></script>
<script type="text/javascript">
<!--
function serializeFormEUCJP( idForm ){
var str2array = function(str){
var array = [],i,il=str.length;
for(i=0;i<il;i++) array.push(str.charCodeAt(i));
return array;
};
var forms = document.getElementById( idForm );
var array = [];
for(var i = 0; i < forms.length; i++){
var elem = forms.elements[i];
var strArray = str2array( elem.value );
strArray = Encoding.convert(strArray,"EUCJP");
array.push(encodeURIComponent(elem.name) + '=' + Encoding.urlEncode(strArray) );
}
return array.join('&');
}
function test(){
/// var q = $('#form2ajax').serialize();
var q = serializeFormEUCJP( "form2ajax" );
$.ajax({
url: "./index.php",
data: q,
success: function(r){alert(r);},
cache: false,
dataType: "html",
type: "POST"
});
}
// -->
</script>
</head>
<body>
<div>ポストされた値：<?php echo $_POST['p1']; ?></div>
<form id="form2ajax">
<input type="text" name="p1" value="">
<input type="button" onclick="javascript:test();" value="button">
</form>
</body>
</html>
このブログのフィードを取得
