EasyUI Forum

General Category => Bug Report => Topic started by: ljpxg on May 26, 2017, 01:42:55 AM



Title: textbox with multiline more space character encode error
Post by: ljpxg on May 26, 2017, 01:42:55 AM
try to input some character in textbox , and post to php server, the php receive data was wrong, not the string which we input in the textbox.

example, in multiline textbox , we input three character: char '1' and space character, then enter into new line, input char '2' at second line, and finished to post.

the string which we input into textbox is '1 \n2', then get the textbox value by $("#test").textbox("getValue") , and the value in hex is \x31,\xa0,\x0a,\x32 . this hex string is wrong ,the correct hex string is \x31,\x20,\x0A,\x32.

the php server receive string hex is different, our php code receive string in hex is \x31,\xc2,\xa0,\x0a,\x32. the \xc2,\xa0 is not our input character.

we try chrome debug tools catch the post header , found the form data encoding was : data=1%C2%A0%0A2.  "%C2%A0%" this string should be "%20", but i can't found any function can change the form data encoding by the web browser.

finally , i use textarea replace textbox in html file,  then the php server receive right string which we input into the textarea.



all test source as following:
test.html file:
-------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>oracle</title>
<script src="jquery-easyui-1.4.2/jquery.min.js"></script>
<script src="jquery-easyui-1.4.2/jquery.easyui.min.js"></script>
<script src="jquery-easyui-1.4.2/locale/easyui-lang-zh_CN.js"></script>
<script src="common.js"></script>
<link href="jquery-easyui-1.4.2/themes/default/easyui.css"
        type="text/css" rel="stylesheet">
<link href="jquery-easyui-1.4.2/themes/icon.css" type="text/css"
        rel="stylesheet">

</head>
<body>

        <div style="margin:20px 0;"></div>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="test_submit()">Add</a><br>
        <input class="easyui-textbox" data-options="multiline:true"  id="test"  style="white-space:pre-wrap;width:200px;height:100px"></input>
</body>
</html>



javascript common.js
-----------------------------------------------------------------------
function test_submit()
{
        var txt=$("#test").textbox("getValue");
        var u_txt=stringToHex(txt);

        $.post("test.php", {
                "data" : txt
        }, function(data) {
              $.messager.alert('error',u_txt+'\n'+data, 'error');
        });

}
function stringToHex(str){
        var val=new Array();
        for(var i = 0; i < str.length; i++){
                var tmp='0'+str.charCodeAt(i).toString(16);
                val.push(tmp.substr(-2));
    }
        return val;
}



php test.php
------------------------------------------
<?php

function str2hex($str) {
        $ret = "";
        for($i = 0; $i < strlen ( $str ); ++ $i) {
                $c = $str [$i];
                $ac = ord ( $c );
                $p = "0" . strval ( dechex ( intval ( $ac ) ) );
                $ret .= substr ( $p, - 2 );
        }
        return $ret;
}

$data=$_POST["data"];
echo str2hex($data);

?>



os: windows server 2008R2  x64 sp1
browser: google chrome 37.0.2062.103
jquery-easyui-1.4.2


Title: Re: textbox with multiline more space character encode error
Post by: jarry on May 26, 2017, 08:11:59 PM
Please update the EasyUI to a newer version, or try to include this code to your page.
Code:
<style>
  .textbox textbox-text{
    white-space: pre-wrap;
  }
</style>