編集機能を備えた Kendo UI Grid とinline、フィールド ( propertyLogo)の 1 つがあり、 kendoUploadを使用して画像をアップロードしました。kendoUpload 関数fileUploadEditorを使用saveUrl: "./image.php",して、画像をbase64形式に変換してデータベースに保存します。propertyLogo追加/編集すると、NULL結果を返すフィールドを除いて、すべてのフィールドを正常に更新できました。どの部分が間違っているのかわかりませんが、画像をデータベースに保存できません。ここで、スクリプトを提供します。
マイ データソースとグリッド
/****************/
/** DATASOURCE **/
/****************/
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "./getPropertyMasterData.php",
type: "POST",
data: function() {
return {
method: "getPropertyMasterData",
}
}
},
update: {
url: "./getPropertyMasterData.php",
type: "POST",
data: function () {
console.log("I'm calling update!!");
return {
method: "editPropertyMasterData",
}
},
complete: function (e) {
$('#grid').data('kendoGrid').dataSource.read();
}
},
destroy: {
url: "./getPropertyMasterData.php",
type: "POST",
data: function () {
return {
method: "deletePropertyMasterData",
}
},
complete: function (e) {
$('#grid').data('kendoGrid').dataSource.read();
}
},
},
schema: {
model: {
id: "propertyID",
fields: {
propertyID: { editable: false, nullable: true }
active: { editable: false, nullable: false, defaultValue: 'y'},
propertyName: { editable: true,type: "string",validation: {required: {message: "Required"}} },
propertyLogo: { editable: true, type: "string",validation: {required: {message: "Required"}} },
propertyColor: { defaultValue: "#000", editable: true, validation: { required: {message: "Required"}} },
businessRegistrationNo: { editable: true,type: "string",validation: {required: {message: "Required"}} },
noOfRooms: { defaultValue: 1, editable: true,type: "number",validation: {min: 1, required: {message: "Required"}} }
}
}
},
pageSize: 25
}); // End of Kendo DataSource
/****************/
/** KENDO GRID **/
/****************/
var grid = $("#grid").kendoGrid({
dataSource: dataSource,
sortable: true,
editable: { mode: "inline" },
columns: [
{ field: "active", title:" ", filterable: false,
template: "# if (active=='y'){# <span class='k-icon ehors-status-active-icon'></span> #} else {# <span class='k-icon ehors-status-inactive-icon'></span> # }#"},
{ field: "propertyName", title:"Property Name", width: "80" },
{ field: "businessRegistrationNo", title:"Business Reg. No.", width: "80" },
{ field: "propertyLogo", title:"Logo", width: "80", editor: fileUploadEditor
,template: "<div class='propertyLogo'><a></a>#=propertyLogo#</div>" },
{ field: "propertyColor", title:"Color", width: "80px", editor : getColor, template: function(dataItem) {
return "<div style='background-color: " + dataItem.propertyColor + ";'> </div>";
}},
{ field: "noOfRooms", title:"No of Rooms", width: "80px", format: "", template: "<div class='unit'>#= noOfRooms#</div>" },
//Button Name
{ command: [{ name: "edit", text: {
edit: "Edit",
update: "Update",
cancel: "Cancel"} }
], title: "" }
],
save: onSave, // <-- checking duplicate error.
noRecords: {template: "No Records" }
}).data("kendoGrid"); //end of kendo grid
function fileUploadEditor(container, options) {
$('<input type="file" id="fileUpload" name="fileUpload" /> ')
.appendTo(container)
.kendoUpload({
multiple:false,
async: {
saveUrl: "./image.php",
autoUpload: true,
},
validation: {
allowedExtensions: [".jpg", ".png", ".jpeg"]
},
success: onSuccess, // just a console log to view progress
upload: onUpload, // just a console log to view progress
progress: onProgress // just a console log to view progress
});
}私のimage.php
画像は変数に変換されbase64て保存されhexStringます。呼び出されると、値getPropertyMasterData.phpがフェッチされhexStringます。現在、ここで、値が正常に返されていることがわかります。
<?php
$file = $_FILES['fileUpload'];
$fileName = $_FILES['fileUpload']['name'];
$fileTmpName = $_FILES['fileUpload']['tmp_name']; //directory location
$fileSize = $_FILES['fileUpload']['size'];
$fileError = $_FILES['fileUpload']['error']; //default 0 | 1 got error
$fileExt = explode('.', $fileName); //split file name to get ext name.
$fileActualExt = strtolower(end($fileExt)); //change to lowercase for the extension file
$allowed = array('jpg','jpeg','png');
if (!in_array($fileActualExt, $allowed)) {
return ['error' => 'You cannot upload files of this type!'];
}
if ($fileError !== 0) {
return ['error' => 'Error occur when upload file!'];
}
if ($fileSize > 500000) {
return ['error' => 'Your file size is too big!'];
}
$fileDestination = './uploads/' . $fileName;
move_uploaded_file($fileTmpName, $fileDestination);
$data = file_get_contents($fileTmpName);
return ['hexString' => base64_encode($data)];
?>私のgetPropertyMasterData.php
は
おそらく$uploadPayload['hexString']変数をフェッチしますimage.phpが、どういうわけかNULLの結果を返します。他のフィールドは問題なく動作します。
<?php
$propertyID = "1";
include($_SERVER['DOCUMENT_ROOT'] . '/TM.pdo.php');
$ehorsObj = new TM();
$ehorsObj->TM_CONNECT($propertyID);
$uploadPayload = require "image.php"; // READ FILE FROM image.php | Return NULL result
if (isset($uploadPayload['error'])) {
// echo $uploadPayload['error']);
/* do something in case of error */
}
$method = $_POST['method'];
switch ($method){
case "getPropertyMasterData" :
$method($ehorsObj);
break;
case "editPropertyMasterData" :
$method($ehorsObj, $uploadPayload['hexString']);
break;
default:
break;
}
/** READ **/
function getPropertyMasterData($ehorsObj) {
$getcheckbox = (isset($_POST['c1']) ? $_POST['c1'] : "all"); // by default select *
$sql = "SELECT * FROM tblAdmProperty ";
if ($getcheckbox == "true") {
$sql .= " WHERE active = 'y' ";
}
$sql .= " ORDER BY 2 ASC " ;
$array = array();
$GetResult = $ehorsObj->FetchData($sql, $ehorsObj->DEFAULT_PDO_CONNECTIONS);
while ($row = $GetResult->fetch()){
$array[] = $row;
}
header("Content-type: application/json");
$result = json_encode($array);
echo $result;
}
/** EDIT **/
function editPropertyMasterData($ehorsObj, $NewHexString) {
$propertyID = (isset($_POST['propertyID']) ? $_POST['propertyID'] : '');
$propertyName = (isset($_POST['propertyName']) ? $_POST['propertyName'] : '');
$propertyLogo = (isset($_POST['propertyLogo']) ? $_POST['propertyLogo'] : '');
$propertyColor = (isset($_POST['propertyColor']) ? $_POST['propertyColor'] : '');
$businessRegistrationNo = (isset($_POST['businessRegistrationNo']) ? $_POST['businessRegistrationNo'] : '');
$noOfRooms = (isset($_POST['noOfRooms']) ? $_POST['noOfRooms'] : '');
$active = (isset($_POST['active']) ? $_POST['active'] : '');
$sqlUpdate = " UPDATE tblAdmProperty
SET propertyName = '" . $propertyName . "',
propertyLogo = '" . $NewHexString . "',
propertyColor = '" . $propertyColor . "',
businessRegistrationNo = '" . $businessRegistrationNo . "',
noOfRooms = '" . $noOfRooms . "',
active = '" . $active . "'
WHERE propertyID = '" . $propertyID . "' ";
$ehorsObj->ExecuteData($sqlUpdate, $ehorsObj->DEFAULT_PDO_CONNECTIONS);
}
?>Cookieまたはセッションを使用すると機能しますが、使用しないようにしています。分かりやすい説明をお願いします。