0

kendoui でファイルをアップロードする実行例を教えてください。

ファイルをアップロードしようとして、ビュー ページでアップロードしようとしましたが、保存ボタンをクリックすると、ショー ページでそのファイルが見つかりません。インターネットで検索したところ、サーバーの問題が見つかりました。誰か教えてください。私の場合のサーバーの使用方法.私はgrailsプロジェクトに取り組んでいます

私が使用したコード:--

<tr class="prop">
 <td valign="top" class="name">
 <label>File Upload</label>
  <input name="photos[]" id="photos" type="file" /><script>$(document).ready(function ()$("#photos").kendoUpload({

  autoUpload:true,
  upload: onUpload,
  error: onError

   });
       function onError(e) {
                   // Array with information about the uploaded files
         var files = e.files;

            if (e.operation == "upload") {
              alert("Failed to uploaded " + files.length + " files");
                                        }

         // Suppress the default error message
                  e.preventDefault();
                 },
             function onUpload(e) {
               var files = e.files;
      if (e.operation == "upload") {
          alert("Successfully uploaded " + files.length + " files");
                   }
          });</script>
                    </td>
              </tr>

ビューファイルを作成しています:- create.gsp

<%@ page import="ten.SkeletonBill"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="layout" content="billing" />
<get var="entityName"
value="${message(code: 'skeletonBill.label', default: 'SkeletonBill')}" />
<title><g:message code="default.create.label"
args="[entityName]" /></title>
<script src="source/kendo.all.js"></script>
<link href="styles/kendo.common.css" rel="stylesheet" />
<link href="styles/kendo.default.css" rel="stylesheet" />

</head>
<body>
<content tag="menu-function">
<li><span class="k-link"><a href="#"
onclick="SkeletonBillForm.submit();return false;"><i
class="icon-plus-sign"></i>
<g:message code="default.button.save.label" /></a></span></li>
</content>
<div class="body">
<h1>
<g:message code="default.create.label" args="[entityName]" />
</h1>
<g:if test="${flash.message}">
<div class="message">
${flash.message}
</div>
</g:if>
<g:hasErrors bean="${skeletonBillInstance}">
<div class="alert alert-error">
<a class="close" data-dismiss="alert">×</a>
<g:renderErrors bean="${skeletonBillInstance}" as="list" />
</div>
</g:hasErrors>
<g:uploadForm name="SkeletonBillForm" action="save" method="post">
<div class="dialog">
<table>
<tbody>

<tr class="prop">
<td valign="top" class="name"><label for="bones"><g:message
code="skeletonBill.bones.label" default="Bones" /></label></td>
<td valign="top"
class="value ${hasErrors(bean: skeletonBillInstance, field: 'bones', 'errors')}">
<g:textField name="bones"
value="${fieldValue(bean: skeletonBillInstance, field: 'bones')}" />
</td>
</tr>

<tr class="prop">
<td valign="top" class="name"><label for="dateOfBirth"><g:message
code="skeletonBill.dateOfBirth.label" default="Date Of Birth" /></label>
</td>
<td valign="top"
class="value ${hasErrors(bean: skeletonBillInstance, field: 'dateOfBirth', 'errors')}">
<g:textField name="dateOfBirth"
value="${skeletonBillInstance?.dateOfBirth}" /> <script>$(document).ready(function () {$("#dateOfBirth").kendoDatePicker({format:"yyyy-MM-dd"})});</script>
</td>
</tr>
<tr class="prop">
<td valign="top" class="name">
<label>File Upload</label>

<input name="excelSheet" id="excelSheet" type="file" />

<script>
$(document).ready(function() {
    $("#excelSheet").kendoUpload();
},

        function onError(e) {
// Array with information about the uploaded files
            var files = e.files;

            if (e.operation == "upload") {
                alert("Failed to uploaded " + files.length + " files");
            }

// Suppress the default error message
            e.preventDefault();
        },
        function onUpload(e) {
            var files = e.files;
            if (e.operation == "upload") {
                alert("Successfully uploaded " + files.length + " files");
            }
        });
</script>
</td>
</tr>

</tbody>
</table>
</div>
</g:uploadForm>
</div>
</body>
</html>

また、Controller.gsp

def save = {
    def skeletonBillInstance = new SkeletonBill(params)


    if(!skeletonBillInstance.empty){
        println "Name: ${skeletonBill.bones}"
        flash.message = "${message(code: 'default.created.message', args: [message(code: 'skeletonBill.label', default: 'SkeletonBill'), skeletonBillInstance.id])}"
        redirect(action: "show", id: skeletonBillInstance.id)
    }
} else {
render(view: "create", model: [skeletonBillInstance: skeletonBillInstance])
}
}
4

1 に答える 1

0

いくつかのこと 1) KendoUI を使用する場合、gsp タグは使用しません。通常のフォーム タグを使用してフォームを定義してください。これを行う場合、grails はプロトタイプ プラグインを使用します。2) スクリプト コードとタグを混在させません。3) grails 2.0 を使用している場合は、KendoUI プラグインを使用できます。詳細については、 http://grails.org/plugin/kendo-ui を参照してください。

それが役立つことを願っています。

于 2012-04-30T13:44:34.127 に答える